@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

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

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

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

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* Stylesheet */
html {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 62.5%;
}

body {
  width: 100%;
  margin: 0;
  padding: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.3rem;
  line-height: 2rem;
  font-weight: 400;
  color: #656565;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
  -webkit-text-size-adjust: 100%;
  position: relative;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  display: block;
}

div {
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  -webkit-font-smoothing: antialiased;
  font-weight: normal;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, li {
  margin: 0;
  padding: 0;
  list-style: none;
}

a, a i {
  text-decoration: none;
  outline: none;
  color: #656565;
  -webkit-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}

a img {
  display: block;
  outline: none;
}

a:active {
  outline: none;
}

img {
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
  outline: none;
}

a:focus, a:active, input, textarea {
  outline: none;
}

a:hover, a:hover img, button:hover {
  opacity: 0.85;
}

button {
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
button:hover {
  cursor: pointer;
  opacity: 0.85;
}

.link-blue {
  color: #003165;
  text-decoration: underline;
}

.link-blue-blank {
  color: #003165;
  text-decoration: underline;
  position: relative;
}
.link-blue-blank::after {
  content: "";
  position: absolute;
  top: 9px;
  right: -15px;
  z-index: 8;
  width: 9px;
  height: 8px;
  background-image: url("/assets/images/commons/icon-blank.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 9px 8px;
}

::before, ::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.anchor {
  display: block;
  position: relative;
  top: -110px;
  visibility: hidden;
}
@media only screen and (max-width: 1180px) {
  .anchor {
    top: -90px;
  }
}

/* Wrapper */
#wrapper {
  position: relative;
}
#wrapper::before {
  visibility: hidden;
  opacity: 0;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
@media only screen and (max-width: 1180px) {
  #wrapper {
    padding-top: 100px;
  }
}
@media only screen and (max-width: 750px) {
  #wrapper {
    padding-top: 70px;
  }
}
#wrapper #mask {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  height: 100%;
  background-color: #fff;
}
#wrapper.drop-bg::before {
  visibility: visible;
  opacity: 1;
}

/* Header */
header {
  /*position: relative;*/
  z-index: 15;
  background-color: #fff;
  position: sticky; /* Make it stick/fixed */
  top: 0; /* Stay on top */
  width: 100%; /* Full width */
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
header.scroll-down {
  top: -110px;
}
@media only screen and (max-width: 1180px) {
  header.scroll-down {
    top: 0;
  }
}
@media only screen and (max-width: 1180px) {
  header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    border-bottom: 1px solid #E7E7E7;
  }
}
header .header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 110px;
}
@media only screen and (max-width: 1180px) {
  header .header {
    height: 100px;
  }
}
@media only screen and (max-width: 750px) {
  header .header {
    height: 70px;
  }
}
@media only screen and (max-width: 1180px) {
  header .header .left {
    width: 300px;
    min-width: 300px;
  }
}
@media only screen and (max-width: 900px) {
  header .header .left {
    width: 200px;
    min-width: 200px;
  }
}
@media only screen and (max-width: 750px) {
  header .header .left {
    width: 155px;
    min-width: 155px;
  }
}
header .header .left a {
  display: block;
}
header .header .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
}
@media only screen and (max-width: 1180px) {
  header .header .right {
    width: 100%;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
}
header .header .right .button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-right: 40px;
}
@media only screen and (max-width: 1180px) {
  header .header .right .button {
    margin-right: 20px;
  }
}
@media only screen and (max-width: 750px) {
  header .header .right .button {
    margin-right: 10px;
  }
}
@media only screen and (max-width: 750px) {
  header .header .right .button li a {
    height: 30px;
  }
}
header .header .right .button li a .hide750 {
  margin-right: 0;
}
header .header .right .button li + li {
  margin-left: 8px;
}
header .header .right .button li.box-login {
  display: none;
  margin-right: 15px;
  position: relative;
}
@media only screen and (max-width: 1180px) {
  header .header .right .button li.box-login {
    display: none !important;
  }
}
header .header .right .button li.box-login .name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #000;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
header .header .right .button li.box-login .name span {
  margin-right: 7px;
}
header .header .right .button li.box-login .name span img {
  width: 40px;
  min-width: 40px;
}
header .header .right .button li.box-login .box-abs {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 41px;
  left: 0;
  right: 0;
  z-index: 9;
  padding-top: 8px;
  width: 160px;
  margin-left: auto;
  margin-right: auto;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  background-image: url("/assets/images/commons/polygon-box-abs.svg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 9px 8px;
}
header .header .right .button li.box-login .box-abs .login-menu {
  width: 160px;
  margin-left: auto;
  margin-right: auto;
  padding: 28px 30px;
  background-color: #fff;
  border-radius: 4px;
  -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
}
header .header .right .button li.box-login .box-abs .login-menu a {
  display: block;
  color: #000;
}
header .header .right .button li.box-login .box-abs .login-menu a:hover {
  text-decoration: underline;
}
header .header .right .button li.box-login .box-abs .login-menu a + a {
  margin-top: 10px;
}
header .header .right .button li.box-login .box-abs.active {
  opacity: 1;
  visibility: visible;
}
@media only screen and (max-width: 900px) {
  header .header .right .button li a {
    font-size: 1.3rem;
    line-height: 1.6rem;
    padding: 0 10px;
  }
}
@media only screen and (max-width: 750px) {
  header .header .right .button li a {
    font-size: 0.9rem;
    line-height: 1.2rem;
    padding: 0 5px;
    white-space: nowrap;
  }
}
@media only screen and (max-width: 750px) {
  header .header .right .button li a span {
    display: none;
  }
}
header .header .right .lang {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 1180px) {
  header .header .right .lang {
    display: none;
  }
}
header .header .right .lang li {
  position: relative;
}
header .header .right .lang li + li {
  margin-left: 24px;
  padding-left: 25px;
}
header .header .right .lang li + li::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 8;
  width: 1px;
  height: 16px;
  margin-top: auto;
  margin-bottom: auto;
  background-color: #E7E7E7;
}
header .header .right .lang li a:hover {
  opacity: 1;
  color: #003165;
}
header .header .right .lang li a:hover.btn-lang span {
  background-image: url("/assets/images/commons/icon-language-hover.svg");
}
header .header .right .lang li a.btn-lang span {
  width: 16px;
  height: 16px;
  background-image: url("/assets/images/commons/icon-language.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
  -webkit-transition: background 0.1s ease-in-out;
  transition: background 0.1s ease-in-out;
}

.btn-burger {
  display: none;
  position: relative;
  padding-left: 20px;
}
@media only screen and (max-width: 750px) {
  .btn-burger {
    padding-left: 9%;
  }
}
.btn-burger::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: 8;
  width: 1px;
  height: 100%;
  background-color: #E7E7E7;
}
@media only screen and (max-width: 1180px) {
  .btn-burger {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

.bar-icon {
  position: relative;
}
.bar-icon:hover {
  opacity: 1;
}
.bar-icon .bar1, .bar-icon .bar2, .bar-icon .bar3 {
  width: 35px;
  height: 3px;
  margin: 9px 0;
  background-color: #000;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.open .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 9px);
  transform: rotate(-45deg) translate(-9px, 9px);
}
.open .bar2 {
  opacity: 0;
}
.open .bar3 {
  -webkit-transform: rotate(45deg) translate(-7px, -8px);
  transform: rotate(45deg) translate(-7px, -8px);
}

.status-login header .header .right .button li.box-login {
  display: block;
}
.status-login header .header .right .button li.btn-admission {
  display: none;
}
.status-login header .header .right .button li.btn-member {
  display: none;
}
.status-login .menu-responsive .box-login {
  display: table !important;
}

/* Menu Sticky */
#menu-sticky {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 14;
  width: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#menu-sticky.scroll-down {
  top: 110px;
}
@media only screen and (max-width: 1180px) {
  #menu-sticky {
    display: none;
  }
}
#menu-sticky.active .menu-sticky .row ul li a {
  padding: 8px 14px;
}
#menu-sticky .menu-sticky {
  height: 99px;
  border-top: 1px solid #E7E7E7;
}
#menu-sticky .menu-sticky .row {
  position: relative;
  background-color: #fff;
}
#menu-sticky .menu-sticky .row + .row {
  border-top: 1px solid #E7E7E7;
  border-bottom: 1px solid #E7E7E7;
}
#menu-sticky .menu-sticky .row ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
#menu-sticky .menu-sticky .row ul li {
  width: 25%;
}
#menu-sticky .menu-sticky .row ul li + li {
  border-left: 1px solid #E7E7E7;
}
#menu-sticky .menu-sticky .row ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 14px 14px;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  color: #000;
  position: relative;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
#menu-sticky .menu-sticky .row ul li a:hover {
  opacity: 1;
  background-color: #EBF4FA;
}
#menu-sticky .menu-sticky .row ul li a.dropdown-btn::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 8;
  width: 0%;
  height: 4px;
  margin-left: auto;
  margin-right: auto;
  background-color: #073165;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
#menu-sticky .menu-sticky .row ul li a.dropdown-btn::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 11px;
  margin-top: 2px;
  margin-left: 3px;
  background-image: url("/assets/images/commons/btn-page-down.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 11px;
}
#menu-sticky .menu-sticky .row ul li a.dropdown-btn span {
  margin-left: 8px;
}
#menu-sticky .menu-sticky .row ul li a.dropdown-btn.active::before {
  width: 85%;
}
#menu-sticky .menu-sticky .row ul li a.dropdown-btn.active::after {
  background-image: url("/assets/images/commons/btn-page-up.svg") !important;
}
#menu-sticky .menu-sticky .row ul li a.lock::before {
  content: "";
  position: absolute;
  top: 7px;
  right: 6px;
  z-index: 8;
  display: block;
  width: 10px;
  height: 12px;
  background-image: url("/assets/images/commons/icon-lock.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 12px;
}
#menu-sticky .menu-sticky .row .dropdown-content {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  z-index: 12;
  margin-top: 1px;
  margin-left: auto;
  margin-right: auto;
  padding: 32px 0;
  background-color: #fff;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col {
  width: 24%;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box + .box {
  margin-top: 5.5%;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 100%;
  border: 0px solid #24A2E9;
  border-radius: 4px;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 7;
  width: 100%;
  height: 100%;
  background-image: url("/assets/images/commons/btn-page-next-white.svg");
  background-repeat: no-repeat;
  background-position: bottom 15px right 15px;
  background-size: 12px 9px;
  background-color: rgba(0, 0, 0, 0.25);
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a:hover {
  opacity: 1;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a:hover img {
  opacity: 1;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a:hover::before {
  border-width: 8px;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a .text {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a .text p {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  color: #fff;
}
#menu-sticky .menu-sticky .row .dropdown-content .col4 .col .box a img {
  width: 100%;
  height: auto;
}
#menu-sticky .menu-sticky .row .dropdown-content .dropdown-close {
  display: table;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
}

.menu-sticky-remark {
  padding: 14px 0;
}
@media only screen and (max-width: 1180px) {
  .menu-sticky-remark {
    display: none;
  }
}
.menu-sticky-remark p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.1rem;
  line-height: 1.6rem;
  color: #000;
}
.menu-sticky-remark p span {
  margin-right: 3px;
}

/* Menu Responsive */
.menu-responsive {
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
  width: 100%;
  height: 100%;
  background-color: #fff;
  padding-top: 100px;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  overflow: auto;
}
@media only screen and (max-width: 750px) {
  .menu-responsive {
    padding-top: 70px;
  }
}
.menu-responsive.active {
  opacity: 1;
  visibility: visible;
}
.menu-responsive .box-login {
  display: none;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
  margin-bottom: 20px;
}
.menu-responsive .box-login .name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #000;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
.menu-responsive .box-login .name span {
  margin-right: 7px;
}
.menu-responsive .box-login .name span img {
  width: 25px;
  min-width: 25px;
}
.menu-responsive .box-login ul {
  margin-top: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.menu-responsive .box-login ul li {
  position: relative;
}
.menu-responsive .box-login ul li + li::before {
  content: "|";
  margin-left: 10px;
  margin-right: 7px;
}
.menu-responsive .box-login ul li a {
  font-size: 1.1rem;
  line-height: 1.1rem;
}
.menu-responsive nav ul {
  border-top: 1px solid #E7E7E7;
}
.menu-responsive nav ul li {
  border-bottom: 1px solid #E7E7E7;
}
.menu-responsive nav ul li a {
  display: table;
  margin-left: auto;
  margin-right: auto;
  padding: 14px 20px 14px 0;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  color: #000;
  text-align: center;
  position: relative;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
.menu-responsive nav ul li a:hover {
  opacity: 1;
  color: #003165;
}
.menu-responsive nav ul li a.dropdown-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.menu-responsive nav ul li a.dropdown-btn::after {
  margin-left: 8px;
  content: "";
  display: inline-block;
  width: 8px;
  height: 13px;
  background-image: url("/assets/images/commons/btn-page-down.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 13px;
}
.menu-responsive nav ul li a.dropdown-btn.active::after {
  background-image: url("/assets/images/commons/btn-page-up.svg");
}
.menu-responsive nav ul li a.lock::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 8;
  display: block;
  width: 10px;
  height: 12px;
  margin-top: auto;
  margin-bottom: auto;
  background-image: url("/assets/images/commons/icon-lock.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 12px;
}
.menu-responsive nav ul li .toggle-content {
  border-top: 0;
  padding: 14px 0 14px 0;
  background-color: #F5F5F5;
}
.menu-responsive nav ul li .toggle-content li {
  border-bottom: 0;
}
.menu-responsive nav ul li .toggle-content li a {
  padding: 10px 0;
}
.menu-responsive .remark {
  padding: 14px 5%;
}
.menu-responsive .remark p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.1rem;
  line-height: 1.6rem;
  color: #000;
}
.menu-responsive .remark p span {
  margin-right: 3px;
}
.menu-responsive .button {
  margin-top: 25px;
}
.menu-responsive .button ul li + li {
  margin-top: 10px;
}
.menu-responsive .lang {
  margin-top: 35px;
}
.menu-responsive .lang ul li + li {
  margin-top: 25px;
}
.menu-responsive .close {
  display: table;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 40px;
}

/* Breadcrumb */
#breadcrumb {
  padding: 8px 0;
}
#breadcrumb .breadcrumb ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#breadcrumb .breadcrumb ul li {
  position: relative;
  font-size: 1.1rem;
  line-height: 1.6rem;
  color: #000;
}
#breadcrumb .breadcrumb ul li + li {
  margin-left: 10px;
  padding-left: 12px;
}
#breadcrumb .breadcrumb ul li + li::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 8;
  margin-top: auto;
  margin-bottom: auto;
  display: table;
  width: 2px;
  height: 2px;
  background-color: #656565;
}
#breadcrumb .breadcrumb ul li a {
  color: #656565;
}

/* Main */
.content-1336 {
  width: 100%;
  max-width: 1336px;
  margin-left: auto;
  margin-right: auto;
}

.content-1280 {
  width: 90%;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}

.content-1200 {
  width: 90%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.content-1168 {
  width: 90%;
  max-width: 1168px;
  margin-left: auto;
  margin-right: auto;
}

.content-1024 {
  width: 90%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
}

.content-850 {
  width: 90%;
  max-width: 850px;
  margin-left: auto;
  margin-right: auto;
}

.content-800 {
  width: 90%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.content-800-pad {
  width: 100%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 40px;
}
@media only screen and (max-width: 900px) {
  .content-800-pad {
    padding: 0 20px;
  }
}
@media only screen and (max-width: 750px) {
  .content-800-pad {
    padding: 0;
  }
}

.content-720 {
  width: 90%;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.content-770 {
  width: 90%;
  max-width: 770px;
  margin-left: auto;
  margin-right: auto;
}

.mt0 {
  margin-top: 0 !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.pt0 {
  padding-top: 0 !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.pad40 {
  padding-top: 40px;
  padding-bottom: 40px;
}
@media only screen and (max-width: 750px) {
  .pad40 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.pad75 {
  padding-top: 75px;
  padding-bottom: 75px;
}
@media only screen and (max-width: 900px) {
  .pad75 {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 750px) {
  .pad75 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

.pad75100 {
  padding-top: 75px;
  padding-bottom: 100px;
}
@media only screen and (max-width: 900px) {
  .pad75100 {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 750px) {
  .pad75100 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

.pad75125 {
  padding-top: 75px;
  padding-bottom: 125px;
}
@media only screen and (max-width: 900px) {
  .pad75125 {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 750px) {
  .pad75125 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

.color-pink {
  color: #DB0D81 !important;
}

.color-white {
  color: #fff !important;
}

.color-black {
  color: #000 !important;
}

.color-grey {
  color: #979797 !important;
}

.bg-grey {
  background-color: #F5F5F5;
}

.bg-grey-light {
  background-color: #FAFAFA;
}

.bg-grey-grid {
  background-image: url("/assets/images/commons/bg-grey-grid.jpg");
  background-repeat: repeat;
  background-position: top left;
  background-size: 86px;
}

.toggle-content {
  display: none;
}

.txthead-box.center {
  text-align: center;
}
.txthead-box.mb60 {
  margin-bottom: 60px;
}
@media only screen and (max-width: 1180px) {
  .txthead-box.mb60 {
    margin-bottom: 45px;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb60 {
    margin-bottom: 30px;
  }
}
.txthead-box.mb50 {
  margin-bottom: 50px;
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb50 {
    margin-bottom: 40px;
  }
}
.txthead-box.mb40 {
  margin-bottom: 40px;
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb40 {
    margin-bottom: 30px;
  }
}
.txthead-box.mb35 {
  margin-bottom: 35px;
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb35 {
    margin-bottom: 25px;
  }
}
.txthead-box.mb30 {
  margin-bottom: 30px;
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb30 {
    margin-bottom: 20px;
  }
}
.txthead-box.mb25 {
  margin-bottom: 25px;
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb25 {
    margin-bottom: 20px;
  }
}
.txthead-box.mb20 {
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  .txthead-box.mb20 {
    margin-bottom: 15px;
  }
}
.txthead-box.with-line {
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
}
.txthead-box .fz40 {
  font-size: 4rem;
  line-height: 5rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz40 {
    font-size: 3.6rem;
    line-height: 4.6rem;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz40 {
    font-size: 3.2rem;
    line-height: 4.2rem;
  }
}
.txthead-box .fz32 {
  font-size: 3.2rem;
  line-height: 4.2rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz32 {
    font-size: 3rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz32 {
    font-size: 2.6rem;
    line-height: 3.6rem;
  }
}
.txthead-box .fz32 .fz48 {
  font-size: 4.8rem;
  line-height: 4.2rem;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz32 .fz48 {
    font-size: 4.6rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz32 .fz48 {
    font-size: 4.2rem;
    line-height: 3.6rem;
  }
}
.txthead-box .fz28 {
  font-size: 2.8rem;
  line-height: 3.8rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz28 {
    font-size: 2.6rem;
    line-height: 3.6rem;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz28 {
    font-size: 2.4rem;
    line-height: 3.4rem;
  }
}
.txthead-box .fz28 .fz18 {
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz28 .fz18 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz28 .fz18 {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
.txthead-box .fz24 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz24 {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz24 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
.txthead-box .fz24 + .fz32 {
  margin-top: 10px;
}
@media only screen and (max-width: 750px) {
  .txthead-box .fz24 + .fz32 {
    margin-top: 0;
  }
}
.txthead-box .fz20 {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
}
@media only screen and (max-width: 1180px) {
  .txthead-box .fz20 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}

.btn-box.mt60 {
  margin-top: 60px;
}
@media only screen and (max-width: 900px) {
  .btn-box.mt60 {
    margin-top: 40px;
  }
}
.btn-box.mt40 {
  margin-top: 40px;
}
.btn-box.mt30 {
  margin-top: 30px;
}
.btn-box.mt25 {
  margin-top: 25px;
}
.btn-box.mt10 {
  margin-top: 10px;
}
.btn-box.mb25 {
  margin-bottom: 25px;
}
@media only screen and (max-width: 750px) {
  .btn-box.mb25 {
    margin-bottom: 20px;
  }
}
.btn-box .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.btn-box .flex a, .btn-box .flex button {
  margin-left: 8px;
  margin-right: 8px;
}
.btn-box.table {
  display: table;
}
.btn-box.table.right {
  margin-left: auto;
}

.btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
  font-size: 1.5rem;
  line-height: 1.5rem;
  color: #000;
  font-weight: 500;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.btn u {
  text-decoration: underline;
}
.btn.medium {
  font-weight: 600;
  height: 56px;
  border-width: 1px !important;
}
.btn.big {
  font-weight: 600;
  height: 62px;
  border-width: 2px !important;
}
.btn.link {
  height: auto;
}
.btn.link-polygon-left {
  font-size: 1.3rem;
  line-height: 1.3rem;
  color: #003165;
  height: auto;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: top 3px left;
  background-size: 12px 9px;
  padding-left: 17px;
}
.btn.disable {
  pointer-events: none;
  color: #979797 !important;
  border-color: #E7E7E7 !important;
  background-color: #E7E7E7 !important;
}
.btn.pink {
  color: #fff;
  background-color: #BE3A6D;
  border: 1px solid #BE3A6D;
}
.btn.pink-border {
  color: #BE3A6D;
  background-color: #fff;
  border: 1px solid #BE3A6D;
}
.btn.blue {
  color: #fff;
  background-color: #003165;
  border: 1px solid #003165;
}
.btn.green {
  color: #fff;
  background-color: #0b8485;
  border: 1px solid #0b8485;
}
.btn.blue-border {
  color: #003165;
  background-color: #fff;
  border: 1px solid #003165;
}
.btn.blue-border:hover {
  opacity: 1;
  background-color: #EBF4FA;
}
.btn.blue-dark {
  color: #003165;
  background-color: #fff;
  border: 1px solid #fff;
}
.btn.blue-dark-bg {
  color: #fff;
  background-color: #003165;
  border: 1px solid #003165;
}
.btn.blue-dark-border {
  color: #003165;
  background-color: #fff;
  border: 1px solid #003165;
}
.btn.blue-dark-border:hover {
  opacity: 1;
  background-color: #EBF4FA;
}
.btn.icon-left span {
  margin-right: 6px;
}
.btn.icon-right span {
  margin-left: 6px;
}
.btn.icon-abs-right {
  position: relative;
}
.btn.icon-abs-right span {
  position: absolute;
  right: 15px;
  z-index: 8;
}
.btn.arrow-left {
  background-image: url("/assets/images/commons/btn-page-prev.svg");
  background-repeat: no-repeat;
  background-position: center left 15px;
  background-size: 12px 9px;
}
.btn.arrow-right {
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 12px 9px;
}
.btn.arrow-down {
  background-image: url("/assets/images/commons/btn-page-down.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 9px 12px;
}
.btn.polygon-right {
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 12px 9px;
}
.btn.polygon-down {
  background-image: url("/assets/images/commons/arrow-down-blue.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 9px 6px;
}
.btn.w-auto {
  padding: 0 25px;
}
.btn.w-100p {
  width: 100%;
}
.btn.w-140 {
  width: 100%;
  max-width: 140px;
}
.btn.w-160 {
  width: 100%;
  max-width: 160px;
}
.btn.w-180 {
  width: 100%;
  max-width: 180px;
}
.btn.w-200 {
  width: 100%;
  max-width: 200px;
}
.btn.w-240 {
  width: 100%;
  max-width: 240px;
}
.btn.w-260 {
  width: 100%;
  max-width: 260px;
}
.btn.w-320 {
  width: 100%;
  max-width: 320px;
}
.btn.w-400 {
  width: 100%;
  max-width: 400px;
}
.btn.center {
  margin-left: auto;
  margin-right: auto;
}
.btn.right {
  margin-left: auto;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.disable-opacity {
  opacity: 0.25 !important;
  pointer-events: none;
}

.btn-page.w720 {
  width: 100%;
  max-width: 720px;
}
.btn-page.mt80 {
  margin-top: 80px;
}
@media only screen and (max-width: 900px) {
  .btn-page.mt80 {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 750px) {
  .btn-page.mt80 {
    margin-top: 30px;
  }
}
.btn-page ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.btn-page ul.block-center {
  display: table;
  margin-left: auto;
  margin-right: auto;
}
.btn-page ul.white li a {
  border-color: #fff;
  background-color: #fff;
}
.btn-page ul li.prev {
  margin-right: 20px;
}
@media only screen and (max-width: 900px) {
  .btn-page ul li.prev {
    margin-right: 10px;
  }
}
.btn-page ul li.prev a {
  width: 140px;
  background-image: url("/assets/images/commons/btn-page-prev.svg");
  background-repeat: no-repeat;
  background-position: left 15px center;
  background-size: 12px 9px;
}
.btn-page ul li.prev a.disable {
  color: #979797;
  background-color: #E7E7E7;
  border-color: #E7E7E7;
  background-image: url("/assets/images/commons/btn-page-prev-dis.svg");
  pointer-events: none;
}
.btn-page ul li.no {
  margin: 0 4px;
}
@media only screen and (max-width: 900px) {
  .btn-page ul li.no {
    display: none;
  }
}
.btn-page ul li.no.current a {
  color: #979797;
  background-color: #E7E7E7;
  border-color: #E7E7E7;
}
.btn-page ul li.next {
  margin-left: 20px;
}
@media only screen and (max-width: 900px) {
  .btn-page ul li.next {
    margin-left: 10px;
  }
}
.btn-page ul li.next a {
  width: 140px;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px 9px;
}
.btn-page ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #003165;
  font-size: 1.5rem;
  line-height: 1.5rem;
  font-weight: 500;
  color: #003165;
  border-radius: 4px;
}

.sub-cat-scroll.mb80 {
  margin-bottom: 80px;
}
@media only screen and (max-width: 900px) {
  .sub-cat-scroll.mb80 {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll.mb80 {
    margin-bottom: 40px;
  }
}
.sub-cat-scroll.mb35 {
  margin-bottom: 35px;
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll.mb35 {
    margin-bottom: 25px;
  }
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll.mb35 {
    margin-bottom: 40px;
  }
}
.sub-cat-scroll.mt50 {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll.mt50 {
    margin-top: 25px;
  }
}
.sub-cat-scroll ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: -8px;
}
.sub-cat-scroll ul.col4 {
  margin-top: -16px;
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll ul.col4 {
    margin-top: -8px;
  }
}
.sub-cat-scroll ul.col4 li {
  width: 23%;
  margin-top: 16px;
}
@media only screen and (max-width: 900px) {
  .sub-cat-scroll ul.col4 li {
    width: 33.33%;
  }
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll ul.col4 li {
    width: 100%;
    margin-top: 8px;
    margin-left: 0;
    margin-right: 0;
  }
}
.sub-cat-scroll ul.col-auto li {
  width: auto;
  min-width: 130px;
}
@media only screen and (max-width: 900px) {
  .sub-cat-scroll ul.col-auto li {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}
.sub-cat-scroll ul.col-auto li a {
  padding: 0 35px;
}
.sub-cat-scroll ul li {
  width: 16%;
  margin-top: 8px;
  margin-left: 8px;
  margin-right: 8px;
}
@media only screen and (max-width: 1180px) {
  .sub-cat-scroll ul li {
    width: 25%;
  }
}
@media only screen and (max-width: 750px) {
  .sub-cat-scroll ul li {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}

.intro-text.mb75 {
  margin-bottom: 75px;
}
@media only screen and (max-width: 1180px) {
  .intro-text.mb75 {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 750px) {
  .intro-text.mb75 {
    margin-bottom: 30px;
  }
}
.intro-text.mb50 {
  margin-bottom: 50px;
}
@media only screen and (max-width: 750px) {
  .intro-text.mb50 {
    margin-bottom: 30px;
  }
}
.intro-text.mb30 {
  margin-bottom: 30px;
}
@media only screen and (max-width: 750px) {
  .intro-text.mb30 {
    margin-bottom: 30px;
  }
}
.intro-text p {
  font-size: 1.7rem;
  line-height: 3.2rem;
  font-weight: 500;
  text-align: center;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .intro-text p {
    font-size: 1.6rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  .intro-text p {
    font-size: 1.5rem;
    line-height: 2.8rem;
  }
}
.intro-text p.small {
  margin-top: 25px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 400;
}
@media only screen and (max-width: 1180px) {
  .intro-text p.small {
    margin-top: 20px;
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 750px) {
  .intro-text p.small {
    margin-top: 10px;
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.intro-text p.fw400 {
  font-weight: 400;
}

/* MV */
#mv .mv .mv-slick .slick-slide > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#mv .mv .mv-slick .slick-list .slick-track .slick-slide div .item img {
  width: 100%;
  height: auto;
}
#mv .mv .mv-slick .slick-list .slick-track .slick-slide div .item a {
  display: block;
}
#mv .mv .mv-important {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 44px;
  padding: 2px;
  background-color: #DE2200;
  overflow: hidden;
}
@media only screen and (max-width: 900px) {
  #mv .mv .mv-important {
    display: block;
    min-height: auto;
  }
}
#mv .mv .mv-important .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 230px;
  min-width: 230px;
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 500;
  color: #fff;
}
@media only screen and (max-width: 1180px) {
  #mv .mv .mv-important .ttl {
    width: 180px;
    min-width: 180px;
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #mv .mv .mv-important .ttl {
    width: auto;
    margin-left: auto;
    margin-right: auto;
    padding: 2px 0 4px 0;
  }
}
@media only screen and (max-width: 750px) {
  #mv .mv .mv-important .ttl {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#mv .mv .mv-important .ttl span {
  margin-right: 5px;
}
#mv .mv .mv-important .content {
  width: 100%;
  padding: 5px 20px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: auto;
}
@media only screen and (max-width: 900px) {
  #mv .mv .mv-important .content {
    padding: 10px 15px;
  }
}
#mv .mv .mv-important .content .scroll {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 900px) {
  #mv .mv .mv-important .content .scroll {
    display: block;
  }
}
#mv .mv .mv-important .content .scroll .date {
  width: 75px;
  min-width: 75px;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
@media only screen and (max-width: 900px) {
  #mv .mv .mv-important .content .scroll .date {
    width: auto;
    margin-bottom: 5px;
  }
}
#mv .mv .mv-important .content .scroll .topic {
  width: 100%;
  font-size: 1.5rem;
  line-height: 2rem;
  color: #DE2200;
}
@media only screen and (max-width: 1180px) {
  #mv .mv .mv-important .content .scroll .topic {
    font-size: 1.4rem;
    line-height: 1.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #mv .mv .mv-important .content .scroll .topic {
    font-size: 1.3rem;
    line-height: 1.8rem;
  }
}

.dots-circle {
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
  z-index: 8;
  display: table;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.dots-circle li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 4px;
}
.dots-circle li button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 12px;
  max-width: 12px;
  min-width: 12px;
  height: 12px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  background-color: #E7E7E7;
  border-radius: 100%;
  border: 0;
}
.dots-circle li button:hover {
  cursor: pointer;
}
.dots-circle li.slick-active button {
  background-color: #003165;
}

.dots-circle-static {
  position: static;
  margin-top: 25px;
  display: table;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.dots-circle-static li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 4px;
}
.dots-circle-static li button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 12px;
  max-width: 12px;
  min-width: 12px;
  height: 12px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  background-color: #E7E7E7;
  border-radius: 100%;
  border: 0;
}
.dots-circle-static li button:hover {
  cursor: pointer;
}
.dots-circle-static li.slick-active button {
  background-color: #003165;
}

.slick-arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 9;
  display: table;
  margin-top: auto;
  margin-bottom: auto;
  width: 28px;
  height: 145px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 28px 145px;
  border: 0;
  -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.15);
  border-radius: 4px;
}
.slick-arrow:hover {
  cursor: pointer;
}

.slick-prev {
  left: 0px;
  background-image: url("/assets/images/commons/btn-slick-prev.svg");
}

.slick-next {
  right: 0px;
  background-image: url("/assets/images/commons/btn-slick-next.svg");
}

/* Admission / Features */
#admission-features .admission-features ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #admission-features .admission-features ul {
    display: block;
  }
}
#admission-features .admission-features ul li {
  width: 48.829%;
  border-radius: 4px;
  overflow: hidden;
  /*&:first-child {
      a {
          background-color: #FADCF3;
          .button {
              p {
                  background-color: #DB0D81;
              }
          }
      }
  }
  &:last-child {
      @include mediaquery-750 {
          margin-top: 3%;   
      }
      a {
          background-color: #BCE9FF;
          .button {
              p {
                  background-color: #0FA2E9;
              }
          }
      }
  }*/
}
@media only screen and (max-width: 1180px) {
  #admission-features .admission-features ul li {
    width: 49%;
  }
}
@media only screen and (max-width: 750px) {
  #admission-features .admission-features ul li {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #admission-features .admission-features ul li + li {
    margin-top: 3%;
  }
}
#admission-features .admission-features ul li a {
  display: block;
  /*width: 100%;
  height: 100%;
  padding: 17px 17px 24px 17px;
  background-image: url("/assets/images/commons/arrow-right-white.svg");
  background-repeat: no-repeat;
  background-position: center right 16px;
  background-size: 14px 22px;
  @include mediaquery-1100 {
      padding: 17px 30px 24px 30px;   
  }
  h2 {
      font-size: 2.4rem;
      line-height: 3.4rem;
      font-weight: 600;
      color: #000;
      text-align: center;
      margin-bottom: 8px;
      @include mediaquery-1100 {
          font-size: 2.2rem;
          line-height: 3.2rem;
      }
      @include mediaquery-750 {
          font-size: 2rem;
          line-height: 3rem;
      }
  }
  p {
      color: #000;
      text-align: center;
  }
  .button {
      margin-top: 12px;
      display: table;
      min-width: 180px;
      margin-left: auto;
      margin-right: auto;
      p {
          min-height: 28px;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          font-size: 1.5rem;
          color: #fff;
          border-radius: 64px;
          span {
              margin-right: 5px;
          }
      }
  }*/
}

/* Company */
#company {
  background-image: url("/assets/images/top/company-bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
#company .company .content .company-slick .slick-list {
  overflow: visible;
}
#company .company .content .company-slick .slick-slide > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#company .company .content .company-slick .item {
  max-width: 342px;
  padding: 0 10px;
}
@media only screen and (max-width: 750px) {
  #company .company .content .company-slick .item {
    max-width: 315px;
  }
}
#company .company .content .company-slick .item .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #fff;
  border-radius: 4px;
  overflow: hidden;
  height: 100%;
}
#company .company .content .company-slick .item .box:hover {
  opacity: 1;
}
#company .company .content .company-slick .item .box:hover .detail .cover img {
  opacity: 1;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
#company .company .content .company-slick .item .detail .cover {
  overflow: hidden;
}
#company .company .content .company-slick .item .detail .cover img {
  width: 100%;
  height: auto;
  -webkit-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
#company .company .content .company-slick .item .detail .text {
  padding: 15px;
}
#company .company .content .company-slick .item .detail .text h3 {
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 600;
  color: #000;
  min-height: 50px;
  -webkit-transition: color 0.25s ease-in-out;
  transition: color 0.25s ease-in-out;
}
@media only screen and (max-width: 1180px) {
  #company .company .content .company-slick .item .detail .text h3 {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#company .company .content .company-slick .item .detail .text p {
  margin-top: 10px;
}
#company .company .content .company-slick .item .detail .text ul {
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#company .company .content .company-slick .item .detail .text ul li {
  min-width: 104px;
  margin-right: 8px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  font-weight: 600;
  padding: 1px 2px;
  text-align: center;
  border: 1px solid #E3E3E3;
  border-radius: 9px;
}
#company .company .content .company-slick .item .date {
  padding: 15px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  text-align: right;
}

#company-inner .company-inner .content .company-regis {
  margin-bottom: 40px;
}
#company-inner .company-inner .content .company-regis p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 500;
  color: #000;
  text-align: right;
}
@media only screen and (max-width: 1180px) {
  #company-inner .company-inner .content .company-regis p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#company-inner .company-inner .content .company-regis p span {
  font-size: 3.2rem;
}
@media only screen and (max-width: 1180px) {
  #company-inner .company-inner .content .company-regis p span {
    font-size: 3rem;
  }
}
#company-inner .company-inner .content .company-regis p small {
  margin-top: 5px;
  display: block;
  font-size: 1.1rem;
  line-height: 1.6rem;
  font-weight: 400;
}
#company-inner .company-inner .content .company-filter {
  margin-bottom: 50px;
  padding: 40px 0;
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-filter {
    margin-bottom: 40px;
    padding: 30px 0;
  }
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-filter .btn-box {
    margin-top: 30px;
    padding: 0 20px;
  }
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-filter .btn-box .flex {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-filter .btn-box .flex button {
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-filter .btn-box .flex button + button {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-filter .btn-box .flex button {
    width: 100%;
    max-width: 100%;
  }
}
#company-inner .company-inner .content .company-detail {
  width: 100%;
  max-width: 770px;
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 900px) {
  #company-inner .company-inner .content .company-detail {
    margin-top: 50px;
  }
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-detail {
    margin-top: 40px;
  }
}
#company-inner .company-inner .content .company-detail .table {
  border-top: 1px solid #E7E7E7;
}
#company-inner .company-inner .content .company-detail .table .tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px 0;
  border-bottom: 1px solid #E7E7E7;
}
#company-inner .company-inner .content .company-detail .table .tr .td {
  width: 100%;
}
#company-inner .company-inner .content .company-detail .table .tr .td p {
  color: #000;
  line-height: 2.5rem;
}
#company-inner .company-inner .content .company-detail .table .tr .td:nth-child(1) {
  width: 130px;
  min-width: 130px;
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-detail .table .tr .td:nth-child(1) {
    width: 100px;
    min-width: 100px;
  }
}
#company-inner .company-inner .content .company-detail .table .tr .td:nth-child(2) p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-detail .table .tr .td:nth-child(2) p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#company-inner .company-inner .content .company-detail .table .tr .td:nth-child(2) p + p {
  margin-top: 10px;
}
#company-inner .company-inner .content .company-detail .table .tr .td:nth-child(2) p a {
  color: #003165;
  text-decoration: underline;
}
#company-inner .company-inner .content .company-detail .table .tr .td:nth-child(2) p a[target=_blank] {
  padding-right: 16px;
  background-image: url("/assets/images/commons/icon-blank.svg");
  background-repeat: no-repeat;
  background-position: top 8px right;
  background-size: 9px 8px;
}
#company-inner .company-inner .content .company-detail .red {
  margin-top: 40px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #DE2200;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-detail .red {
    font-size: 1.3rem;
    line-height: 2.3rem;
    margin-top: 30px;
  }
}
#company-inner .company-inner .content .company-detail .btn {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  #company-inner .company-inner .content .company-detail .btn {
    margin-top: 30px;
  }
}

.company-list .result {
  margin-bottom: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 750px) {
  .company-list .result {
    display: block;
  }
}
.company-list .result .ttl p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .company-list .result .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  .company-list .result .ttl p {
    text-align: center;
  }
}
.company-list .result .ttl p span {
  font-size: 3.2rem;
}
@media only screen and (max-width: 1180px) {
  .company-list .result .ttl p span {
    font-size: 3rem;
  }
}
.company-list .result .sort {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  .company-list .result .sort {
    display: block;
  }
}
.company-list .result .sort p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  white-space: nowrap;
  padding-right: 15px;
}
@media only screen and (max-width: 750px) {
  .company-list .result .sort p {
    text-align: center;
    padding-right: 0;
    margin-top: 5px;
    margin-bottom: 10px;
  }
}
.company-list .result .sort select {
  width: 240px;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: -moz-center;
  text-align: -webkit-center;
  margin: auto;
}
@media only screen and (max-width: 750px) {
  .company-list .result .sort select {
    display: table;
    width: 100%;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
  }
}
.company-list ul {
  border-top: 1px solid #E7E7E7;
}
.company-list ul.type2 {
  border-top: 0;
}
.company-list ul.type2 li {
  border-bottom: 0;
}
.company-list ul.type2 li .box {
  background-image: url("/assets/images/commons/topic-line-grid.svg"), url("/assets/images/commons/topic-line-grid.svg");
  background-repeat: repeat-x;
  background-position: top left, bottom left;
  background-size: 6px 9px;
}
.company-list ul.type2 li .box:hover {
  opacity: 1;
  background-color: transparent;
}
.company-list ul.type2 li .box:hover a:hover {
  opacity: 0.8;
  background-color: transparent;
}
.company-list ul.type-new-company {
  border-top: 0;
}
.company-list ul.type-new-company li {
  border-bottom: 0;
}
.company-list ul.type-new-company li + li {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  .company-list ul.type-new-company li + li {
    margin-top: 20px;
  }
}
.company-list ul.type-new-company li a {
  background-image: none;
  background-color: #fff;
  border-radius: 4px;
  overflow: hidden;
}
.company-list ul.type-new-company li a .cover {
  width: 360px;
  min-width: 360px;
}
@media only screen and (max-width: 750px) {
  .company-list ul.type-new-company li a .cover {
    width: 100%;
    min-width: 100%;
  }
}
.company-list ul.type-new-company li a .cover + .brief {
  padding-left: 30px;
}
@media only screen and (max-width: 750px) {
  .company-list ul.type-new-company li a .cover + .brief {
    padding-left: 0;
    margin-top: 10px;
  }
}
.company-list ul.type-new-company li a .brief .ttl h2 {
  padding-left: 18px;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: top 10px left;
  background-size: 12px 9px;
}
.company-list ul.type-new-company li a .brief .des p.date {
  margin-top: 25px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  text-align: right;
}
.company-list ul li {
  border-bottom: 1px solid #E7E7E7;
}
.company-list ul li a, .company-list ul li .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 40px 80px 40px 40px;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: center right 25px;
  background-size: 12px 9px;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
@media only screen and (max-width: 900px) {
  .company-list ul li a, .company-list ul li .box {
    padding: 30px 70px 30px 30px;
  }
}
@media only screen and (max-width: 750px) {
  .company-list ul li a, .company-list ul li .box {
    padding: 25px 20px 25px 20px;
    display: block;
    background-image: none;
  }
}
.company-list ul li a:hover, .company-list ul li .box:hover {
  opacity: 1;
  background-color: #F5F5F5;
}
.company-list ul li a:hover .cover img, .company-list ul li .box:hover .cover img {
  opacity: 1;
}
.company-list ul li a .cover, .company-list ul li .box .cover {
  width: 240px;
  min-width: 240px;
}
@media only screen and (max-width: 900px) {
  .company-list ul li a .cover, .company-list ul li .box .cover {
    width: 180px;
    min-width: 180px;
  }
}
@media only screen and (max-width: 750px) {
  .company-list ul li a .cover, .company-list ul li .box .cover {
    width: 100%;
    min-width: 100%;
  }
}
.company-list ul li a .cover + .brief, .company-list ul li .box .cover + .brief {
  padding-left: 20px;
}
@media only screen and (max-width: 750px) {
  .company-list ul li a .cover + .brief, .company-list ul li .box .cover + .brief {
    padding-left: 0;
    margin-top: 10px;
  }
}
.company-list ul li a .cover img, .company-list ul li .box .cover img {
  width: 100%;
  height: auto;
  border: 1px solid #ccc;
}
.company-list ul li a .brief, .company-list ul li .box .brief {
  width: 100%;
}
.company-list ul li a .brief .ttl h2, .company-list ul li .box .brief .ttl h2 {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .company-list ul li a .brief .ttl h2, .company-list ul li .box .brief .ttl h2 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
.company-list ul li a .brief .ttl p, .company-list ul li .box .brief .ttl p {
  margin-top: 5px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  .company-list ul li a .brief .ttl p, .company-list ul li .box .brief .ttl p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
.company-list ul li a .brief .tag, .company-list ul li .box .brief .tag {
  margin-top: 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.company-list ul li a .brief .tag p, .company-list ul li .box .brief .tag p {
  min-width: 260px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  font-weight: 600;
  text-align: center;
  border: 1px solid #E3E3E3;
  border-radius: 20px;
  margin-right: 8px;
  margin-top: 8px;
  padding-left: 15px;
  padding-right: 15px;
}
.company-list ul li a .brief .tag p.new, .company-list ul li .box .brief .tag p.new {
  width: 96px;
  min-width: auto;
  border-color: #DE2200;
  color: #DE2200;
}
.company-list ul li a .brief .des, .company-list ul li .box .brief .des {
  margin-top: 20px;
}
.company-list ul li a .brief .button, .company-list ul li .box .brief .button {
  display: table;
  margin-top: 15px;
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 0;
  padding-left: 22px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 500;
  color: #003165;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 12px 9px;
}
@media only screen and (max-width: 750px) {
  .company-list ul li a .brief .button, .company-list ul li .box .brief .button {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}

.company-search {
  margin-bottom: 25px;
  padding: 25px 40px 20px 40px;
}
@media only screen and (max-width: 900px) {
  .company-search {
    padding: 15px 30px 20px 30px;
  }
}
@media only screen and (max-width: 750px) {
  .company-search {
    padding: 10px 20px 20px 20px;
    margin-bottom: 10px;
  }
}
.company-search .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 900px) {
  .company-search .flex {
    display: block;
  }
}
.company-search .flex .ttl {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #003165;
  font-weight: 500;
  padding-top: 6px;
  padding-right: 20px;
  white-space: nowrap;
}
@media only screen and (max-width: 900px) {
  .company-search .flex .ttl {
    margin-bottom: 10px;
  }
}
.company-search .flex .field {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  .company-search .flex .field {
    display: block;
  }
}
.company-search .flex .field button {
  margin-left: 8px;
}
@media only screen and (max-width: 900px) {
  .company-search .flex .field button {
    width: 100px;
  }
}
@media only screen and (max-width: 750px) {
  .company-search .flex .field button {
    margin-left: 0;
    width: 100%;
    max-width: 100%;
    margin-top: 8px;
  }
}
.company-search p {
  margin-top: 10px;
  font-size: 1.1rem;
  line-height: 1.5rem;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  .company-search p {
    text-align: left;
  }
}

.filter-cat ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.filter-cat ul.col2 li {
  width: 50%;
}
.filter-cat ul li {
  width: 33.33%;
}
.filter-cat ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-bottom: 10px;
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 500;
  color: #BEBEBE;
  text-align: center;
  border-bottom: 4px solid #BEBEBE;
}
@media only screen and (max-width: 1180px) {
  .filter-cat ul li a {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  .filter-cat ul li a {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
@media only screen and (max-width: 750px) {
  .filter-cat ul li a.icon-left {
    padding-left: 10px;
    padding-right: 10px;
    text-align: left;
  }
}
.filter-cat ul li a span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.filter-cat ul li a span.icon-left {
  margin-right: 8px;
}
.filter-cat ul li a.current {
  color: #000;
  border-color: #000;
}
.filter-cat ul li a.current span svg path {
  fill: #000;
}

.filter-list {
  margin-top: 36px;
  padding: 0 40px;
}
@media only screen and (max-width: 900px) {
  .filter-list {
    padding: 0 30px;
  }
}
@media only screen and (max-width: 750px) {
  .filter-list {
    margin-top: 25px;
    padding: 0 20px;
  }
}
.filter-list ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 750px) {
  .filter-list ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: -2%;
  }
}
.filter-list ul li {
  width: 33.33%;
  padding: 4px;
}
@media only screen and (max-width: 900px) {
  .filter-list ul li {
    width: 50%;
  }
}
@media only screen and (max-width: 750px) {
  .filter-list ul li {
    padding: 0;
    width: 100%;
    margin-top: 2%;
  }
}
.filter-list .list-selected {
  margin-top: 20px;
  padding: 16px 0;
  border-top: 1px solid #E3E3E3;
  border-bottom: 1px solid #E3E3E3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  .filter-list .list-selected {
    display: block;
  }
}
.filter-list .list-selected p {
  width: 100%;
  font-size: 1.5rem;
  line-height: 2rem;
  color: #000;
}
.filter-list .list-selected p.topic {
  width: 110px;
  min-width: 110px;
  font-weight: 500;
  color: #003165;
}
@media only screen and (max-width: 750px) {
  .filter-list .list-selected p.topic {
    margin-bottom: 5px;
  }
}
.filter-list .filter-list-row + .filter-list-row {
  margin-top: 15px;
}
@media only screen and (max-width: 750px) {
  .filter-list .filter-list-row + .filter-list-row {
    margin-top: 20px;
  }
}
.filter-list .filter-list-row .topic {
  font-weight: 600;
  line-height: 2rem;
  color: #000;
  margin-bottom: 2px;
}

/* New Company */
#new-company {
  background-image: url("/assets/images/new_company/bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

#new-company-detail #new-company-bg .new-company-title {
  position: relative;
  padding-top: 60px;
  padding-bottom: 80px;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title {
    padding-top: 0px;
    padding-bottom: 60px;
  }
}
#new-company-detail #new-company-bg .new-company-title .btn-scroll {
  position: absolute;
  bottom: 25px;
  right: 25px;
  z-index: 9;
}
#new-company-detail #new-company-bg .new-company-title .cover {
  position: absolute;
  width: 52.91%;
  top: 0;
  right: 0;
  z-index: 8;
  display: block;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .cover {
    position: static;
    width: 100%;
  }
}
#new-company-detail #new-company-bg .new-company-title .cover img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
}
#new-company-detail #new-company-bg .new-company-title .text {
  position: relative;
  width: 47%;
  margin-left: 60px;
  padding: 35px 45px 40px 45px;
  background-color: #fff;
  z-index: 9;
}
@media only screen and (max-width: 1180px) {
  #new-company-detail #new-company-bg .new-company-title .text {
    margin-left: 5%;
    padding: 30px 35px 35px 35px;
  }
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 25px 30px 30px 30px;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text {
    padding: 40px 20px 30px 20px;
  }
}
#new-company-detail #new-company-bg .new-company-title .text h1 {
  font-family: "Noto Serif JP", serif;
  font-size: 3.6rem;
  line-height: 5.2rem;
  font-weight: 500;
  color: #003165;
}
@media only screen and (max-width: 1180px) {
  #new-company-detail #new-company-bg .new-company-title .text h1 {
    font-size: 3rem;
    line-height: 4.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text h1 {
    font-size: 2.6rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text h1 {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text h1 br {
    display: none !important;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box {
  margin-top: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text .box {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text .box {
    margin-top: 15px;
    display: block;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box .img {
  width: 40.89%;
  max-width: 220px;
  border: 1px solid #ccc;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .img {
    min-width: 220px;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .img {
    width: 220px;
    min-width: auto;
    margin-left: auto;
    margin-right: auto;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief {
  width: 59.11%;
  padding-left: 20px;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief {
    margin-top: 10px;
    padding-left: 0;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief h2 {
  font-size: 2rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief h2 {
    font-size: 1.8rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief h2 {
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief > p {
  margin-top: 10px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief > p {
    margin-top: 5px;
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief .tag {
  margin-top: 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief .tag p {
  width: 100%;
  max-width: 260px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  font-weight: 600;
  text-align: center;
  border: 1px solid #E3E3E3;
  border-radius: 20px;
  margin-right: 8px;
  margin-top: 8px;
  padding-left: 15px;
  padding-right: 15px;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief .tag p {
    margin-left: auto;
    margin-right: auto;
  }
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief .tag p.new {
  width: 96px;
  min-width: auto;
  border-color: #DE2200;
  color: #DE2200;
}
#new-company-detail #new-company-bg .new-company-title .text .box .brief .date {
  margin-top: 15px;
  font-size: 1.1rem;
  line-height: 1.1rem;
  color: #656565;
  text-align: right;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-bg .new-company-title .text .box .brief .date {
    margin-top: 10px;
  }
}
#new-company-detail #new-company-bg .new-company-title .btn-scroll-sp {
  margin-top: 30px;
}
#new-company-detail #new-company-bg .new-company {
  padding-bottom: 80px;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-bg .new-company {
    padding-bottom: 60px;
  }
}
#new-company-detail .new-company .new-company-row + .new-company-row {
  margin-top: 100px;
}
@media only screen and (max-width: 900px) {
  #new-company-detail .new-company .new-company-row + .new-company-row {
    margin-top: 75px;
  }
}
#new-company-detail .new-company .new-company-row .new-company-gallery ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -30px;
}
#new-company-detail .new-company .new-company-row .new-company-gallery ul li {
  width: 48%;
  margin-top: 30px;
}
#new-company-detail .new-company .new-company-row .new-company-gallery ul li.center {
  margin-left: auto;
  margin-right: auto;
}
#new-company-detail .new-company .new-company-row .new-company-gallery ul li img {
  width: 100%;
  height: auto;
}
#new-company-detail .new-company .new-company-row .new-company-gallery ul li p {
  margin-top: 13px;
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company .new-company-row .new-company-gallery ul li p {
    margin-top: 10px;
  }
}
#new-company-detail .new-company .new-company-row .new-company-map .map .iframe {
  position: relative;
  padding-bottom: 43%;
  height: 0;
  min-height: 220px;
  overflow: hidden;
}
#new-company-detail .new-company .new-company-row .new-company-map .map .iframe iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
#new-company-detail .new-company .new-company-row .new-company-map .map p {
  margin-top: 10px;
  font-size: 1.6rem;
  line-height: 2.6rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company .new-company-row .new-company-map .map p {
    font-size: 1.3rem;
    line-height: 2rem;
  }
}
#new-company-detail .new-company-list.alternate .row:nth-child(odd) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
#new-company-detail .new-company-list .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company-list .row {
    display: block;
  }
}
#new-company-detail .new-company-list .row + .row {
  margin-top: 75px;
}
@media only screen and (max-width: 900px) {
  #new-company-detail .new-company-list .row + .row {
    margin-top: 50px;
  }
}
#new-company-detail .new-company-list .row > .text:first-child {
  width: 100%;
}
#new-company-detail .new-company-list .row .cover {
  width: 48%;
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company-list .row .cover {
    width: 100%;
  }
}
#new-company-detail .new-company-list .row .text {
  width: 48%;
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company-list .row .text {
    width: 100%;
  }
}
#new-company-detail .new-company-list .row .text h3 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 30px;
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
}
@media only screen and (max-width: 900px) {
  #new-company-detail .new-company-list .row .text h3 {
    font-size: 2rem;
    line-height: 3rem;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company-list .row .text .cover {
    margin-top: 25px;
    margin-bottom: 15px;
  }
}
#new-company-detail .new-company-list .row .text h4 {
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #003165;
}
@media only screen and (max-width: 900px) {
  #new-company-detail .new-company-list .row .text h4 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
#new-company-detail .new-company-list .row .text p {
  margin-top: 25px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 900px) {
  #new-company-detail .new-company-list .row .text p {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company-list .row .text p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#new-company-detail .new-company-list .row .text .btn {
  margin-top: 35px;
  margin-left: auto;
}
@media only screen and (max-width: 900px) {
  #new-company-detail .new-company-list .row .text .btn {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail .new-company-list .row .text .btn {
    margin-right: auto;
  }
}
#new-company-detail #new-company-contact .new-company-contact .content .info h3 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #new-company-detail #new-company-contact .new-company-contact .content .info h3 {
    font-size: 1.6rem;
    line-height: 2.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-contact .new-company-contact .content .info h3 {
    font-size: 1.4rem;
    line-height: 2rem;
    margin-bottom: 5px;
  }
}
#new-company-detail #new-company-contact .new-company-contact .content .info p {
  color: #000;
  text-align: center;
}
#new-company-detail #new-company-contact .new-company-contact .content .table {
  margin-top: 35px;
  border-top: 1px solid #E7E7E7;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-contact .new-company-contact .content .table {
    margin-top: 25px;
  }
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px 0;
  border-bottom: 1px solid #E7E7E7;
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td {
  width: 100%;
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td p {
  color: #000;
  line-height: 2.5rem;
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(1) {
  width: 130px;
  min-width: 130px;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(1) {
    width: 100px;
    min-width: 100px;
  }
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(2) p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(2) p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(2) p + p {
  margin-top: 10px;
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(2) p a {
  color: #003165;
  text-decoration: underline;
}
#new-company-detail #new-company-contact .new-company-contact .content .table .tr .td:nth-child(2) p a[target=_blank] {
  padding-right: 16px;
  background-image: url("/assets/images/commons/icon-blank.svg");
  background-repeat: no-repeat;
  background-position: top 8px right;
  background-size: 9px 8px;
}
#new-company-detail #new-company-check {
  padding-top: 35px;
}
#new-company-detail #new-company-check .new-company-check p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #DE2200;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  #new-company-detail #new-company-check .new-company-check p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}

/* Schedule / Activity / News / Report */
#sanp .sanp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -75px;
}
@media only screen and (max-width: 900px) {
  #sanp .sanp {
    display: block;
    margin-top: -50px;
  }
}
@media only screen and (max-width: 750px) {
  #sanp .sanp {
    margin-top: -40px;
  }
}
#sanp .sanp .col {
  width: 48%;
  margin-top: 75px;
}
@media only screen and (max-width: 900px) {
  #sanp .sanp .col {
    width: 100%;
    margin-top: 50px;
  }
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col {
    margin-top: 40px;
  }
}
#sanp .sanp .col#report .content .col-list ul li {
  padding-bottom: 0;
  border-bottom: 0;
}
#sanp .sanp .col#report .content .col-list ul li .box:hover .left .cover img {
  -webkit-transform: scale(1);
  transform: scale(1);
}
#sanp .sanp .col#report .content .btn-box a + a {
  margin-top: 15px;
}
#sanp .sanp .col .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background-image: url("/assets/images/commons/topic-line-grid.svg");
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
}
#sanp .sanp .col .ttl h2 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #sanp .sanp .col .ttl h2 {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .ttl h2 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
#sanp .sanp .col .ttl a {
  margin-bottom: 3px;
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .ttl a {
    display: none;
  }
}
#sanp .sanp .col .content .col-list ul li {
  border-bottom: 1px solid #E7E7E7;
}
#sanp .sanp .col .content .col-list ul li.lock .box .right h3 {
  position: relative;
}
#sanp .sanp .col .content .col-list ul li.lock .box .right h3::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 12px;
  background-image: url("/assets/images/commons/icon-lock.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 12px;
  margin-left: 2px;
}
#sanp .sanp .col .content .col-list ul li .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-transition: background-color 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out;
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 10px;
    padding-right: 10px;
  }
}
#sanp .sanp .col .content .col-list ul li .box:hover {
  opacity: 1;
  background-color: #f5f5f5;
}
#sanp .sanp .col .content .col-list ul li .box:hover .left .cover img {
  opacity: 1;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
#sanp .sanp .col .content .col-list ul li .box .left {
  width: 160px;
  min-width: 160px;
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .left {
    width: 120px;
    min-width: 120px;
  }
}
#sanp .sanp .col .content .col-list ul li .box .left .date-time {
  margin-bottom: 15px;
}
#sanp .sanp .col .content .col-list ul li .box .left .date-time .date {
  font-size: 2rem;
  line-height: 2rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #sanp .sanp .col .content .col-list ul li .box .left .date-time .date {
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .left .date-time .date {
    font-size: 1.5rem;
    line-height: 1.5rem;
  }
}
#sanp .sanp .col .content .col-list ul li .box .left .date-time .date span {
  font-size: 1.5rem;
}
@media only screen and (max-width: 1180px) {
  #sanp .sanp .col .content .col-list ul li .box .left .date-time .date span {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .left .date-time .date span {
    font-size: 1.2rem;
  }
}
#sanp .sanp .col .content .col-list ul li .box .left .date-time .time {
  margin-top: 5px;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
#sanp .sanp .col .content .col-list ul li .box .left .cover {
  overflow: hidden;
  border-radius: 4px;
}
#sanp .sanp .col .content .col-list ul li .box .left .cover img {
  -webkit-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
#sanp .sanp .col .content .col-list ul li .box .right {
  width: 100%;
  padding-left: 15px;
}
#sanp .sanp .col .content .col-list ul li .box .right.w100 {
  padding-left: 0;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .right .tag {
    margin-bottom: 10px;
  }
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p {
  min-width: 95px;
  font-size: 1.1rem;
  line-height: 1.1rem;
  font-weight: 600;
  margin-right: 8px;
  margin-top: 5px;
  padding: 3px 5px;
  text-align: center;
  border-radius: 9px;
}
@media only screen and (max-width: 1180px) {
  #sanp .sanp .col .content .col-list ul li .box .right .tag p {
    min-width: 85px;
  }
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.date {
  width: 65px;
  min-width: 65px;
  font-weight: 400;
  padding-left: 0;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.grey-border {
  border: 1px solid #E3E3E3;
  color: #656565;
  background-color: #fff;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.blue {
  color: #fff;
  background-color: #0FA2E9;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.red-border {
  border: 1px solid #DE2200;
  color: #DE2200;
  background-color: #fff;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.lime {
  color: #fff;
  background-color: #549A0F;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.blue-dark {
  color: #fff;
  background-color: #2E5B81;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.green {
  color: #fff;
  background-color: #008945;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.orange {
  color: #fff;
  background-color: #C36034;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.magenta {
  color: #fff;
  background-color: #55307D;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.yellow {
  color: #fff;
  background-color: #A28900;
}
#sanp .sanp .col .content .col-list ul li .box .right .tag p.cyan {
  color: #fff;
  background-color: #4E67BA;
}
#sanp .sanp .col .content .col-list ul li .box .right h3 {
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #sanp .sanp .col .content .col-list ul li .box .right h3 {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .right h3 {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#sanp .sanp .col .content .col-list ul li .box .right .text {
  margin-top: 15px;
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .right .text {
    margin-top: 10px;
  }
}
#sanp .sanp .col .content .col-list ul li .box .right .text p {
  font-size: 1.1rem;
  line-height: 1.6rem;
}
#sanp .sanp .col .content .col-list ul li .box .right .text p + p {
  margin-top: 10px;
}
#sanp .sanp .col .content .col-list ul li .box .right .text p.icon-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#sanp .sanp .col .content .col-list ul li .box .right .text p.icon-left span {
  margin-top: 2px;
  width: 11px;
  min-width: 11px;
  margin-right: 10px;
}
#sanp .sanp .col .content .col-list ul li .box .right .btn-box {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  #sanp .sanp .col .content .col-list ul li .box .right .btn-box {
    margin-top: 20px;
  }
}

/* Usage */
#usage {
  background-image: url("/assets/images/top/usage-bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#usage .usage .txthead-box .qoute {
  position: relative;
  display: table;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.5rem;
  line-height: 1.5rem;
  font-weight: 600;
  color: #003165;
  background-color: #FFE52C;
  border-radius: 65px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 6px 10px;
}
@media only screen and (max-width: 1180px) {
  #usage .usage .txthead-box .qoute {
    font-size: 1.4rem;
    line-height: 1.4rem;
  }
}
#usage .usage .txthead-box .qoute::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  z-index: 8;
  display: table;
  margin-left: auto;
  margin-right: auto;
  width: 9px;
  height: 8px;
  background-color: #FFE52C;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
#usage .usage .content ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -2%;
}
@media only screen and (max-width: 750px) {
  #usage .usage .content ul {
    display: block;
    margin-top: -3%;
  }
}
#usage .usage .content ul li {
  width: 32%;
  margin-top: 2%;
  background-color: #fff;
}
@media only screen and (max-width: 900px) {
  #usage .usage .content ul li {
    width: 49%;
  }
}
@media only screen and (max-width: 750px) {
  #usage .usage .content ul li {
    width: 100%;
    margin-top: 3%;
  }
}
#usage .usage .content ul li.lock {
  position: relative;
}
#usage .usage .content ul li.lock::before {
  content: "";
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 8;
  width: 14px;
  height: 16px;
  background-image: url("/assets/images/commons/icon-lock.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 16px;
}
#usage .usage .content ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 26px 25px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#usage .usage .content ul li a:hover {
  opacity: 1;
  background-color: #EBF4FA;
  /*.text {
      h3 {
          color: #003165;
      }
  }*/
}
#usage .usage .content ul li a:hover .icon img {
  opacity: 1;
}
#usage .usage .content ul li a .icon {
  width: 85px;
  min-width: 85px;
}
@media only screen and (max-width: 900px) {
  #usage .usage .content ul li a .icon {
    width: 65px;
    min-width: 65px;
  }
}
#usage .usage .content ul li a .icon img {
  mix-blend-mode: multiply;
}
#usage .usage .content ul li a .text {
  width: 100%;
  padding-left: 15px;
}
#usage .usage .content ul li a .text h3 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
  -webkit-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}
@media only screen and (max-width: 1180px) {
  #usage .usage .content ul li a .text h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #usage .usage .content ul li a .text h3 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#usage .usage .remark {
  margin-top: 15px;
}
#usage .usage .remark p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.1rem;
  line-height: 1.6rem;
  color: #fff;
}
#usage .usage .remark p span {
  margin-right: 3px;
}

/* Banner Link */
#banner-link .banner-link ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #banner-link .banner-link ul {
    display: block;
  }
}
#banner-link .banner-link ul li {
  width: 48.5%;
}
@media only screen and (max-width: 750px) {
  #banner-link .banner-link ul li + li {
    margin-top: 3%;
  }
}
@media only screen and (max-width: 1180px) {
  #banner-link .banner-link ul li {
    width: 49%;
  }
}
@media only screen and (max-width: 750px) {
  #banner-link .banner-link ul li {
    width: 100%;
  }
}
#banner-link .banner-link ul li a {
  display: block;
}
#banner-link .banner-link ul li a p {
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: #000;
  margin-top: 5px;
}
@media only screen and (max-width: 750px) {
  #banner-link .banner-link ul li a p {
    font-size: 16px;
  }
}

/* Banner Search */
#banner-search .banner-search {
  max-width: 800px;
}
#banner-search .banner-search a {
  position: relative;
  height: 80px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 2.4rem;
  line-height: 2.4rem;
  color: #003165;
  border: 2px solid #003165;
}
@media only screen and (max-width: 1180px) {
  #banner-search .banner-search a {
    font-size: 2.2rem;
    line-height: 2.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #banner-search .banner-search a {
    font-size: 2rem;
    line-height: 2rem;
  }
}
#banner-search .banner-search a:hover {
  opacity: 1;
  background-color: #EBF4FA;
}
#banner-search .banner-search a span {
  margin-right: 10px;
}
#banner-search .banner-search a .qoute {
  position: absolute;
  top: -16px;
  left: 0;
  right: 0;
  z-index: 8;
  display: table;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.5rem;
  line-height: 1.5rem;
  font-weight: 600;
  color: #003165;
  background-color: #FFE52C;
  border-radius: 65px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 6px 10px;
}
@media only screen and (max-width: 1180px) {
  #banner-search .banner-search a .qoute {
    font-size: 1.4rem;
    line-height: 1.4rem;
  }
}
#banner-search .banner-search a .qoute::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  z-index: 8;
  display: table;
  margin-left: auto;
  margin-right: auto;
  width: 9px;
  height: 8px;
  background-color: #FFE52C;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}

#banner-70.bg-banner-70 {
  background-image: url("/assets/images/top/bg-blue.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#banner-70.bg-banner-70.download-page .cont-banner h2 {
  margin-right: 10px !important;
}
@media only screen and (max-width: 750px) {
  #banner-70.bg-banner-70.download-page .cont-banner h2 {
    margin-right: 0px !important;
  }
}
#banner-70.bg-banner-70.download-page ul li .btn {
  max-width: 270px !important;
  min-width: 270px !important;
  font-size: 1.8rem !important;
}
@media only screen and (max-width: 750px) {
  #banner-70.bg-banner-70.download-page ul li .btn {
    max-width: inherit !important;
    min-width: inherit !important;
  }
}
#banner-70.bg-banner-70 .cont-banner {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 1180px) {
  #banner-70.bg-banner-70 .cont-banner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (max-width: 750px) {
  #banner-70.bg-banner-70 .cont-banner .w-100 {
    width: 90%;
  }
}
#banner-70.bg-banner-70 .cont-banner h2 {
  margin-right: 30px;
}
@media only screen and (max-width: 1180px) {
  #banner-70.bg-banner-70 .cont-banner h2 {
    margin-right: 0px;
    margin-bottom: 20px;
  }
}
#banner-70.bg-banner-70 ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #banner-70.bg-banner-70 ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
#banner-70.bg-banner-70 ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
#banner-70.bg-banner-70 ul li .btn {
  max-width: 350px;
  min-width: 350px;
  width: 100%;
  height: 70px;
  font-size: 2rem;
  font-weight: bold;
  margin: 0 1.2rem;
}
@media only screen and (max-width: 750px) {
  #banner-70.bg-banner-70 ul li .btn {
    max-width: inherit;
    min-width: inherit;
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #banner-70.bg-banner-70 ul li .btn {
    margin: 1rem 0;
  }
}
#banner-70.bg-banner-70 ul li .btn.polygon-right {
  background-image: url("/assets/images/commons/btn-page-next-white.svg") !important;
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 12px 9px;
}
#banner-70.bg-banner-70 ul li .btn span {
  font-size: 1.4rem;
  font-weight: normal;
  margin-top: 7px;
}

#inner-70th.pad-b-125 {
  padding-bottom: 125px;
}
@media only screen and (max-width: 900px) {
  #inner-70th.pad-b-125 {
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 750px) {
  #inner-70th.pad-b-125 {
    padding-bottom: 40px;
  }
}
#inner-70th .inner-70th {
  background-image: url("/assets/images/top/bg-blue.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 150px;
  margin-bottom: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 750px) {
  #inner-70th .inner-70th {
    height: 120px;
    margin-bottom: 40px;
  }
}
#inner-70th .inner-70th h1 {
  color: #fff;
}
#inner-70th .pdf-ttl {
  padding-bottom: 18px;
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
}
#inner-70th .pdf-ttl h2 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
}
#inner-70th .pdf-detail {
  width: 90%;
  max-width: 770px;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 750px) {
  #inner-70th .pdf-detail {
    margin-top: 40px;
  }
}
#inner-70th .pdf-detail .table {
  border-top: 1px solid #E7E7E7;
}
#inner-70th .pdf-detail .tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 10px 20px;
  border-bottom: 1px solid #E7E7E7;
}
@media only screen and (max-width: 750px) {
  #inner-70th .pdf-detail .tr {
    padding: 10px;
  }
}

.book-content {
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 80px;
}
@media only screen and (max-width: 750px) {
  .book-content {
    margin-bottom: 60px;
  }
}
.book-content .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  .book-content .row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.book-content .row .cover {
  width: 200px;
  min-width: 200px;
  min-height: 220px;
  background-color: #E3E3E3;
}
.book-content .row .detail {
  width: 100%;
  padding-left: 40px;
}
@media only screen and (max-width: 750px) {
  .book-content .row .detail {
    padding-left: 0px;
  }
}
.book-content .row .detail h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 15px;
}
@media only screen and (max-width: 750px) {
  .book-content .row .detail h3 {
    font-size: 2rem;
    line-height: 3rem;
    margin-top: 25px;
  }
}
.book-content .row .detail p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}

/* News */
#news-inner .news-inner .content .news-filter {
  margin-bottom: 35px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter {
    margin-bottom: 25px;
  }
}
#news-inner .news-inner .content .news-filter .company-search {
  padding: 0 !important;
}
#news-inner .news-inner .content .news-filter .company-search .flex .ttl {
  padding: 0;
  padding-right: 20px;
}
#news-inner .news-inner .content .news-filter .filter-list {
  padding-left: 0;
  padding-right: 0;
}
#news-inner .news-inner .content .news-filter .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 40px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .news-filter .ttl {
    padding: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .ttl {
    padding: 15px;
  }
}
#news-inner .news-inner .content .news-filter .ttl h2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 500;
  color: #003165;
  padding-right: 20px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .news-filter .ttl h2 {
    font-size: 1.8rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .ttl h2 {
    font-size: 1.5rem;
    line-height: 2rem;
    padding-right: 0;
  }
}
#news-inner .news-inner .content .news-filter .ttl h2 span {
  margin-right: 8px;
}
#news-inner .news-inner .content .news-filter .ttl .button {
  min-width: 81px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .ttl .button {
    min-width: 65px;
  }
}
#news-inner .news-inner .content .news-filter .ttl .button .a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-weight: 500;
  color: #003165;
  padding-right: 42px;
  height: 32px;
  background-image: url("/assets/images/commons/toggle-close.svg");
  background-repeat: no-repeat;
  background-position: center right;
  background-size: 32px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .ttl .button .a {
    padding-right: 0;
    height: 20px;
    background-size: 20px;
  }
}
#news-inner .news-inner .content .news-filter .ttl.active .button .a {
  background-image: url("/assets/images/commons/toggle-open.svg");
}
#news-inner .news-inner .content .news-filter .toggle-content {
  padding: 0 40px 40px 40px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .news-filter .toggle-content {
    padding: 0 25px 25px 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .toggle-content {
    padding: 0 15px 15px 15px;
  }
}
#news-inner .news-inner .content .news-filter .toggle-content .filter-list {
  margin-top: 0;
}
#news-inner .news-inner .content .news-filter .list + .list {
  margin-top: 15px;
}
#news-inner .news-inner .content .news-filter .list > p {
  margin-bottom: 2px;
  color: #000;
  font-weight: 600;
}
#news-inner .news-inner .content .news-filter .list ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -7px;
}
#news-inner .news-inner .content .news-filter .list ul li {
  margin-top: 7px;
  margin-right: 7px;
}
#news-inner .news-inner .content .news-filter .list ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 32px;
  padding: 0 15px;
  font-size: 1.5rem;
  line-height: 1.5rem;
  color: #0B3C7C;
  font-weight: 500;
  background-color: #fff;
  border-radius: 20px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#news-inner .news-inner .content .news-filter .list ul li a span {
  font-size: 1.1rem;
  color: #656565;
}
#news-inner .news-inner .content .news-filter .list ul li a.selected {
  color: #fff;
  background-color: #000;
}
#news-inner .news-inner .content .news-filter .list ul li a.selected span {
  color: #fff;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .news-filter .btn-box {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .btn-box {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .btn-box .flex {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .btn-box .flex .btn {
    max-width: 100%;
    margin: 0;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-filter .btn-box .flex .btn + .btn {
    margin-top: 10px;
  }
}
#news-inner .news-inner .content .news-list {
  margin-top: 50px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list {
    margin-top: 25px;
  }
}
#news-inner .news-inner .content .news-list > p {
  font-size: 1.1rem;
  line-height: 1.8rem;
  text-align: right;
  margin-bottom: 15px;
}
#news-inner .news-inner .content .news-list .result {
  margin-bottom: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list .result {
    display: block;
    margin-bottom: 15px;
  }
}
#news-inner .news-inner .content .news-list .result .ttl p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .news-list .result .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list .result .ttl p {
    text-align: center;
  }
}
#news-inner .news-inner .content .news-list .result .ttl p span {
  font-size: 3.2rem;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .news-list .result .ttl p span {
    font-size: 3rem;
  }
}
#news-inner .news-inner .content .news-list .result .sort {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list .result .sort {
    display: block;
  }
}
#news-inner .news-inner .content .news-list .result .sort p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  white-space: nowrap;
  padding-right: 15px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list .result .sort p {
    text-align: center;
    padding-right: 0;
    margin-top: 5px;
    margin-bottom: 10px;
  }
}
#news-inner .news-inner .content .news-list .result .sort select {
  width: 240px;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: -moz-center;
  text-align: -webkit-center;
  margin: auto;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list .result .sort select {
    display: table;
    width: 100%;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
  }
}
#news-inner .news-inner .content .news-list ul {
  border-top: 1px solid #E7E7E7;
}
#news-inner .news-inner .content .news-list ul.hide-border {
  border-top: 0;
}
#news-inner .news-inner .content .news-list ul li {
  border-bottom: 1px solid #E7E7E7;
}
#news-inner .news-inner .content .news-list ul li a {
  display: block;
  padding: 30px 45px 30px 30px;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: right 25px center;
  background-size: 12px 9px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .news-list ul li a {
    padding: 20px 45px 20px 15px;
  }
}
#news-inner .news-inner .content .news-list ul li a:hover {
  opacity: 1;
  background-color: #F5F5F5;
}
#news-inner .news-inner .content .news-list ul li a.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a.flex {
    background-position: center right 15px;
  }
}
#news-inner .news-inner .content .news-list ul li a.flex .cover {
  width: 240px;
  min-width: 240px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a.flex .cover {
    width: 120px;
    min-width: 120px;
  }
}
#news-inner .news-inner .content .news-list ul li a.flex .cover img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}
#news-inner .news-inner .content .news-list ul li a.flex .brief {
  width: 100%;
  margin-top: -3px;
  padding-left: 20px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a.flex .brief {
    padding-left: 15px;
  }
}
#news-inner .news-inner .content .news-list ul li a .date-tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#news-inner .news-inner .content .news-list ul li a .date-tag .date {
  font-size: 1.5rem;
  line-height: 2rem;
  margin-right: 20px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .news-list ul li a .date-tag .date {
    font-size: 1.3rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a .date-tag .date {
    margin-right: 10px;
  }
}
#news-inner .news-inner .content .news-list ul li a .date-tag .tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 100px;
  height: 20px;
  border: 1px solid #E3E3E3;
  border-radius: 40px;
  font-size: 1.1rem;
  line-height: 1.1rem;
  white-space: nowrap;
  margin-right: 5px;
  padding: 0 10px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a .date-tag .tag {
    width: auto;
    min-width: auto;
  }
}
#news-inner .news-inner .content .news-list ul li a h3 {
  margin-top: 10px;
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 500;
  color: #000;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .news-list ul li a h3 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a h3 {
    margin-top: 5px;
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#news-inner .news-inner .content .news-list ul li a h3 + p {
  margin-top: 15px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .news-list ul li a h3 + p {
    margin-top: 10px;
    font-size: 1.1rem;
    line-height: 1.6rem;
  }
}
#news-inner .news-inner .content .event-list {
  margin-top: 50px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list {
    margin-top: 25px;
  }
}
#news-inner .news-inner .content .event-list > p {
  font-size: 1.1rem;
  line-height: 1.8rem;
  text-align: right;
  margin-bottom: 15px;
}
#news-inner .news-inner .content .event-list .result {
  margin-bottom: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list .result {
    display: block;
    margin-bottom: 15px;
  }
}
#news-inner .news-inner .content .event-list .result .ttl p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .event-list .result .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list .result .ttl p {
    text-align: center;
  }
}
#news-inner .news-inner .content .event-list .result .ttl p span {
  font-size: 3.2rem;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .event-list .result .ttl p span {
    font-size: 3rem;
  }
}
#news-inner .news-inner .content .event-list .result .sort {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list .result .sort {
    display: block;
  }
}
#news-inner .news-inner .content .event-list .result .sort p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  white-space: nowrap;
  padding-right: 15px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list .result .sort p {
    text-align: center;
    padding-right: 0;
    margin-top: 5px;
    margin-bottom: 10px;
  }
}
#news-inner .news-inner .content .event-list .result .sort select {
  width: 240px;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: -moz-center;
  text-align: -webkit-center;
  margin: auto;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list .result .sort select {
    display: table;
    width: 100%;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
  }
}
#news-inner .news-inner .content .event-list ul {
  border-top: 1px solid #E7E7E7;
}
#news-inner .news-inner .content .event-list ul li {
  border-bottom: 1px solid #E7E7E7;
}
#news-inner .news-inner .content .event-list ul li.finished {
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}
#news-inner .news-inner .content .event-list ul li.finished .box .left .date-time .date {
  color: #656565;
}
#news-inner .news-inner .content .event-list ul li.finished .box .right h3 {
  color: #656565;
}
#news-inner .news-inner .content .event-list ul li .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 40px;
  padding-bottom: 40px;
  padding-left: 40px;
  padding-right: 55px;
  -webkit-transition: background-color 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: center right 25px;
  background-size: 12px 9px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 10px;
    padding-right: 10px;
    background-position: bottom 18px right;
  }
}
#news-inner .news-inner .content .event-list ul li .box:hover {
  opacity: 1;
  background-color: #f5f5f5;
}
#news-inner .news-inner .content .event-list ul li .box:hover .left .cover img {
  opacity: 1;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
#news-inner .news-inner .content .event-list ul li .box.pdf {
  background-image: url("/assets/images/commons/icon-pdf.svg");
  background-repeat: no-repeat;
  background-position: center right 19px;
  background-size: 18px 24px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box.pdf {
    background-size: 12px 16px;
    background-position: bottom 14px right;
  }
}
#news-inner .news-inner .content .event-list ul li .box .left {
  width: 240px;
  min-width: 240px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box .left {
    width: 120px;
    min-width: 120px;
  }
}
#news-inner .news-inner .content .event-list ul li .box .left .date-time {
  margin-bottom: 15px;
}
#news-inner .news-inner .content .event-list ul li .box .left .date-time .date {
  font-size: 2rem;
  line-height: 2rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .event-list ul li .box .left .date-time .date {
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box .left .date-time .date {
    font-size: 1.5rem;
    line-height: 1.5rem;
  }
}
#news-inner .news-inner .content .event-list ul li .box .left .date-time .date span {
  font-size: 1.5rem;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .event-list ul li .box .left .date-time .date span {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box .left .date-time .date span {
    font-size: 1.2rem;
  }
}
#news-inner .news-inner .content .event-list ul li .box .left .date-time .time {
  margin-top: 5px;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
#news-inner .news-inner .content .event-list ul li .box .left .cover {
  overflow: hidden;
  border-radius: 4px;
}
#news-inner .news-inner .content .event-list ul li .box .left .cover img {
  width: 100%;
  height: auto;
  -webkit-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
#news-inner .news-inner .content .event-list ul li .box .right {
  width: 100%;
  padding-left: 20px;
}
#news-inner .news-inner .content .event-list ul li .box .right.w100 {
  padding-left: 0;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box .right .tag {
    margin-bottom: 10px;
  }
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p {
  min-width: 95px;
  font-size: 1.1rem;
  line-height: 1.1rem;
  font-weight: 600;
  margin-right: 8px;
  margin-top: 5px;
  padding: 3px 5px;
  text-align: center;
  border-radius: 20px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .event-list ul li .box .right .tag p {
    min-width: 85px;
  }
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.date {
  width: 65px;
  min-width: 65px;
  font-weight: 400;
  padding-left: 0;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.blue {
  color: #fff;
  background-color: #0FA2E9;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.grey-border {
  border: 1px solid #E3E3E3;
  color: #656565;
  background-color: #fff;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.red-border {
  border: 1px solid #DE2200;
  color: #DE2200;
  background-color: #fff;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.lime {
  color: #fff;
  background-color: #549A0F;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.blue-dark {
  color: #fff;
  background-color: #2E5B81;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.green {
  color: #fff;
  background-color: #008945;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.orange {
  color: #fff;
  background-color: #C36034;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.magenta {
  color: #fff;
  background-color: #55307D;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.yellow {
  color: #fff;
  background-color: #A28900;
}
#news-inner .news-inner .content .event-list ul li .box .right .tag p.cyan {
  color: #fff;
  background-color: #4E67BA;
}
#news-inner .news-inner .content .event-list ul li .box .right h3 {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .event-list ul li .box .right h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box .right h3 {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#news-inner .news-inner .content .event-list ul li .box .right .text {
  margin-top: 10px;
}
#news-inner .news-inner .content .event-list ul li .box .right .text p {
  font-size: 1.3rem;
  line-height: 1.8rem;
}
#news-inner .news-inner .content .event-list ul li .box .right .text p + p {
  margin-top: 10px;
}
#news-inner .news-inner .content .event-list ul li .box .right .text p.icon-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#news-inner .news-inner .content .event-list ul li .box .right .text p.icon-left span {
  margin-top: 2px;
  width: 11px;
  min-width: 11px;
  margin-right: 10px;
}
#news-inner .news-inner .content .event-list ul li .box .right .btn-box {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .event-list ul li .box .right .btn-box {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box {
  padding: 40px;
  background-color: #fff;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box {
    padding: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box {
    padding: 15px;
  }
}
#news-inner .news-inner .content .box + .box {
  margin-top: 25px;
}
#news-inner .news-inner .content .box .detail .date-tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#news-inner .news-inner .content .box .detail .date-tag .date {
  font-size: 1.5rem;
  line-height: 2rem;
  margin-right: 20px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .date-tag .date {
    font-size: 1.3rem;
    line-height: 1.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .date-tag .date {
    margin-right: 10px;
  }
}
#news-inner .news-inner .content .box .detail .date-tag .tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 100px;
  height: 20px;
  border: 1px solid #E3E3E3;
  border-radius: 40px;
  font-size: 1.1rem;
  line-height: 1.1rem;
  margin-right: 8px;
}
#news-inner .news-inner .content .box .detail .date-tag .tag.red-border {
  border: 1px solid #DE2200;
  color: #DE2200;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .date-tag .tag {
    width: auto;
    min-width: auto;
  }
}
#news-inner .news-inner .content .box .detail h1 {
  margin-top: 25px;
  font-size: 3.2rem;
  line-height: 4.7rem;
  font-weight: 600;
  color: #000;
  border-bottom: 1px solid #E7E7E7;
  margin-bottom: 30px;
  padding-bottom: 30px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .detail h1 {
    font-size: 2.8rem;
    line-height: 3.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail h1 {
    margin-top: 20px;
    font-size: 2.4rem;
    line-height: 3.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail h1 {
    margin-top: 15px;
    font-size: 2rem;
    line-height: 3rem;
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text p {
  font-size: 1.7rem;
  line-height: 3.2rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .detail .text p {
    font-size: 1.6rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text p {
    font-size: 1.5rem;
    line-height: 2.8rem;
  }
}
#news-inner .news-inner .content .box .detail .text p + p {
  margin-top: 30px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .detail .text p + p {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text p + p {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text p + p {
    margin-top: 15px;
  }
}
#news-inner .news-inner .content .box .detail .text p strong {
  font-weight: 600;
}
#news-inner .news-inner .content .box .detail .text p + .img-flex {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text p + .img-flex {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text p + .img-flex {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text a {
  color: #003165;
  text-decoration: underline;
}
#news-inner .news-inner .content .box .detail .text .img-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text .img-flex {
    display: block;
  }
}
#news-inner .news-inner .content .box .detail .text .img-flex + .img-flex {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text .img-flex + .img-flex {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text .img-flex + .img-flex {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text .img-flex .w50 {
  width: 47.5%;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text .img-flex .w50 {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text .img-flex .w50 + .w50 {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text .img-flex .w50.center {
  margin-left: auto;
  margin-right: auto;
}
#news-inner .news-inner .content .box .detail .text .img-flex p {
  margin-top: 10px;
  font-size: 1.2rem;
  line-height: 1.8rem;
}
#news-inner .news-inner .content .box .detail .text .img-flex + p {
  margin-top: 30px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text .img-flex + p {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text .img-flex + p {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text-event p {
  font-size: 1.7rem;
  line-height: 3.2rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .detail .text-event p {
    font-size: 1.6rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event p {
    font-size: 1.5rem;
    line-height: 2.8rem;
  }
}
#news-inner .news-inner .content .box .detail .text-event p + p {
  margin-top: 30px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .detail .text-event p + p {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event p + p {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event p + p {
    margin-top: 15px;
  }
}
#news-inner .news-inner .content .box .detail .text-event p + .img {
  margin-top: 30px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event p + .img {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event p + .img {
    margin-top: 15px;
  }
}
#news-inner .news-inner .content .box .detail .text-event p + .img-flex {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event p + .img-flex {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event p + .img-flex {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img {
  position: relative;
}
#news-inner .news-inner .content .box .detail .text-event .img .text-on {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
}
#news-inner .news-inner .content .box .detail .text-event .img .text-on p {
  font-size: 2.6rem;
  line-height: 3.6rem;
  font-weight: 700;
  color: #fff;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .detail .text-event .img .text-on p {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event .img .text-on p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img + .img {
  margin-top: 20px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event .img + .img {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img + .img {
    margin-top: 10px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img + p {
  margin-top: 30px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event .img + p {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img + p {
    margin-top: 15px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex {
    display: block;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img-flex + .img-flex {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex + .img-flex {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex + .img-flex {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img-flex .w50 {
  width: 47.5%;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex .w50 {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex .w50 + .w50 {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .img-flex .w50.center {
  margin-left: auto;
  margin-right: auto;
}
#news-inner .news-inner .content .box .detail .text-event .img-flex p {
  margin-top: 10px;
  font-size: 1.2rem;
  line-height: 1.8rem;
}
#news-inner .news-inner .content .box .detail .text-event .img-flex + p {
  margin-top: 30px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex + p {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .img-flex + p {
    margin-top: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-top: 1px solid #E7E7E7;
  margin-top: 40px;
  padding-top: 25px;
  padding-bottom: 25px;
  padding-left: 25px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex {
    display: block;
    margin-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex + .row-flex {
  margin-top: 0;
  border-bottom: 1px solid #E7E7E7;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex.bg-grey {
  background-color: #f5f5f5;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .date-tag {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 5px;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .date-tag .tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 100px;
  height: 20px;
  border: 1px solid #E3E3E3;
  border-radius: 40px;
  font-size: 1.1rem;
  line-height: 1.1rem;
  font-weight: normal;
  white-space: nowrap;
  margin-right: 5px;
  padding: 0 10px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex .date-tag .tag {
    width: auto;
    min-width: auto;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .left {
  width: 175px;
  min-width: 175px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex .left {
    width: 100%;
    min-width: 100%;
    margin-bottom: 5px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .left p {
  font-weight: 600;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex .left p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right {
  width: 100%;
  padding-top: 3px;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right.teacher {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex .right.teacher {
    margin-top: 10px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right.teacher .teacher-img {
  width: 150px;
  min-width: 150px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex .right.teacher .teacher-img {
    width: 100px;
    min-width: 100px;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right.teacher .teacher-text {
  width: 100%;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right h2 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .detail .text-event .row-flex .right h2 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right h2 + p {
  margin-top: 5px;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right p a {
  color: #000;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right p strong {
  font-weight: 600;
}
#news-inner .news-inner .content .box .detail .text-event .row-flex .right .btn {
  margin-top: 20px;
}
#news-inner .news-inner .content .box .button {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #E7E7E7;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .content .box .button {
    margin-top: 25px;
    padding-top: 25px;
  }
}
#news-inner .news-inner .content .box .button ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .button ul {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .button ul li + li {
    margin-top: 10px;
  }
}
#news-inner .news-inner .content .box .button ul li.page {
  width: 140px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .button ul li.page {
    width: 100%;
  }
}
#news-inner .news-inner .content .box .button ul li.menu {
  width: 240px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .button ul li.menu {
    width: 100%;
  }
}
#news-inner .news-inner .content .box .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background-image: url("/assets/images/commons/topic-line-grid.svg");
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
}
#news-inner .news-inner .content .box .ttl h2 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .box .ttl h2 {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .box .ttl h2 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
#news-inner .news-inner .content .box .ttl a {
  margin-bottom: 3px;
}
#news-inner .news-inner .content .report {
  margin-top: 60px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report {
    margin-top: 40px;
  }
}
#news-inner .news-inner .content .report.search .report-ttl h2 {
  font-size: 2rem;
  line-height: 3rem;
}
#news-inner .news-inner .content .report.search .report-ttl h2 span {
  font-size: 3.2rem;
}
#news-inner .news-inner .content .report .result {
  margin-bottom: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-bottom: 25px;
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result {
    display: block;
  }
}
#news-inner .news-inner .content .report .result .ttl p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .result .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result .ttl p {
    text-align: center;
  }
}
#news-inner .news-inner .content .report .result .ttl p span {
  font-size: 3.2rem;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .result .ttl p span {
    font-size: 3rem;
  }
}
#news-inner .news-inner .content .report .result .sort {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result .sort {
    display: block;
  }
}
#news-inner .news-inner .content .report .result .sort p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  white-space: nowrap;
  padding-right: 15px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result .sort p {
    text-align: center;
    padding-right: 0;
    margin-top: 5px;
    margin-bottom: 10px;
  }
}
#news-inner .news-inner .content .report .result .sort select {
  width: 240px;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: -moz-center;
  text-align: -webkit-center;
  margin: auto;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result .sort select {
    display: table;
    width: 100%;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
  }
}
#news-inner .news-inner .content .report .result-list ul li {
  border-bottom: 1px solid #EDEDED;
}
#news-inner .news-inner .content .report .result-list ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#news-inner .news-inner .content .report .result-list ul li a:hover {
  opacity: 1;
  background-color: #f5f5f5;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result-list ul li a {
    display: block;
    padding-right: 55px;
  }
}
#news-inner .news-inner .content .report .result-list ul li a .date {
  width: 200px;
  min-width: 200px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result-list ul li a .date {
    width: 100%;
    min-width: 100%;
    margin-bottom: 5px;
  }
}
#news-inner .news-inner .content .report .result-list ul li a .name {
  width: 100%;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  padding: 0 0 0 28px;
  text-decoration: underline;
  background-image: url("/assets/images/commons/icon-download.svg");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 18px 24px;
}
#news-inner .news-inner .content .report .result-list ul li a .size {
  width: 80px;
  min-width: 80px;
  line-height: 2.5rem;
  text-align: right;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result-list ul li a .size {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 9;
    width: auto;
    min-width: auto;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}
#news-inner .news-inner .content .report .result-list > p {
  margin-top: 45px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .result-list > p {
    margin-top: 25px;
  }
}
#news-inner .news-inner .content .report .report-ttl {
  padding-bottom: 18px;
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
}
#news-inner .news-inner .content .report .report-ttl h2 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
}
#news-inner .news-inner .content .report .report-content {
  margin-top: 40px;
}
#news-inner .news-inner .content .report .report-content .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .report-content .row {
    display: block;
  }
}
#news-inner .news-inner .content .report .report-content .row + .row {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #EDEDED;
}
#news-inner .news-inner .content .report .report-content .row .cover {
  width: 200px;
  min-width: 200px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .report-content .row .cover {
    width: 180px;
    min-width: 180px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .report-content .row .cover {
    margin-left: auto;
    margin-right: auto;
  }
}
#news-inner .news-inner .content .report .report-content .row .cover a {
  margin-top: 20px;
}
#news-inner .news-inner .content .report .report-content .row .detail {
  width: 100%;
  padding-left: 40px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .report-content .row .detail {
    padding-left: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .report-content .row .detail {
    padding-left: 0;
    margin-top: 25px;
  }
}
#news-inner .news-inner .content .report .report-content .row .detail h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 15px;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .report-content .row .detail h3 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .report-content .row .detail h3 {
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-bottom: 10px;
  }
}
#news-inner .news-inner .content .report .report-content .row .detail p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
#news-inner .news-inner .content .report .report-content .row .detail .toggle-btn {
  margin-top: 30px;
  padding: 25px 40px;
  display: block;
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #003165;
  background-color: #F5F5F5;
  background-image: url("/assets/images/commons/toggle-close.svg");
  background-repeat: no-repeat;
  background-position: center right 40px;
  background-size: 32px;
  position: relative;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .report-content .row .detail .toggle-btn {
    margin-top: 25px;
    padding: 20px 25px;
    background-position: center right 25px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .report-content .row .detail .toggle-btn {
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-top: 20px;
    padding: 15px 20px;
    background-position: center right 20px;
  }
}
#news-inner .news-inner .content .report .report-content .row .detail .toggle-btn::before {
  content: "開ける";
  position: absolute;
  top: 0;
  right: 80px;
  z-index: 8;
  font-size: 1.3rem;
  line-height: 1.3rem;
  font-weight: 600;
  height: 100%;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #003165;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .content .report .report-content .row .detail .toggle-btn::before {
    right: 65px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .content .report .report-content .row .detail .toggle-btn::before {
    right: 60px;
  }
}
#news-inner .news-inner .content .report .report-content .row .detail .toggle-btn.active {
  background-image: url("/assets/images/commons/toggle-open.svg");
}
#news-inner .news-inner .content .report .report-content .row .detail .toggle-btn.active::before {
  content: "閉じる";
}
#news-inner .news-inner .content .report .report-content .row .detail .toggle-content .download-list ul {
  border-top: 0;
}
#news-inner .news-inner .download-result .result {
  margin-bottom: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-bottom: 25px;
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-result .result {
    display: block;
  }
}
#news-inner .news-inner .download-result .result .ttl p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .download-result .result .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-result .result .ttl p {
    text-align: center;
  }
}
#news-inner .news-inner .download-result .result .ttl p span {
  font-size: 3.2rem;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .download-result .result .ttl p span {
    font-size: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-result .result-table .table {
    overflow: auto;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-result .result-table .table table {
    min-width: 750px;
  }
}
#news-inner .news-inner .download-result .result-table .table table tbody tr {
  border-bottom: 1px solid #EDEDED;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr.topic td {
  font-size: 1.3rem;
  line-height: 2.3rem;
  font-weight: 700;
  color: #000;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td {
  padding-top: 19px;
  padding-bottom: 19px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  vertical-align: middle;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-result .result-table .table table tbody tr td {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(1) {
  padding-left: 40px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(1) {
    padding-left: 0px;
  }
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(2) {
  padding-left: 40px;
  padding-right: 20px;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(2) {
    padding-left: 20px;
  }
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(3) {
  min-width: 100px;
  text-align: center;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(4) {
  min-width: 100px;
  text-align: center;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td:nth-child(5) {
  min-width: 100px;
  text-align: center;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td a {
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
  padding: 7px 5px 5px 5px;
  font-size: 1.3rem;
  line-height: 2.3rem;
  text-align: center;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td a:hover {
  opacity: 1;
  text-decoration: underline;
  background-color: #eaeaea;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td a:hover img {
  opacity: 1;
}
#news-inner .news-inner .download-result .result-table .table table tbody tr td a span {
  display: table;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 3px;
}
#news-inner .news-inner .download-result + .download-news-access {
  margin-top: 120px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-result + .download-news-access {
    margin-top: 60px;
  }
}
#news-inner .news-inner .download-news-access {
  margin-top: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .download-news-access {
    display: block;
  }
}
#news-inner .news-inner .download-news-access .col {
  width: 48%;
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .download-news-access .col {
    width: 100%;
  }
}
@media only screen and (max-width: 900px) {
  #news-inner .news-inner .download-news-access .col + .col {
    margin-top: 50px;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-news-access .col + .col {
    margin-top: 40px;
  }
}
#news-inner .news-inner .download-news-access .col .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background-image: url("/assets/images/commons/topic-line-grid.svg");
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
}
#news-inner .news-inner .download-news-access .col .ttl h2 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #news-inner .news-inner .download-news-access .col .ttl h2 {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-news-access .col .ttl h2 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
#news-inner .news-inner .download-news-access .col .ttl a {
  margin-bottom: 3px;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-news-access .col .ttl a {
    display: none;
  }
}
#news-inner .news-inner .download-news-access .col .download-news-list ul li {
  border-bottom: 1px solid #EDEDED;
}
#news-inner .news-inner .download-news-access .col .download-news-list ul li a {
  display: block;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  padding: 19px 40px 19px 15px;
  background-image: url("../images/commons/icon-pdf.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 18px 24px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-news-access .col .download-news-list ul li a {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#news-inner .news-inner .download-news-access .col .download-news-list ul li a:hover {
  opacity: 1;
  background-color: #F5F5F5;
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li {
  border-bottom: 1px solid #EDEDED;
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li:nth-child(1) a .no {
  background-image: url("/assets/images/commons/crown-gold.svg");
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li:nth-child(2) a .no {
  background-image: url("/assets/images/commons/crown-silver.svg");
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li:nth-child(3) a .no {
  background-image: url("/assets/images/commons/crown-bronze.svg");
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 32px 40px 32px 15px;
  background-image: url("/assets/images/commons/icon-pdf.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 18px 24px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-news-access .col .download-access-list ul li a {
    padding-top: 19px;
    padding-bottom: 19px;
  }
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li a:hover {
  opacity: 1;
  background-color: #F5F5F5;
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li a .no {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 43px;
  min-width: 43px;
  height: 35px;
  padding-top: 13px;
  background-image: url("/assets/images/commons/crown-blue.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 42px 35px;
  color: #fff;
  font-weight: 400;
}
#news-inner .news-inner .download-news-access .col .download-access-list ul li a h3 {
  width: 100%;
  padding-left: 20px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #news-inner .news-inner .download-news-access .col .download-access-list ul li a h3 {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#news-inner .box-requir-login {
  margin-top: 40px;
}
#news-inner .box-contact {
  margin-top: 40px;
}
#news-inner .event-inner .content .box .detail .text .img {
  margin-top: 25px;
}
#news-inner .event-inner .content .box .download-list {
  margin-top: 10px;
}
#news-inner .event-inner .content .box .download-list ul {
  border-top: 0;
}
#news-inner .event-inner .btn-page {
  width: 1005;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
#news-inner .event-inner .btn-page ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #news-inner .event-inner .btn-page ul {
    display: block;
  }
}
#news-inner .event-inner .btn-page ul li a {
  width: 100%;
}
@media only screen and (max-width: 750px) {
  #news-inner .event-inner .btn-page ul li + li {
    margin-top: 10px;
  }
}
#news-inner .event-inner .btn-page ul li.page {
  width: 140px;
}
@media only screen and (max-width: 750px) {
  #news-inner .event-inner .btn-page ul li.page {
    width: 100%;
  }
}
#news-inner .event-inner .btn-page ul li.menu {
  width: 240px;
}
@media only screen and (max-width: 750px) {
  #news-inner .event-inner .btn-page ul li.menu {
    width: 100%;
  }
}

.news-year {
  margin-bottom: 25px;
  padding: 25px 40px;
}
@media only screen and (max-width: 1180px) {
  .news-year {
    padding: 25px;
  }
}
@media only screen and (max-width: 750px) {
  .news-year {
    margin-bottom: 15px;
    padding: 15px;
  }
}
.news-year .scroll {
  overflow: auto;
}
.news-year ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /*-webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;*/
}
.news-year ul.col6 li {
  width: 16.6%;
}
.news-year ul li {
  width: 14%;
  min-width: 100px;
  padding: 0 4px;
}
@media only screen and (max-width: 750px) {
  .news-year ul li {
    padding: 4px;
  }
}
.news-year ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 40px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 400;
  color: #003165;
  background-color: #fff;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.news-year ul li a:hover {
  opacity: 1;
  background-color: #EBF4FA;
}
.news-year ul li a.active {
  color: #fff;
  background-color: #000;
}

.download-list {
  margin-top: 20px;
}
.download-list ul {
  border-top: 1px solid #EDEDED;
}
.download-list ul.fit li a {
  padding-top: 6px;
  padding-bottom: 6px;
  background-position: top 4px left 14px;
}
.download-list ul.fit li a span {
  top: 6px;
}
.download-list ul li {
  border-bottom: 1px solid #EDEDED;
}
.download-list ul li a {
  position: relative;
  display: block;
  font-size: 1.5rem;
  line-height: 2rem;
  color: #000;
  padding: 19px 80px 19px 42px;
  background-image: url("/assets/images/commons/icon-download.svg");
  background-repeat: no-repeat;
  background-position: top 16px left 14px;
  background-size: 18px 24px;
  text-decoration: underline;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.download-list ul li a span {
  position: absolute;
  top: 19px;
  right: 0;
  z-index: 8;
  font-size: 1.3rem;
  line-height: 2rem;
  color: #656565;
}
.download-list ul li a:hover {
  opacity: 1;
  background-color: #f5f5f5;
}
.download-list ul li a.no-link {
  color: #979797;
  pointer-events: none;
  background-image: url("/assets/images/commons/icon-download-grey.svg");
}
.download-list ul li a.no-link span {
  color: #979797;
}
.download-list .remark {
  margin-top: 20px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #DB2D19;
}
@media only screen and (max-width: 750px) {
  .download-list .remark {
    font-size: 1.3rem;
    line-height: 2.3rem;
    margin-top: 15px;
  }
}
.download-list .remark a {
  color: #DB2D19;
  text-decoration: underline;
}

/* Checkbox */
.chkbox-btn {
  display: block;
  position: relative;
  padding-left: 0;
  padding-top: 4px;
  margin-top: 0px;
  margin-bottom: 0;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-size: 1.3rem;
  line-height: 2.2rem;
  color: #0B3C7C;
  height: 32px;
}
@media only screen and (max-width: 1180px) {
  .chkbox-btn {
    font-size: 1.2rem;
  }
}
.chkbox-btn p {
  position: relative;
  color: #0B3C7C !important;
  margin-bottom: 0 !important;
  padding: 0 15px !important;
  z-index: 8;
}
.chkbox-btn p.twoline {
  margin-top: -3px;
  line-height: 1.8rem;
}
.chkbox-btn p small {
  display: block;
  font-size: 1rem;
  line-height: 1rem;
}
.chkbox-btn p span {
  font-size: 1.1rem;
  color: #656565;
}
.chkbox-btn p span.abs {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 8;
  margin-top: auto;
  margin-bottom: auto;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.chkbox-btn input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.chkbox {
  position: absolute;
  top: 0;
  left: 0;
  height: 32px;
  width: 100%;
  background-color: #fff;
  border-radius: 3px;
  border-radius: 20px;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}

.chkbox-btn:hover {
  opacity: 1;
}
.chkbox-btn:hover .chkbox {
  background-color: #EBF4FA;
}

.chkbox-btn:hover input .chkbox {
  background-color: #000;
}

.chkbox-btn input:checked ~ p {
  color: #fff !important;
}

.chkbox-btn input:checked ~ p span {
  color: #fff !important;
}

.chkbox-btn input:checked ~ .chkbox {
  color: #fff !important;
  background-color: #000;
}

.chkbox-btn:hover input:checked .chkbox {
  color: #fff !important;
  background-color: #000 !important;
}

.radio-btn {
  display: table;
  position: relative;
  padding-left: 32px;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 1.6rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.radio-btn input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: -1px;
  left: 0;
  border: 1px solid #003165;
  background-color: #fff;
  height: 26px;
  width: 26px;
  border-radius: 100%;
}

/* On mouse-over, add a grey background color */
.radio-btn:hover input ~ .checkmark {
  background-color: #fff;
}

/* When the radio button is checked, add a blue background */
.radio-btn input:checked ~ .checkmark {
  background-color: #fff;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-btn input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.radio-btn .checkmark:after {
  top: 4px;
  left: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #003165;
}

.textbox {
  width: 100%;
  font-family: "Noto Sans JP", sans-serif;
  padding: 11px 15px;
  border-radius: 4px;
  border: 1px solid #003165;
  background-color: #fff;
}
.textbox.big {
  padding: 22px 22px;
}
@media only screen and (max-width: 750px) {
  .textbox.big {
    padding: 16px;
  }
}
.textbox.grey {
  border-color: #F2F2F2;
  background-color: #F2F2F2;
}
.textbox.grey::-webkit-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.grey::-moz-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.grey:-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.grey::-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.grey::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.search {
  padding-left: 40px;
  background-image: url("/assets/images/commons/icon-search.svg");
  background-repeat: no-repeat;
  background-position: center left 10px;
  background-size: 20px;
}
.textbox.search::-webkit-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
}
.textbox.search::-moz-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
}
.textbox.search:-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
}
.textbox.search::-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
}
.textbox.search::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
}
.textbox.red {
  border-color: #DB2D19;
  background-color: #FCE9E7;
}
.textbox.red::-webkit-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.red::-moz-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.red:-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.red::-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}
.textbox.red::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #888;
  opacity: 1; /* Firefox */
}

select.textbox {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.5rem;
  line-height: 1.6rem;
  color: #003165;
  background-image: url("/assets/images/commons/btn-page-down.svg");
  background-repeat: no-repeat;
  background-position: center right 15px;
  background-size: 9px 12px;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: "";
  outline: none;
}
select.textbox.big {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  color: #000;
  padding: 21px 16px 22px 16px;
}
@media only screen and (max-width: 750px) {
  select.textbox.big {
    font-size: 1.3rem;
    padding: 15px 16px 16px 16px;
  }
}

textarea {
  resize: none;
}

/* Checkbox */
.chkbox-btn-square {
  display: table;
  position: relative;
  padding-left: 38px;
  margin-top: 0px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}

.chkbox-btn-square input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.chkbox-square {
  position: absolute;
  top: 0px;
  left: 0;
  border: 1px solid #F2F2F2;
  height: 28px;
  width: 28px;
  background-color: #F2F2F2;
  border-radius: 0px;
}

.chkbox-btn-square:hover input ~ .chkbox-square {
  background-color: #F2F2F2;
}

.chkbox-btn-square input:checked ~ .chkbox-square {
  background-color: #F2F2F2;
}

.chkbox-square:after {
  content: "";
  position: absolute;
  display: none;
}

.chkbox-btn-square input:checked ~ .chkbox-square:after {
  display: block;
}

.chkbox-btn-square .chkbox-square:after {
  top: 5px;
  left: 5px;
  width: 16px;
  height: 16px;
  border: solid #003165;
  border-width: 8px;
}

/* Box Requir Login */
.box-requir-login .box-border {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 25px;
  border: 1px solid #003165;
  background-color: #fff;
}
@media only screen and (max-width: 1180px) {
  .box-requir-login .box-border {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  .box-requir-login .box-border {
    padding: 20px;
  }
}
.box-requir-login .box-border .ttl p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  font-weight: 600;
}
@media only screen and (max-width: 1180px) {
  .box-requir-login .box-border .ttl p {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}
@media only screen and (max-width: 750px) {
  .box-requir-login .box-border .ttl p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.box-requir-login .box-border .ttl p span {
  margin-top: 3px;
  margin-right: 6px;
}
@media only screen and (max-width: 1180px) {
  .box-requir-login .box-border .ttl p span {
    margin-top: 8px;
  }
}
.box-requir-login .box-border .ttl p span img {
  min-width: 10px;
}
.box-requir-login .box-border .button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 20px;
}
@media only screen and (max-width: 1180px) {
  .box-requir-login .box-border .button {
    margin-top: 10px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 0;
  }
}
.box-requir-login .box-border .button li {
  width: 160px;
}
.box-requir-login .box-border .button li + li {
  margin-left: 15px;
}
@media only screen and (max-width: 750px) {
  .box-requir-login .box-border .button li + li {
    margin-left: 10px;
  }
}
.box-requir-login .text {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  .box-requir-login .text {
    margin-top: 25px;
  }
}
.box-requir-login .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  text-align: center;
}
.box-requir-login + .news-year {
  margin-top: 60px;
}
.box-requir-login + .box-register {
  margin-top: 15px;
}
.box-requir-login + .news-filter {
  margin-top: 60px;
}

/* Box Register */
.box-register .box-border {
  padding: 25px;
  border: 1px solid #003165;
  background-color: #fff;
}
@media only screen and (max-width: 1180px) {
  .box-register .box-border {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  .box-register .box-border {
    padding: 20px;
  }
}
.box-register .box-border.disable {
  border-color: #979797;
}
.box-register .box-border .ttl {
  margin-bottom: 10px;
}
.box-register .box-border .ttl p {
  font-size: 2.4rem;
  line-height: 3.4rem;
  color: #000;
  font-weight: 600;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  .box-register .box-border .ttl p {
    font-size: 2rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  .box-register .box-border .ttl p {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
.box-register .box-border .link-blue {
  display: table;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
}
.box-register .box-border .link-blue.disable {
  pointer-events: none;
  color: #979797;
}
.box-register .text {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  .box-register .text {
    margin-top: 25px;
  }
}
.box-register .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  text-align: center;
}
.box-register + .news-year {
  margin-top: 60px;
}

/* Box Contact */
.box-contact + .change-form {
  padding-top: 60px !important;
}
@media only screen and (max-width: 1180px) {
  .box-contact + .change-form {
    padding-top: 40px !important;
  }
}
.box-contact .box-border {
  padding: 35px 25px;
  border: 1px solid #003165;
  background-color: #fff;
}
@media only screen and (max-width: 750px) {
  .box-contact .box-border {
    padding: 20px;
  }
}
.box-contact .box-border .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  .box-contact .box-border .ttl {
    display: block;
  }
}
.box-contact .box-border .ttl p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
  padding-right: 25px;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  .box-contact .box-border .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  .box-contact .box-border .ttl p {
    font-size: 1.6rem;
    line-height: 2.6rem;
    padding-right: 0;
  }
}
.box-contact .box-border .ttl a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 3.2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #073165;
}
@media only screen and (max-width: 1180px) {
  .box-contact .box-border .ttl a {
    font-size: 3rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  .box-contact .box-border .ttl a {
    font-size: 2.2rem;
    line-height: 2.2rem;
  }
}
.box-contact .box-border .ttl a span {
  margin-right: 8px;
}
.box-contact .box-border .ttl + .text {
  margin-top: 25px;
}
@media only screen and (max-width: 1180px) {
  .box-contact .box-border .ttl + .text {
    margin-top: 15px;
  }
}
.box-contact .box-border .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 600;
  text-align: center;
  color: #000;
}
@media only screen and (max-width: 750px) {
  .box-contact .box-border .text p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.box-contact .box-border .text p.big {
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media only screen and (max-width: 750px) {
  .box-contact .box-border .text p.big {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
.box-contact .box-border .text p a {
  color: #000;
  text-decoration: underline;
}

.box-cat {
  margin-top: 70px;
  margin-bottom: 25px;
}
@media only screen and (max-width: 750px) {
  .box-cat {
    margin-top: 40px;
  }
}

.box-search-filter {
  padding: 40px 0;
}
@media only screen and (max-width: 750px) {
  .box-search-filter {
    padding: 10px 0 30px 0;
  }
}
.box-search-filter .company-search {
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.box-search-filter .company-filter {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  .box-search-filter .company-filter {
    margin-top: 20px;
  }
}
.box-search-filter .company-filter .filter-list {
  margin-top: 0;
}
@media only screen and (max-width: 750px) {
  .box-search-filter .company-filter .btn-box {
    margin-top: 30px;
    padding: 0 20px;
  }
}
@media only screen and (max-width: 750px) {
  .box-search-filter .company-filter .btn-box .flex {
    display: block;
  }
}
@media only screen and (max-width: 750px) {
  .box-search-filter .company-filter .btn-box .flex button {
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (max-width: 750px) {
  .box-search-filter .company-filter .btn-box .flex button + button {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 750px) {
  .box-search-filter .company-filter .btn-box .flex button {
    width: 100%;
    max-width: 100%;
  }
}

/* About */
#about .about .about-img {
  width: 100%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
  margin-bottom: 40px;
}
#about .about .content .row + .row {
  margin-top: 80px;
}
@media only screen and (max-width: 900px) {
  #about .about .content .row + .row {
    margin-top: 60px;
  }
}
#about .about .content .row .purpose .purpose-row + .purpose-row {
  margin-top: 60px;
}
#about .about .content .row .purpose .purpose-row h3 {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 700;
  color: #003165;
  position: relative;
  text-align: center;
  padding-bottom: 7px;
  margin-bottom: 35px;
  display: table;
  margin-left: auto;
  margin-right: auto;
  padding-left: 7px;
  padding-right: 7px;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .purpose .purpose-row h3 {
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .purpose .purpose-row h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
    margin-bottom: 25px;
  }
}
#about .about .content .row .purpose .purpose-row h3::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 8;
  width: 100%;
  height: 4px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 4px;
  background-color: #003165;
}
#about .about .content .row .purpose .purpose-row .idea h4 {
  font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 3.4rem;
  line-height: 4.4rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .purpose .purpose-row .idea h4 {
    font-size: 3rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .purpose .purpose-row .idea h4 {
    font-size: 2.6rem;
    line-height: 3.6rem;
  }
}
#about .about .content .row .purpose .purpose-row .flex {
  width: 100%;
  max-width: 638px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .purpose .purpose-row .flex {
    display: block;
  }
}
#about .about .content .row .purpose .purpose-row .flex .col {
  width: 32.33%;
  padding: 7% 0;
  position: relative;
  border: 2px solid #F0F0F0;
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .purpose .purpose-row .flex .col + .col {
    margin-top: 2%;
  }
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .purpose .purpose-row .flex .col {
    width: 100%;
    padding: 0;
    min-height: 230px;
  }
}
#about .about .content .row .purpose .purpose-row .flex .col p {
  position: relative;
  font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 1.8rem;
  line-height: 3.2rem;
  font-weight: 600;
  color: #000;
  z-index: 3;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .purpose .purpose-row .flex .col p {
    font-size: 1.6rem;
    line-height: 3rem;
  }
}
#about .about .content .row .purpose .purpose-row .flex .col p.no {
  position: absolute;
  font-family: "Noto Serif JP", serif;
  font-size: 14rem;
  line-height: 14rem;
  z-index: 2;
  color: #003165;
  opacity: 0.03;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .purpose .purpose-row .flex .col p.no {
    font-size: 12rem;
    line-height: 12rem;
  }
}
#about .about .content .row .purpose .purpose-row .action p {
  font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 2rem;
  line-height: 3.4rem;
  color: #000;
  font-weight: 600;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .purpose .purpose-row .action p {
    font-size: 1.8rem;
    line-height: 3.2rem;
  }
}
#about .about .content .row .emblem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .emblem {
    display: block;
  }
}
#about .about .content .row .emblem .logo {
  width: 320px;
  min-width: 320px;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .emblem .logo {
    width: 260px;
    min-width: 260px;
  }
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .emblem .logo {
    margin-left: auto;
    margin-right: auto;
  }
}
#about .about .content .row .emblem .logo img {
  width: 50%;
  max-width: 165px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .emblem .logo img {
    width: 35%;
  }
}
#about .about .content .row .emblem .text {
  width: 100%;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .emblem .text {
    margin-top: 20px;
  }
}
#about .about .content .row .emblem .text p {
  font-size: 1.7rem;
  line-height: 3.2rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .emblem .text p {
    font-size: 1.6rem;
  }
}
#about .about .content .row .history p {
  font-size: 1.7rem;
  line-height: 3.2rem;
  color: #000;
  text-indent: 20px;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .history p {
    font-size: 1.6rem;
  }
}
#about .about .content .row .history p + p {
  margin-top: 25px;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .history p + p {
    margin-top: 15px;
  }
}
#about .about .content .row .history .history-video {
  width: 100%;
  max-width: 664px;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 750px) {
  #about .about .content .row .history .history-video {
    margin-top: 30px;
  }
}
#about .about .content .row .history .history-video .video {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
#about .about .content .row .history .history-video .video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#about .about .content .row .history .history-video p {
  margin-top: 10px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #about .about .content .row .history .history-video p {
    font-size: 1rem;
    line-height: 1.4rem;
  }
}
#about .about .content .dropdown-content {
  margin-top: 80px;
}
@media only screen and (max-width: 750px) {
  #about .about .content .dropdown-content {
    margin-top: 60px;
  }
}
#about .about .content .dropdown-content .col4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #about .about .content .dropdown-content .col4 {
    display: block;
  }
}
#about .about .content .dropdown-content .col4 .col {
  width: 32%;
}
@media only screen and (max-width: 750px) {
  #about .about .content .dropdown-content .col4 .col {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #about .about .content .dropdown-content .col4 .col + .col {
    margin-top: 3%;
  }
}
#about .about .content .dropdown-content .col4 .col .box + .box {
  margin-top: 5.5%;
}
@media only screen and (max-width: 750px) {
  #about .about .content .dropdown-content .col4 .col .box + .box {
    margin-top: 3%;
  }
}
#about .about .content .dropdown-content .col4 .col .box a {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}
#about .about .content .dropdown-content .col4 .col .box a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 100%;
  border: 0px solid #24A2E9;
  border-radius: 4px;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
#about .about .content .dropdown-content .col4 .col .box a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 7;
  width: 100%;
  height: 100%;
  background-image: url("/assets/images/commons/btn-page-next-white.svg");
  background-repeat: no-repeat;
  background-position: bottom 15px right 15px;
  background-size: 12px 9px;
  background-color: rgba(0, 0, 0, 0.25);
}
#about .about .content .dropdown-content .col4 .col .box a:hover {
  opacity: 1;
}
#about .about .content .dropdown-content .col4 .col .box a:hover img {
  opacity: 1;
}
#about .about .content .dropdown-content .col4 .col .box a:hover::before {
  border-width: 8px;
}
#about .about .content .dropdown-content .col4 .col .box a .text {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#about .about .content .dropdown-content .col4 .col .box a .text p {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  color: #fff;
}
#about .about .content .dropdown-content .col4 .col .box a img {
  width: 100%;
  height: auto;
}
#about .message .content .row .message-content .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #about .message .content .row .message-content .flex {
    display: block;
  }
}
#about .message .content .row .message-content .flex .img {
  width: 270px;
  min-width: 270px;
}
@media only screen and (max-width: 900px) {
  #about .message .content .row .message-content .flex .img {
    width: 200px;
    min-width: 200px;
  }
}
@media only screen and (max-width: 750px) {
  #about .message .content .row .message-content .flex .img {
    margin-left: auto;
    margin-right: auto;
  }
}
#about .message .content .row .message-content .flex .img p {
  margin-top: 15px;
  font-size: 1.7rem;
  line-height: 2.7rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #about .message .content .row .message-content .flex .img p {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#about .message .content .row .message-content .flex .img p span {
  display: block;
  font-size: 2.4rem;
  line-height: 3.4rem;
}
@media only screen and (max-width: 750px) {
  #about .message .content .row .message-content .flex .img p span {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
#about .message .content .row .message-content .flex .text {
  width: 100%;
  padding-left: 65px;
  color: #000;
}
@media only screen and (max-width: 900px) {
  #about .message .content .row .message-content .flex .text {
    padding-left: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #about .message .content .row .message-content .flex .text {
    padding-left: 0;
    margin-top: 20px;
  }
}
#about .message .content .row .message-content .flex .text p {
  font-size: 1.7rem;
  line-height: 3.4rem;
  text-indent: 20px;
}
@media only screen and (max-width: 1180px) {
  #about .message .content .row .message-content .flex .text p {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #about .message .content .row .message-content .flex .text p {
    font-size: 1.3rem;
    line-height: 3rem;
  }
}
#about .message .content .row .message-content .flex .text p + p {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #about .message .content .row .message-content .flex .text p + p {
    margin-top: 15px;
  }
}
#about .message .content .row .message-content .flex .text p.align-right {
  text-align: right;
}
#about .message .content .row .message-content .news-year {
  margin-top: 40px;
}
#about .message .content .row .message-content .news-year h3 {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 13px;
}
@media only screen and (max-width: 900px) {
  #about .message .content .row .message-content .news-year h3 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#about .message .content .row .successive-content .table {
  width: 100%;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
#about .message .content .row + .row {
  margin-top: 120px;
}
@media only screen and (max-width: 900px) {
  #about .message .content .row + .row {
    margin-top: 60px;
  }
}
#about .officer .content .row + .row {
  margin-top: 120px;
}
@media only screen and (max-width: 900px) {
  #about .officer .content .row + .row {
    margin-top: 60px;
  }
}
#about .officer .content .row .officer-list .row + .row {
  margin-top: 40px;
}
@media only screen and (max-width: 900px) {
  #about .officer .content .row .officer-list .row + .row {
    margin-top: 20px;
  }
}

.table .scroll {
  overflow: auto;
}
.table .scroll table {
  width: 100%;
  min-width: 640px;
}
.table .scroll table.bg-switch tr.topic {
  background-color: #656565 !important;
}
.table .scroll table.bg-switch tr.topic td {
  font-weight: 600;
  color: #fff !important;
  text-align: center;
}
.table .scroll table.bg-switch tr.left {
  background-color: #656565 !important;
}
.table .scroll table.bg-switch tr.left td {
  text-align: left !important;
}
.table .scroll table.bg-switch tr:nth-child(odd) {
  background-color: #F5F5F5;
}
.table .scroll table.bg-switch tr td {
  padding: 6px 20px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  .table .scroll table.bg-switch tr td {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.table .scroll table.bg-switch tr td + td {
  border-left: 1px solid #E7E7E7;
}
.table .scroll table.bg-switch tr td span.small {
  font-size: 1.1rem;
}
.table .scroll table.fee-monthly {
  border-bottom: 1px solid #E7E7E7;
}
.table .scroll table.fee-monthly tr {
  border-top: 1px solid #E7E7E7;
}
.table .scroll table.fee-monthly tr:nth-child(2) td {
  font-size: 1.3rem;
  line-height: 2.3rem;
}
.table .scroll table.fee-monthly tr td {
  padding: 6px 20px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 900px) {
  .table .scroll table.fee-monthly tr td {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.table .scroll table.fee-monthly tr td + td {
  border-left: 1px solid #E7E7E7;
}
.table .scroll table.fee-monthly tr td:nth-child(odd) {
  background-color: #F5F5F5;
}
.table .scroll table.fee-monthly tr td.topic {
  width: 70px;
  min-width: 70px;
  padding-left: 0;
  padding-right: 0;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #fff;
  font-weight: 600;
  background-color: #656565;
}
@media only screen and (max-width: 900px) {
  .table .scroll table.fee-monthly tr td.topic {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.table .scroll table.fee-standards {
  position: relative;
  border-spacing: 1px;
  border-collapse: separate;
  background-color: #E7E7E7;
}
.table .scroll table.fee-standards::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 1px;
  height: 100%;
  background-color: #fff;
}
.table .scroll table.fee-standards::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 8;
  width: 1px;
  height: 100%;
  background-color: #fff;
}
.table .scroll table.fee-standards tr {
  background-color: #fff;
}
.table .scroll table.fee-standards tr.topic {
  background-color: #656565 !important;
}
.table .scroll table.fee-standards tr.topic td {
  font-weight: 600;
  color: #fff !important;
  text-align: center;
}
.table .scroll table.fee-standards tr.left {
  background-color: #656565 !important;
}
.table .scroll table.fee-standards tr.left td {
  text-align: left !important;
}
.table .scroll table.fee-standards tr:nth-child(even) {
  background-color: #F5F5F5;
}
.table .scroll table.fee-standards tr td {
  padding: 6px 20px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 900px) {
  .table .scroll table.fee-standards tr td {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.table .scroll table.fee-standards tr td.small {
  font-size: 1.3rem;
  line-height: 2.3rem;
}
.table .scroll table.fee-standards tr td.bg-magentar {
  font-weight: 600;
  color: #fff;
  background-color: #6353A8;
  vertical-align: middle;
}
.table .scroll table.fee-standards tr td.bg-violet {
  font-weight: 600;
  color: #fff;
  background-color: #9B53A8;
  vertical-align: middle;
}
.table .scroll table.fee-standards tr td.bg-red {
  font-weight: 600;
  color: #fff;
  background-color: #D56572;
  vertical-align: middle;
}
.table .scroll table.fee-standards tr td.bg-blue {
  font-weight: 600;
  color: #fff;
  background-color: #4D9FC3;
  vertical-align: middle;
}
.table .scroll table.fee-cal {
  position: relative;
  background-color: #E7E7E7;
}
.table .scroll table.fee-cal::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 1px;
  height: 100%;
  background-color: #fff;
}
.table .scroll table.fee-cal::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 8;
  width: 1px;
  height: 100%;
  background-color: #fff;
}
.table .scroll table.fee-cal tr {
  background-color: #fff;
}
.table .scroll table.fee-cal tr:last-child {
  border-bottom: 1px solid #E7E7E7;
}
.table .scroll table.fee-cal tr.topic {
  background-color: #656565 !important;
}
.table .scroll table.fee-cal tr.topic td {
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 600;
  color: #fff !important;
  text-align: center;
}
.table .scroll table.fee-cal tr:nth-child(even) {
  background-color: #F5F5F5;
}
.table .scroll table.fee-cal tr td {
  padding: 6px 14px;
  font-size: 1.3rem;
  line-height: 2.3rem;
  color: #000;
}
.table .scroll table.fee-cal tr td:nth-child(1) {
  padding-left: 30px;
  padding-right: 0;
}
.table .scroll table.fee-cal tr td:nth-child(2) {
  padding-left: 0;
  padding-right: 0;
}
.table .scroll table.fee-cal tr td:nth-child(3) {
  padding-left: 0;
  padding-right: 30px;
}
.table .scroll table.fee-cal tr td:last-child {
  border-left: 1px solid #E7E7E7;
}
.table + .table {
  margin-top: 25px;
}

.box-white-pad {
  padding: 40px;
  background-color: #fff;
}
@media only screen and (max-width: 900px) {
  .box-white-pad {
    padding: 20px;
  }
}

/* Login */
#login-page .login-page .login-page-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #login-page .login-page .login-page-flex {
    display: block;
  }
}
#login-page .login-page .login-page-flex .col {
  width: 48.5%;
  background-color: #fff;
  border-radius: 4px;
  overflow: hidden;
}
@media only screen and (max-width: 750px) {
  #login-page .login-page .login-page-flex .col {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #login-page .login-page .login-page-flex .col + .col {
    margin-top: 5%;
  }
}
#login-page .login-page .login-page-flex .col .txthead-box {
  padding-top: 38px;
}
#login-page .login-page .login-page-flex .col .content {
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
  padding-bottom: 40px;
  padding-left: 20px;
  padding-right: 20px;
}
#login-page .login-page .login-page-flex .col.admission .txthead-box {
  min-height: 112px;
  background-image: url(/assets/images/commons/topic-line-grid-white.svg), url("/assets/images/login/admission-bg.jpg");
  background-repeat: repeat-x, no-repeat;
  background-position: bottom left, center;
  background-size: 6px 9px, cover;
}
#login-page .login-page .login-page-flex .col.admission .txthead-box h2 {
  color: #fff;
}
#login-page .login-page .login-page-flex .col.admission .content p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  text-align: center;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #login-page .login-page .login-page-flex .col.admission .content p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#login-page .login-page .login-page-flex .col.admission .content .button {
  margin-top: 18px;
}
#login-page .login-page .login-page-flex .col.admission .content .button a + a {
  margin-top: 14px;
}
#login-page .login-page .login-page-flex .col.login {
  border: 2px solid #003165;
}
#login-page .login-page .login-page-flex .col.login .txthead-box h2 {
  color: #003165;
}
#login-page .login-page .login-page-flex .col.login .content .form-row + .form-row {
  margin-top: 8px;
}
#login-page .login-page .login-page-flex .col.login .content .button {
  margin-top: 20px;
}
#login-page .login-page .login-page-flex .col.login .content .button a {
  display: table;
  font-weight: 600;
  color: #000;
  padding-left: 18px;
  background-image: url(/assets/images/commons/btn-page-next.svg);
  background-repeat: no-repeat;
  background-position: top 6px left;
  background-size: 12px 9px;
}
#login-page .login-page .login-page-flex .col.login .content .button a + a {
  margin-top: 5px;
}
#login-page .about {
  color: #000;
}
#login-page .about .content > p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  padding-left: 30px;
  padding-right: 30px;
}
@media only screen and (max-width: 750px) {
  #login-page .about .content > p {
    padding-left: 0;
    padding-right: 0;
  }
}
#login-page .about .content .row {
  margin-top: 30px;
}
#login-page .about .content .row + .row {
  margin-top: 50px;
}
#login-page .about .content .row .text {
  font-size: 1.7rem;
  line-height: 3.2rem;
  padding-left: 30px;
  padding-right: 30px;
}
@media only screen and (max-width: 750px) {
  #login-page .about .content .row .text {
    padding-left: 0;
    padding-right: 0;
  }
}
#login-page .about .content .row .text ul li {
  position: relative;
  padding-left: 10px;
}
#login-page .about .content .row .text ul li::before {
  content: "•";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
}
#login-page .about .content .row .text p + p {
  margin-top: 25px;
}
@media only screen and (max-width: 750px) {
  #login-page .about .content .row .text p + p {
    margin-top: 15px;
  }
}

/* Fotget */
#forget-page .forget-page .content .row + .row {
  margin-top: 80px;
}
@media only screen and (max-width: 1180px) {
  #forget-page .forget-page .content .row + .row {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row + .row {
    margin-top: 40px;
  }
}
#forget-page .forget-page .content .row .txthead-box {
  padding-bottom: 30px;
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row .txthead-box {
    padding-bottom: 20px;
  }
}
#forget-page .forget-page .content .row .txthead-box h2 {
  text-align: center;
}
#forget-page .forget-page .content .row .txthead-box h2 span {
  font-size: 1.7rem;
  line-height: 2rem;
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row .txthead-box h2 span {
    font-size: 1.3rem;
    line-height: 1.6rem;
  }
}
#forget-page .forget-page .content .row .row-content p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  text-align: center;
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row .row-content p {
    font-size: 1.3rem;
    line-height: 2.3rem;
    text-align: left;
  }
}
#forget-page .forget-page .content .row .row-content.forgot-form {
  width: 100%;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}
#forget-page .forget-page .content .row .row-content.forgot-form .form-row + .form-row {
  margin-top: 8px;
}
#forget-page .forget-page .content .row .row-content.forgot-form + p {
  margin-top: 40px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row .row-content.forgot-form + p {
    margin-top: 20px;
  }
}
#forget-page .forget-page .content .row .pwd_reset + .txthead-box {
  margin-top: 75px;
}
#forget-page .forget-page .content .row .pwd_reset p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
#forget-page .forget-page .content .row .pwd_reset p + .checklist {
  margin-top: 20px;
}
#forget-page .forget-page .content .row .pwd_reset p a {
  color: #003165;
  text-decoration: underline;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: #F8F8F8;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li {
  width: 33.33%;
  position: relative;
  padding: 60px 0 20px 0;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li::before {
  content: "";
  position: absolute;
  top: 23px;
  left: 0;
  right: 0;
  z-index: 8;
  width: 26px;
  height: 26px;
  border-radius: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: #C3C3C3;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li::after {
  content: "";
  position: absolute;
  top: 35px;
  z-index: 7;
  width: 100%;
  height: 2px;
  background-color: #C3C3C3;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li:first-child::after {
  width: 50%;
  right: 0;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li:last-child::after {
  width: 50%;
  left: 0;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li p {
  font-weight: 700;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row .pwd_reset .checklist ul li p {
    font-size: 1.4rem;
    line-height: 2rem;
  }
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li.checked {
  background-color: #EBF4FA;
}
#forget-page .forget-page .content .row .pwd_reset .checklist ul li.checked::before {
  top: 20px;
  width: 32px;
  height: 32px;
  background-color: #EBF4FA;
  background-image: url("../images/commons/pwd_reset_icon-checked.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#forget-page .forget-page .content .row .pwd_reset .checklist + p {
  margin-top: 20px;
}
#forget-page .forget-page .content .row .pwd_reset form {
  margin-top: 45px;
  margin-bottom: 40px;
}
@media only screen and (max-width: 750px) {
  #forget-page .forget-page .content .row .pwd_reset form {
    margin-top: 25px;
    margin-bottom: 20px;
  }
}

/* MyPage */
#mypage .mypage .content .mypage-form .row {
  border-top: 1px solid #E7E7E7;
}
#mypage .mypage .content .mypage-form .row + .row {
  margin-top: 50px;
}
#mypage .mypage .content .mypage-form .row.button {
  border-top: 0;
}
#mypage .mypage .content .mypage-form .row.button p.red {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #DE2200;
  text-align: center;
  margin-bottom: 15px;
}
#mypage .mypage .content .mypage-form .row .row-sub {
  padding: 13px 0;
  border-bottom: 1px solid #E7E7E7;
}
@media only screen and (max-width: 750px) {
  #mypage .mypage .content .mypage-form .row .row-sub {
    padding: 16px 0;
  }
}
#mypage .mypage .content .mypage-form .row .row-sub.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  #mypage .mypage .content .mypage-form .row .row-sub.flex {
    display: block;
  }
}
#mypage .mypage .content .mypage-form .row .row-sub.flex .topic {
  width: 130px;
  min-width: 130px;
  padding-top: 3px;
}
@media only screen and (max-width: 750px) {
  #mypage .mypage .content .mypage-form .row .row-sub.flex .topic {
    width: 100%;
    min-width: 100%;
    padding-top: 0;
  }
}
#mypage .mypage .content .mypage-form .row .row-sub.flex .topic p {
  color: #000;
}
#mypage .mypage .content .mypage-form .row .row-sub.flex .field {
  width: 100%;
}
@media only screen and (max-width: 750px) {
  #mypage .mypage .content .mypage-form .row .row-sub.flex .field {
    margin-top: 10px;
  }
}
#mypage .mypage .content .mypage-form .row .row-sub.flex .field p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
#mypage .mypage .content .mypage-form .row .row-sub.flex .field p + p {
  margin-top: 10px;
}

/* Change */
.change-form {
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: top left;
  background-size: 6px 9px;
  padding-top: 45px;
  padding-bottom: 20px;
}
.change-form.hide-border-top {
  background-image: none;
}
.change-form .row + .row {
  margin-top: 75px;
}
@media only screen and (max-width: 900px) {
  .change-form .row + .row {
    margin-top: 50px;
  }
}
.change-form .row.button {
  margin-top: 60px;
}
@media only screen and (max-width: 900px) {
  .change-form .row.button {
    margin-top: 40px;
  }
}
.change-form .row.button.mt35 {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  .change-form .row.button.mt35 {
    margin-top: 40px;
  }
}
.change-form .row.button .btn + .btn {
  margin-top: 18px;
}
@media only screen and (max-width: 750px) {
  .change-form .row.button .btn + .btn {
    margin-top: 10px;
  }
}
.change-form .row .form-row {
  padding-left: 40px;
  padding-right: 40px;
  border-bottom: 1px solid #E7E7E7;
  padding-bottom: 35px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row {
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 30px;
  }
}
.change-form .row .form-row + .form-row {
  padding-top: 35px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row + .form-row {
    padding-top: 30px;
  }
}
.change-form .row .form-row.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row.flex {
    display: block;
  }
}
.change-form .row .form-row .col {
  width: 100%;
}
.change-form .row .form-row .col .w35 {
  width: 35%;
  min-width: 87px;
}
.change-form .row .form-row .col.w50 {
  width: 46.5%;
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col.w50 {
    width: 100%;
  }
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col.w50 + .w50 {
    margin-top: 20px;
  }
}
.change-form .row .form-row .col.w54 {
  width: 54%;
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col.w54 {
    width: 100%;
  }
}
.change-form .row .form-row .col.w60 {
  width: 56.5%;
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col.w60 {
    width: 100%;
  }
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col.w60 + .w60 {
    margin-top: 20px;
  }
}
.change-form .row .form-row .col.w100 {
  width: 100%;
}
.change-form .row .form-row .col.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.change-form .row .form-row .col.flex .field {
  margin-top: 0;
}
.change-form .row .form-row .col.select {
  margin-right: 10px;
}
.change-form .row .form-row .col.padtop + .padtop {
  padding-top: 35px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col.padtop + .padtop {
    padding-top: 30px;
  }
}
.change-form .row .form-row .col .topic {
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 600;
  color: #000;
}
.change-form .row .form-row .col .topic span {
  color: #DE2200;
}
.change-form .row .form-row .col .field {
  margin-top: 13px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .field {
    margin-top: 10px;
  }
}
.change-form .row .form-row .col .field .alert {
  margin-top: 10px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #DE2200;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .field .alert {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
.change-form .row .form-row .col .field .note {
  margin-top: 6px;
  font-size: 1.1rem;
  line-height: 1.6rem;
  color: #888;
}
.change-form .row .form-row .col .field label + label {
  margin-top: 12px;
}
.change-form .row .form-row .col .field .checkbox-list li + li {
  margin-top: 18px;
}
.change-form .row .form-row .col .field .checkbox-list li.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .field .checkbox-list li.flex {
    display: block;
  }
}
.change-form .row .form-row .col .field .checkbox-list li.flex .field-check {
  white-space: nowrap;
}
.change-form .row .form-row .col .field .checkbox-list li.flex .field-textbox {
  width: 100%;
  max-width: 263px;
  padding-left: 16px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .field .checkbox-list li.flex .field-textbox {
    padding-left: 38px;
    margin-top: 18px;
    max-width: 100%;
  }
}
.change-form .row .form-row .col .field .checkbox-list li.flex .field-textbox.w100 {
  max-width: 100%;
}
.change-form .row .form-row .col .field.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.change-form .row .form-row .col .field.flex .select {
  width: 80px;
  min-width: 80px;
}
.change-form .row .form-row .col .field.align-center {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.change-form .row .form-row .col .field .link-calendar {
  width: 46px;
  min-width: 46px;
  margin-left: 20px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .field .link-calendar {
    width: 32px;
    min-width: 32px;
    margin-left: 18px;
  }
}
.change-form .row .form-row .col .field .field-row.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.change-form .row .form-row .col .field .field-row + .field-row {
  margin-top: 20px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .field .field-row + .field-row {
    margin-top: 10px;
  }
}
.change-form .row .form-row .col .field .field-row .btn-add {
  width: 50px;
  min-width: 50px;
  padding-left: 18px;
}
.change-form .row .form-row .col .field.w100 {
  width: 100%;
}
.change-form .row .form-row .col .col-row {
  margin-top: 17px;
  padding-left: 25px;
  padding-right: 25px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .col-row {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.change-form .row .form-row .col .col-row.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col .col-row.flex {
    display: block;
  }
}
.change-form .row .form-row .col .col-row + .col-row {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  .change-form .row .form-row .col .col-row + .col-row {
    margin-top: 25px;
  }
}
.change-form .row .form-row .col .col-row.padtopshort + .padtopshort {
  margin-top: 15px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .col-row.padtopshort + .padtopshort {
    margin-top: 10px;
  }
}
.change-form .row .form-row .col .col-row .country-code {
  margin-top: 15px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  .change-form .row .form-row .col .col-row .country-code {
    margin-top: 10px;
  }
}
.change-form .row .form-text h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
.change-form .row .form-text p {
  margin-top: 25px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
.change-form .row .recaptcha {
  display: table;
  margin-left: auto;
  margin-right: auto;
}
.change-form .row .text-policy {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  .change-form .row .text-policy {
    margin-top: 20px;
  }
}
.change-form .row .text-policy p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  text-align: center;
}
.change-form .row .text-policy .checkbox {
  display: table;
  margin-top: 15px;
  margin-left: auto;
  margin-right: auto;
}
.change-form .row .text-policy .checkbox label {
  font-weight: 600;
}
.change-form + .box-contact {
  margin-top: 45px;
}
@media only screen and (max-width: 750px) {
  .change-form + .box-contact {
    margin-top: 15px;
  }
}

/* Access */
#access .access .content .row + .row {
  margin-top: 80px;
}
@media only screen and (max-width: 900px) {
  #access .access .content .row + .row {
    margin-top: 40px;
  }
}
#access .access .content .row .intro {
  margin-bottom: 30px;
}
#access .access .content .row .intro p {
  font-size: 1.7rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 900px) {
  #access .access .content .row .intro p {
    font-size: 1.6rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #access .access .content .row .intro p {
    font-size: 1.5rem;
    line-height: 2.6rem;
  }
}
#access .access .content .row .box-white-pad + .box-white-pad {
  margin-top: 40px;
}
@media only screen and (max-width: 900px) {
  #access .access .content .row .box-white-pad + .box-white-pad {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #access .access .content .row .box-white-pad + .box-white-pad {
    margin-top: 20px;
  }
}
#access .access .content .row .box-white-pad h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 15px;
}
@media only screen and (max-width: 900px) {
  #access .access .content .row .box-white-pad h3 {
    font-size: 2.2rem;
    line-height: 3.2rem;
    margin-bottom: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #access .access .content .row .box-white-pad h3 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
#access .access .content .row .box-white-pad p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #access .access .content .row .box-white-pad p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#access .access .content .row .box-white-pad .map-iframe {
  margin-top: 40px;
  position: relative;
  padding-bottom: 66.668%;
  height: 0;
  min-height: 220px;
  overflow: hidden;
}
#access .access .content .row .box-white-pad .map-iframe iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
#access .access .content .row .box-white-pad .map {
  margin-top: 25px;
}
#access .access .content .row .box-white-pad .office-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -35px;
}
#access .access .content .row .box-white-pad .office-list li {
  width: 47.5%;
  margin-top: 35px;
}
#access .access .content .row .box-white-pad .office-list li img {
  width: 100%;
  height: auto;
}
#access .access .content .row .box-white-pad .office-list li p {
  margin-top: 6px;
  font-size: 1.1rem;
  line-height: 1.6rem;
}
#access .access .content .row .box-white-pad .holiday-table > p {
  margin-top: 10px;
  font-size: 1.3rem;
  line-height: 2rem;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  #access .access .content .row .box-white-pad .holiday-table > p {
    text-align: left;
  }
}

/* Access */
#publishing .publishing .content .row + .row {
  margin-top: 80px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row + .row {
    margin-top: 40px;
  }
}
#publishing .publishing .content .row .row-box {
  padding: 0 20px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box {
    padding: 0;
  }
}
#publishing .publishing .content .row .row-box.howto {
  color: #000;
}
#publishing .publishing .content .row .row-box.howto > p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.howto > p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#publishing .publishing .content .row .row-box.howto .flex {
  margin-top: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.howto .flex {
    margin-top: 25px;
    display: block;
  }
}
#publishing .publishing .content .row .row-box.howto .flex .col {
  width: 48%;
  padding: 30px;
  background-color: #F5F5F5;
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.howto .flex .col {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.howto .flex .col {
    display: block;
  }
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.howto .flex .col + .col {
    margin-top: 15px;
  }
}
#publishing .publishing .content .row .row-box.howto .flex .col .icon {
  width: 42px;
  min-width: 42px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.howto .flex .col .icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
  }
}
#publishing .publishing .content .row .row-box.howto .flex .col .text {
  width: 100%;
  padding-left: 20px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.howto .flex .col .text {
    padding-left: 0;
  }
}
#publishing .publishing .content .row .row-box.howto .flex .col .text h3 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 700;
  margin-bottom: 10px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.howto .flex .col .text h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#publishing .publishing .content .row .row-box.howto .flex .col .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 500;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.howto .flex .col .text p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#publishing .publishing .content .row .row-box.howto .flex .col .text p.remark {
  margin-top: 5px;
  font-size: 1.1rem;
  line-height: 2.1rem;
  font-weight: 400;
}
#publishing .publishing .content .row .row-box.cost {
  color: #000;
}
#publishing .publishing .content .row .row-box.cost .ttl h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 700;
}
@media only screen and (max-width: 1180px) {
  #publishing .publishing .content .row .row-box.cost .ttl h3 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.cost .ttl h3 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#publishing .publishing .content .row .row-box.cost .ttl p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #DE2200;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.cost .ttl p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#publishing .publishing .content .row .row-box.cost .text {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.cost .text {
    margin-top: 20px;
  }
}
#publishing .publishing .content .row .row-box.cost .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.cost .text p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#publishing .publishing .content .row .row-box.cost .text .box {
  margin-top: 35px;
  padding: 15px 40px;
  background-color: #F5F5F5;
  border-radius: 4px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.cost .text .box {
    margin-top: 25px;
    padding: 15px 20px;
  }
}
#publishing .publishing .content .row .row-box.cost .text .box h4 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 700;
  margin-bottom: 10px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.cost .text .box h4 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.cost .text .box h4 {
    margin-bottom: 5px;
  }
}
#publishing .publishing .content .row .row-box.order {
  color: #000;
}
#publishing .publishing .content .row .row-box.order .order-list ul li {
  padding: 40px 30px;
  background-color: #F5F5F5;
}
#publishing .publishing .content .row .row-box.order .order-list ul li + li {
  margin-top: 40px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li + li {
    margin-top: 15px;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box {
    display: block;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .cover {
  width: 102px;
  min-width: 102px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .cover {
    margin-left: auto;
    margin-right: auto;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .cover img {
  border: 1px solid #707070;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief {
  width: 100%;
  padding-left: 45px;
  padding-right: 45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief {
    margin-top: 30px;
    padding-left: 0;
    padding-right: 0;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top {
  min-height: 110px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top {
    min-height: auto;
    height: auto;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top h3 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 700;
  margin-bottom: 15px;
}
@media only screen and (max-width: 1180px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
    margin-bottom: 10px;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top h3 span {
  font-size: 2.4rem;
}
@media only screen and (max-width: 1180px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top h3 span {
    font-size: 2rem;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox {
  margin-top: 20px;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list + .checkbox-list {
  margin-top: 20px;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-radio {
  padding-right: 10px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-radio {
    padding-right: 0;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: -11px;
}
@media only screen and (max-width: 900px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-flex {
    margin-top: 12px;
    padding-left: 32px;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-flex .list-field {
  width: 92px;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-flex .list-field {
    width: 72px;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-flex .list-field .textbox {
  text-align: center;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .top .checkbox .checkbox-list .checkbox-list-flex .list-field-text {
  padding: 0 10px;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm {
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm {
    margin-top: 25px;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col {
  margin-right: 45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 92px;
  height: 22px;
  margin-right: 12px;
  padding: 0 10px;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .tag.blue {
  color: #fff;
  background-color: #003165;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .tag.grey {
  color: #fff;
  background-color: #979797;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .price {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 700;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .price {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .price span {
  font-size: 2.4rem;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .brief .btm .price-col .price span {
    font-size: 2.2rem;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .field {
  width: 120px;
  min-width: 120px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
@media only screen and (max-width: 750px) {
  #publishing .publishing .content .row .row-box.order .order-list ul li .box .field {
    margin-top: 25px;
  }
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .field .textbox {
  text-align: center;
}
#publishing .publishing .content .row .row-box.order .order-list ul li .box .field p {
  font-size: 1.8rem;
  line-height: 2.8rem;
  padding-left: 10px;
}

/* Policy */
#policy .policy .content .row + .row {
  margin-top: 50px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row + .row {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row + .row {
    margin-top: 25px;
  }
}
#policy .policy .content .row .ttl {
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
  margin-bottom: 25px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .ttl {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .ttl {
    margin-bottom: 15px;
  }
}
#policy .policy .content .row .ttl h2 {
  position: relative;
  font-size: 2.8rem;
  line-height: 3.8rem;
  color: #000;
  font-weight: 600;
  padding-left: 30px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .ttl h2 {
    font-size: 2.4rem;
    line-height: 3.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .ttl h2 {
    font-size: 1.8rem;
    line-height: 2.8rem;
    padding-left: 25px;
  }
}
#policy .policy .content .row .ttl h2 span {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
}
#policy .policy .content .row .text p {
  font-size: 1.5rem;
  line-height: 3rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .text p {
    font-size: 1.4rem;
    line-height: 2.9rem;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text p {
    font-size: 1.3rem;
    line-height: 2.6rem;
  }
}
#policy .policy .content .row .text p strong {
  font-weight: 600;
}
#policy .policy .content .row .text p + p {
  margin-top: 25px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .text p + p {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text p + p {
    margin-top: 15px;
  }
}
#policy .policy .content .row .text p + ul {
  margin-top: 25px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .text p + ul {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text p + ul {
    margin-top: 15px;
  }
}
#policy .policy .content .row .text p a {
  color: #000;
}
#policy .policy .content .row .text ul {
  margin-left: 20px;
}
#policy .policy .content .row .text ul li {
  position: relative;
  padding-left: 23px;
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text ul li {
    padding-left: 20px;
  }
}
#policy .policy .content .row .text ul li::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  z-index: 8;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  background-color: #000;
  display: block;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .text ul li::before {
    top: 7px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text ul li::before {
    width: 12px;
    height: 12px;
  }
}
#policy .policy .content .row .text ul li + li {
  margin-top: 15px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .text ul li + li {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text ul li + li {
    margin-top: 5px;
  }
}
#policy .policy .content .row .text ul + p {
  margin-top: 25px;
}
@media only screen and (max-width: 1180px) {
  #policy .policy .content .row .text ul + p {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #policy .policy .content .row .text ul + p {
    margin-top: 15px;
  }
}

/* Ruleplan */
#ruleplan .ruleplan .content .row + .row {
  margin-top: 50px;
}
@media only screen and (max-width: 1180px) {
  #ruleplan .ruleplan .content .row + .row {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row + .row {
    margin-top: 25px;
  }
}
#ruleplan .ruleplan .content .row .ttl {
  background-image: url(/assets/images/commons/topic-line-grid.svg);
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 6px 9px;
  padding-bottom: 20px;
  margin-bottom: 25px;
}
@media only screen and (max-width: 1180px) {
  #ruleplan .ruleplan .content .row .ttl {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .ttl {
    margin-bottom: 15px;
  }
}
#ruleplan .ruleplan .content .row .ttl h2 {
  position: relative;
  font-size: 2.8rem;
  line-height: 3.8rem;
  color: #000;
  font-weight: 600;
}
@media only screen and (max-width: 1180px) {
  #ruleplan .ruleplan .content .row .ttl h2 {
    font-size: 2.4rem;
    line-height: 3.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .ttl h2 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#ruleplan .ruleplan .content .row .text + .text {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #E7E7E7;
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text + .text {
    margin-top: 25px;
    padding-top: 25px;
  }
}
#ruleplan .ruleplan .content .row .text h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 15px;
}
@media only screen and (max-width: 1180px) {
  #ruleplan .ruleplan .content .row .text h3 {
    font-size: 2rem;
    line-height: 3rem;
    margin-bottom: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
    margin-bottom: 5px;
  }
}
#ruleplan .ruleplan .content .row .text p {
  font-size: 1.5rem;
  line-height: 3rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #ruleplan .ruleplan .content .row .text p {
    font-size: 1.4rem;
    line-height: 2.9rem;
  }
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text p {
    font-size: 1.3rem;
    line-height: 2.6rem;
  }
}
#ruleplan .ruleplan .content .row .text p.right {
  text-align: right;
}
#ruleplan .ruleplan .content .row .text p strong {
  font-weight: 600;
}
#ruleplan .ruleplan .content .row .text p a {
  color: #000;
}
#ruleplan .ruleplan .content .row .text p + ol {
  margin-top: 10px;
}
#ruleplan .ruleplan .content .row .text p + h3 {
  margin-top: 20px;
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text p + h3 {
    margin-bottom: 15px;
  }
}
#ruleplan .ruleplan .content .row .text p + .text-row {
  margin-top: 20px;
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text p + .text-row {
    margin-bottom: 15px;
  }
}
#ruleplan .ruleplan .content .row .text p + p {
  margin-top: 15px;
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text p + p {
    margin-top: 10px;
  }
}
#ruleplan .ruleplan .content .row .text ol li + li {
  margin-top: 5px;
}
#ruleplan .ruleplan .content .row .text ol li p {
  position: relative;
  padding-left: 30px;
}
#ruleplan .ruleplan .content .row .text ol li p span {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
}
#ruleplan .ruleplan .content .row .text .text-row.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
#ruleplan .ruleplan .content .row .text .text-row.flex .left {
  width: 50px;
  min-width: 50px;
}
#ruleplan .ruleplan .content .row .text .text-row.flex .left p {
  text-align: center;
  white-space: nowrap;
}
#ruleplan .ruleplan .content .row .text .text-row.flex .right {
  width: 100%;
  padding-left: 50px;
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text .text-row.flex .right {
    padding-left: 30px;
  }
}
#ruleplan .ruleplan .content .row .text .text-row + .text-row {
  margin-top: 15px;
}
@media only screen and (max-width: 750px) {
  #ruleplan .ruleplan .content .row .text .text-row + .text-row {
    margin-top: 10px;
  }
}

/* Enrollment */
#enrollment {
  position: relative;
}
#enrollment .btn-app {
  position: fixed;
  bottom: 85px;
  right: 0;
  z-index: 9;
}
@media only screen and (max-width: 750px) {
  #enrollment .btn-app {
    width: 66px;
  }
}
#enrollment-intro {
  position: relative;
}
#enrollment-intro .top {
  background-image: url("/assets/images/enrollment/intro-bg.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
}
#enrollment-intro .top .content .ttl p {
  display: table;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 35px;
  padding: 5px 14px;
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #003165;
  background-color: #FFE26A;
  border-radius: 20px;
  position: relative;
}
@media only screen and (max-width: 1180px) {
  #enrollment-intro .top .content .ttl p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-intro .top .content .ttl p {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .top .content .ttl p {
    font-size: 1.4rem;
    line-height: 2.4rem;
    margin-bottom: 15px;
  }
}
#enrollment-intro .top .content .ttl p::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -9px;
  z-index: 8;
  display: table;
  margin-left: auto;
  margin-right: auto;
  width: 13px;
  height: 11px;
  background-color: #FFE26A;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
#enrollment-intro .top .content .ttl h1 {
  font-family: "Noto Serif JP", serif;
  font-size: 7.2rem;
  line-height: 5rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-intro .top .content .ttl h1 {
    font-size: 5.2rem;
    line-height: 5.2rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-intro .top .content .ttl h1 {
    font-size: 4rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .top .content .ttl h1 {
    font-size: 3rem;
    line-height: 4rem;
  }
}
#enrollment-intro .top .content .ttl h1 span {
  font-size: 4rem;
  line-height: 5rem;
}
@media only screen and (max-width: 1180px) {
  #enrollment-intro .top .content .ttl h1 span {
    font-size: 3rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-intro .top .content .ttl h1 span {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .top .content .ttl h1 span {
    font-size: 2rem;
    line-height: 2rem;
  }
}
#enrollment-intro .top .content .text {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .top .content .text {
    margin-top: 15px;
  }
}
#enrollment-intro .top .content .text p {
  font-family: "Noto Serif JP", serif;
  font-size: 2.8rem;
  line-height: 4.2rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-intro .top .content .text p {
    font-size: 2.4rem;
    line-height: 3.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-intro .top .content .text p {
    font-size: 2rem;
    line-height: 3.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .top .content .text p {
    font-size: 1.6rem;
    line-height: 2.8rem;
  }
}
#enrollment-intro .top .content .text p span {
  font-size: 4rem;
}
@media only screen and (max-width: 1180px) {
  #enrollment-intro .top .content .text p span {
    font-size: 3.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-intro .top .content .text p span {
    font-size: 3.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .top .content .text p span {
    font-size: 2.8rem;
  }
}
#enrollment-intro .bottom {
  background-color: #003165;
}
#enrollment-intro .bottom .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .bottom .content {
    margin-top: -25px;
  }
}
#enrollment-intro .bottom .content .col {
  width: 23.5%;
  position: relative;
  padding: 30px 10px 25px 10px;
  border: 1px solid #fff;
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .bottom .content .col {
    width: 49%;
    margin-top: 25px;
    padding: 20px 10px 15px 10px;
  }
}
#enrollment-intro .bottom .content .col span {
  position: absolute;
  top: -18px;
  left: 0;
  right: 0;
  z-index: 8;
  width: 46px;
  margin-left: auto;
  margin-right: auto;
  background-color: #003165;
}
#enrollment-intro .bottom .content .col span img {
  margin-left: auto;
  margin-right: auto;
}
#enrollment-intro .bottom .content .col p {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-intro .bottom .content .col p {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-intro .bottom .content .col p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-intro .bottom .content .col p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-button {
  background-color: #F0F8FF;
}
#enrollment-benefits .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #enrollment-benefits .content {
    margin-top: -4%;
  }
}
#enrollment-benefits .content .col {
  width: 23%;
  background-color: #fff;
}
@media only screen and (max-width: 750px) {
  #enrollment-benefits .content .col {
    width: 48%;
    margin-top: 4%;
  }
}
#enrollment-benefits .content .col .cover img {
  width: 100%;
  height: auto;
}
#enrollment-benefits .content .col .text {
  padding: 15px 0 25px 0;
}
@media only screen and (max-width: 750px) {
  #enrollment-benefits .content .col .text {
    padding: 15px 0;
  }
}
#enrollment-benefits .content .col .text h3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 60px;
  font-family: "Noto Serif JP", serif;
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #003165;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-benefits .content .col .text h3 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-benefits .content .col .text h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-benefits .content .col .text h3 {
    font-size: 1.5rem;
    line-height: 2.5rem;
    min-height: 50px;
  }
}
#enrollment-benefits .content .col .text p {
  margin-top: 15px;
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  text-align: center;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #enrollment-benefits .content .col .text p {
    font-size: 2.2rem;
    line-height: 3.2rem;
    margin-top: 10px;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-benefits .content .col .text p {
    font-size: 2rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-benefits .content .col .text p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#enrollment-benefits .content .col .text p span {
  font-size: 3.2rem;
  color: #BA3166;
}
@media only screen and (max-width: 1180px) {
  #enrollment-benefits .content .col .text p span {
    font-size: 3rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-benefits .content .col .text p span {
    font-size: 2.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-benefits .content .col .text p span {
    font-size: 2.6rem;
  }
}
#enrollment-jcc3 .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content {
    display: block;
  }
}
#enrollment-jcc3 .content .col {
  width: 31.33%;
  background-color: #FAFAFA;
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col + .col {
    margin-top: 15px;
  }
}
#enrollment-jcc3 .content .col .cover img {
  width: 100%;
  height: auto;
}
#enrollment-jcc3 .content .col .brief {
  padding: 20px;
}
#enrollment-jcc3 .content .col .brief .text .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 92px;
}
@media only screen and (max-width: 900px) {
  #enrollment-jcc3 .content .col .brief .text .ttl {
    min-height: 64px;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col .brief .text .ttl {
    min-height: auto;
  }
}
#enrollment-jcc3 .content .col .brief .text .ttl h3 {
  font-family: "Noto Serif JP", serif;
  font-size: 3.6rem;
  line-height: 4.6rem;
  font-weight: 600;
  color: #003165;
}
@media only screen and (max-width: 1180px) {
  #enrollment-jcc3 .content .col .brief .text .ttl h3 {
    font-size: 3rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-jcc3 .content .col .brief .text .ttl h3 {
    font-size: 2.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col .brief .text .ttl h3 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
#enrollment-jcc3 .content .col .brief .text .ttl h3 span {
  color: #BA3166;
}
#enrollment-jcc3 .content .col .brief .text ul {
  margin-top: 15px;
  min-height: 150px;
}
@media only screen and (max-width: 900px) {
  #enrollment-jcc3 .content .col .brief .text ul {
    min-height: 200px;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col .brief .text ul {
    margin-top: 10px;
    min-height: auto;
  }
}
#enrollment-jcc3 .content .col .brief .text ul li {
  position: relative;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  padding-left: 11px;
}
@media only screen and (max-width: 900px) {
  #enrollment-jcc3 .content .col .brief .text ul li {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col .brief .text ul li {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-jcc3 .content .col .brief .text ul li::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  z-index: 8;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  display: table;
  background-color: #003165;
}
#enrollment-jcc3 .content .col .brief .button {
  margin-top: 45px;
}
@media only screen and (max-width: 900px) {
  #enrollment-jcc3 .content .col .brief .button {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-jcc3 .content .col .brief .button {
    margin-top: 15px;
  }
}
#enrollment-jcc3 .content .col .brief .button a + a {
  margin-top: 8px;
}
#enrollment-regis {
  background-image: url("/assets/images/enrollment/regis-bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#enrollment-regis .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #enrollment-regis .content {
    display: block;
  }
}
#enrollment-regis .content .col {
  width: 32%;
  padding: 25px;
  background-color: #fff;
}
@media only screen and (max-width: 900px) {
  #enrollment-regis .content .col + .col {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-regis .content .col {
    width: 100%;
    padding: 20px;
  }
}
#enrollment-regis .content .col h3 {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
  text-align: center;
  margin-bottom: 15px;
}
@media only screen and (max-width: 1180px) {
  #enrollment-regis .content .col h3 {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-regis .content .col h3 {
    margin-bottom: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-regis .content .col h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#enrollment-regis .content .col a.tel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 62px;
  font-size: 2.7rem;
  line-height: 2.6rem;
  font-weight: 600;
  color: #BA3166;
}
@media only screen and (max-width: 1180px) {
  #enrollment-regis .content .col a.tel {
    font-size: 2.3rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-regis .content .col a.tel {
    font-size: 2rem;
    line-height: 2rem;
    height: auto;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-regis .content .col a.tel {
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
#enrollment-regis .content .col a.tel span {
  margin-right: 5px;
}
#enrollment-conditions .content ol li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
}
#enrollment-conditions .content ol li + li {
  margin-top: 15px;
}
@media only screen and (max-width: 900px) {
  #enrollment-conditions .content ol li + li {
    margin-top: 10px;
  }
}
#enrollment-conditions .content ol li .no {
  width: 58px;
  max-width: 58px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #003165;
}
#enrollment-conditions .content ol li .no p {
  font-size: 2.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #fff;
}
@media only screen and (max-width: 1180px) {
  #enrollment-conditions .content ol li .no p {
    font-size: 2.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-conditions .content ol li .no p {
    font-size: 2rem;
    line-height: 2rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-conditions .content ol li .no p {
    font-size: 1.6rem;
    line-height: 1.6rem;
  }
}
#enrollment-conditions .content ol li .text {
  width: 100%;
  padding: 14px 18px;
}
#enrollment-conditions .content ol li .text p {
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #enrollment-conditions .content ol li .text p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-conditions .content ol li .text p {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-conditions .content ol li .text p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#enrollment-conditions .content > p {
  margin-top: 15px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #enrollment-conditions .content > p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-conditions .content > p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-flow .content .box-grey {
  display: table;
  margin-top: 100px;
  padding: 0 40px 40px 40px;
  position: relative;
}
@media only screen and (max-width: 900px) {
  #enrollment-flow .content .box-grey {
    padding: 0 20px 20px 20px;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-flow .content .box-grey {
    margin-top: 80px;
  }
}
#enrollment-flow .content .box-grey .cover-abs {
  width: 100%;
  margin-top: -60px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
@media only screen and (max-width: 750px) {
  #enrollment-flow .content .box-grey .cover-abs {
    margin-top: -40px;
  }
}
#enrollment-flow .content .box-grey .cover-abs div img {
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 750px) {
  #enrollment-flow .content .box-grey .cover-abs div img {
    width: 80px;
    height: auto;
  }
}
#enrollment-flow .content .box-grey .row {
  position: relative;
  z-index: 8;
}
#enrollment-flow .content .box-grey .row + .row {
  margin-top: 10px;
}
#enrollment-flow .content .box-grey .row .col {
  width: 47%;
}
#enrollment-flow .content .box-grey .row .col.full {
  width: 100%;
}
#enrollment-flow .content .box-grey .row .col.right {
  margin-left: auto;
}
#enrollment-flow .content .box-grey .row .col .box {
  padding: 20px;
}
@media only screen and (max-width: 900px) {
  #enrollment-flow .content .box-grey .row .col .box {
    padding: 15px;
  }
}
#enrollment-flow .content .box-grey .row .col .box + .box {
  margin-top: 10px;
}
#enrollment-flow .content .box-grey .row .col .box.white {
  background-color: #fff;
}
#enrollment-flow .content .box-grey .row .col .box.yellow {
  background-color: #FDE26A;
}
#enrollment-flow .content .box-grey .row .col .box h3 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #003165;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-flow .content .box-grey .row .col .box h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-flow .content .box-grey .row .col .box h3 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-flow .content .box-grey .row .col .box h3 {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-flow .content .box-grey .row .col .box h3 + p {
  margin-top: 10px;
}
#enrollment-flow .content .box-grey .row .col .box .sub {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  text-align: center;
  margin-bottom: 10px;
}
@media only screen and (max-width: 1180px) {
  #enrollment-flow .content .box-grey .row .col .box .sub {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-flow .content .box-grey .row .col .box .sub {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-flow .content .box-grey .row .col .box .remark {
  position: relative;
  display: table;
  margin-left: auto;
  margin-right: auto;
  padding-left: 14px;
  text-align: center;
}
#enrollment-flow .content .box-grey .row .col .box .remark span {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
}
#enrollment-flow .content .box-grey .row .col .box .remark.left {
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}
#enrollment-flow .content .box-grey .row .col .box .button {
  margin-top: 30px;
}
#enrollment-flow .content .box-grey .row .col .box .button p {
  font-size: 1.2rem;
  line-height: 1.6rem;
  color: #073165;
  text-align: center;
}
#enrollment-flow .content .box-grey .row .col .box .button .btn {
  margin-top: 10px;
}
#enrollment-flow .content .box-grey .row .col .arrow {
  display: table;
  margin-left: auto;
  margin-right: auto;
}
#enrollment-flow .content .box-grey .row .col .arrow img {
  margin-left: auto;
  margin-right: auto;
}
#enrollment-flow .content .box-grey .row .col .arrow.right {
  width: 47%;
  margin-left: auto;
  margin-right: 0;
}
#enrollment-fee .content .intro p {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .intro p {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .intro p {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-fee .content .intro p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#enrollment-fee .content .intro p.right {
  margin-top: 25px;
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: 400;
  text-align: right;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .intro p.right {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .intro p.right {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-fee .content .intro p.right {
    margin-top: 10px;
  }
}
#enrollment-fee .content .row {
  margin-top: 15px;
}
#enrollment-fee .content .row + .row {
  margin-top: 25px;
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .row + .row {
    margin-top: 15px;
  }
}
#enrollment-fee .content .row.monthly .text .table + .table {
  margin-top: 10px;
}
#enrollment-fee .content .row.monthly .text .table + p {
  margin-top: 20px;
}
#enrollment-fee .content .row.standards .text .text-row p.no {
  position: relative;
  font-weight: 600;
  padding-left: 35px;
}
#enrollment-fee .content .row.standards .text .text-row p.no span {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
}
#enrollment-fee .content .row.standards .text .text-row + .text-row {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .row.standards .text .text-row + .text-row {
    margin-top: 25px;
  }
}
#enrollment-fee .content .row.standards .text .text-row .table {
  margin-top: 20px;
}
#enrollment-fee .content .row.standards .text .text-row .table.no1 > p {
  margin-top: 5px;
  font-size: 1.3rem;
  line-height: 2.3rem;
  color: #656565;
  text-align: right;
}
#enrollment-fee .content .row.standards .text .text-row .table.no1 .scroll {
  position: relative;
}
#enrollment-fee .content .row.standards .text .text-row .table.no1 .scroll::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 1px;
  background-color: #fff;
}
#enrollment-fee .content .row.standards .text .text-row .table.no1 .scroll::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 8;
  width: 100%;
  height: 1px;
  background-color: #fff;
}
#enrollment-fee .content .row.standards .text .text-row .table.calculated {
  width: 100%;
  max-width: 380px;
}
#enrollment-fee .content .row.standards .text .text-row .table.calculated > p {
  margin-bottom: 5px;
}
#enrollment-fee .content .row.standards .text .text-row .table.calculated table {
  min-width: 380px;
}
#enrollment-fee .content .row.standards .text .text-row .table.calculated table tr.topic td {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .row.standards .text .text-row .table.calculated table tr.topic td {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-fee .content .row.standards .text .text-row .table.calculated table tr td {
  font-size: 1.3rem;
  line-height: 2.3rem;
}
#enrollment-fee .content .row .text {
  color: #000;
}
#enrollment-fee .content .row .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .row .text p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .row .text p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-fee .content .row .text p strong {
  font-weight: 600;
}
#enrollment-fee .content .example {
  margin-top: 80px;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .example {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .example {
    margin-top: 40px;
  }
}
#enrollment-fee .content .example .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 750px) {
  #enrollment-fee .content .example .flex {
    display: block;
  }
}
#enrollment-fee .content .example .flex .col {
  width: 49%;
  background-color: #fff;
  border: 1px solid #E3E3E3;
}
@media only screen and (max-width: 750px) {
  #enrollment-fee .content .example .flex .col {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-fee .content .example .flex .col + .col {
    margin-top: 15px;
  }
}
#enrollment-fee .content .example .flex .col .ttl {
  padding: 5px 20px;
  background-color: #003165;
}
#enrollment-fee .content .example .flex .col .ttl h4 {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #fff;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .example .flex .col .ttl h4 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .example .flex .col .ttl h4 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#enrollment-fee .content .example .flex .col .text {
  color: #000;
}
#enrollment-fee .content .example .flex .col .text .pad {
  padding: 20px;
}
#enrollment-fee .content .example .flex .col .text .pad ul {
  margin-left: 20px;
  min-height: 100px;
}
@media only screen and (max-width: 750px) {
  #enrollment-fee .content .example .flex .col .text .pad ul {
    min-height: auto;
  }
}
#enrollment-fee .content .example .flex .col .text .pad ul li {
  font-size: 1.5rem;
  line-height: 2.5rem;
  list-style: disc;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .example .flex .col .text .pad ul li {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .example .flex .col .text .pad ul li {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-fee .content .example .flex .col .text .pad .center {
  margin-top: 25px;
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .example .flex .col .text .pad .center {
    margin-top: 20px;
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .example .flex .col .text .pad .center {
    margin-top: 15px;
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#enrollment-fee .content .example .flex .col .text .pink {
  padding: 15px;
  border-top: 1px solid #E3E3E3;
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  text-align: center;
  color: #BA3166;
}
@media only screen and (max-width: 1180px) {
  #enrollment-fee .content .example .flex .col .text .pink {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-fee .content .example .flex .col .text .pink {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#enrollment-voice .content .voice-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: -50px;
}
@media only screen and (max-width: 750px) {
  #enrollment-voice .content .voice-list {
    display: block;
    margin-top: 0;
  }
}
#enrollment-voice .content .voice-list .col {
  width: 49%;
  margin-top: 50px;
  padding: 20px;
  background-color: #FAFAFA;
  border-radius: 16px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  #enrollment-voice .content .voice-list .col {
    width: 100%;
    margin-top: 0;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-voice .content .voice-list .col + .col {
    margin-top: 10px;
  }
}
#enrollment-voice .content .voice-list .col::after {
  content: "";
  position: absolute;
  bottom: -16px;
  left: 0;
  right: 0;
  z-index: 8;
  width: 40px;
  height: 16px;
  margin-left: auto;
  margin-right: auto;
  background-color: #FAFAFA;
  clip-path: polygon(100% 0, 0 0, 50% 100%);
}
#enrollment-voice .content .voice-list .col .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  #enrollment-voice .content .voice-list .col .ttl {
    margin-bottom: 15px;
  }
}
#enrollment-voice .content .voice-list .col .ttl .cover {
  width: 120px;
  min-width: 120px;
}
@media only screen and (max-width: 900px) {
  #enrollment-voice .content .voice-list .col .ttl .cover {
    width: 80px;
    min-width: 80px;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-voice .content .voice-list .col .ttl .cover {
    width: 60px;
    min-width: 60px;
  }
}
#enrollment-voice .content .voice-list .col .ttl h3 {
  padding-left: 15px;
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #enrollment-voice .content .voice-list .col .ttl h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-voice .content .voice-list .col .ttl h3 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-voice .content .voice-list .col .ttl h3 {
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
#enrollment-voice .content .voice-list .col .text {
  color: #000;
}
#enrollment-voice .content .voice-list .col .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 1180px) {
  #enrollment-voice .content .voice-list .col .text p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-voice .content .voice-list .col .text p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#enrollment-faq .content .faq-row {
  background-color: #fff;
  border-radius: 4px;
  overflow: hidden;
}
#enrollment-faq .content .faq-row + .faq-row {
  margin-top: 20px;
}
@media only screen and (max-width: 900px) {
  #enrollment-faq .content .faq-row + .faq-row {
    margin-top: 10px;
  }
}
#enrollment-faq .content .faq-row .toggle-btn {
  display: block;
  width: 100%;
  padding: 15px 50px 15px 25px;
  background-image: url("/assets/images/commons/toggle-solid-close.svg");
  background-repeat: no-repeat;
  background-position: center right 25px;
  background-size: 12px;
}
@media only screen and (max-width: 750px) {
  #enrollment-faq .content .faq-row .toggle-btn {
    padding: 15px 40px 15px 15px;
    background-position: center right 15px;
  }
}
#enrollment-faq .content .faq-row .toggle-btn.active {
  background-image: url("/assets/images/commons/toggle-solid-open.svg");
}
#enrollment-faq .content .faq-row .toggle-btn h3 {
  position: relative;
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #003165;
  padding-left: 32px;
}
@media only screen and (max-width: 1180px) {
  #enrollment-faq .content .faq-row .toggle-btn h3 {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-faq .content .faq-row .toggle-btn h3 {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-faq .content .faq-row .toggle-btn h3 {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#enrollment-faq .content .faq-row .toggle-btn h3 .q {
  position: absolute;
  top: -2px;
  left: 0;
  z-index: 8;
  width: 22px;
  font-size: 2.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #BA3166;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-faq .content .faq-row .toggle-btn h3 .q {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-faq .content .faq-row .toggle-btn h3 .q {
    font-size: 2.4rem;
    line-height: 2.4rem;
  }
}
#enrollment-faq .content .faq-row .toggle-content {
  position: relative;
  padding: 15px 25px 15px 58px;
  border-top: 1px solid #E7E7E7;
}
@media only screen and (max-width: 750px) {
  #enrollment-faq .content .faq-row .toggle-content {
    padding: 15px 15px 15px 48px;
  }
}
#enrollment-faq .content .faq-row .toggle-content .a {
  position: absolute;
  top: 12px;
  left: 25px;
  z-index: 8;
  width: 22px;
  font-size: 2.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #003165;
  text-align: center;
}
@media only screen and (max-width: 1180px) {
  #enrollment-faq .content .faq-row .toggle-content .a {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 900px) {
  #enrollment-faq .content .faq-row .toggle-content .a {
    font-size: 2.4rem;
    line-height: 2.4rem;
  }
}
@media only screen and (max-width: 750px) {
  #enrollment-faq .content .faq-row .toggle-content .a {
    font-size: 2.2rem;
    line-height: 2.2rem;
    left: 15px;
  }
}
#enrollment-faq .content .faq-row .toggle-content .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  #enrollment-faq .content .faq-row .toggle-content .text p {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#enrollment-form {
  position: relative;
}
@media only screen and (max-width: 750px) {
  #enrollment-form {
    z-index: 10;
  }
}
#enrollment-form::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 7;
  width: 100%;
  height: 380px;
  background-image: url("/assets/images/enrollment/form-bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#enrollment-form .form {
  position: relative;
  z-index: 8;
}
#enrollment-form .form .content {
  padding-left: 20px;
  padding-right: 20px;
  background-color: #fff;
}
@media only screen and (max-width: 750px) {
  #enrollment-form .form .content {
    padding-top: 30px;
    padding-bottom: 20px;
  }
}
#enrollment-form .form .content form {
  width: 100%;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
}

/* JCC Number */
#jccno .content .row + .row {
  margin-top: 2%;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row + .row {
    margin-top: 5%;
  }
}
#jccno .content .row.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row.flex {
    display: block;
  }
}
#jccno .content .row .col {
  width: 100%;
  position: relative;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col + .col {
    margin-top: 2%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col + .col {
    margin-top: 5%;
  }
}
#jccno .content .row .col.w65 {
  width: 64%;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col.w65 {
    width: 100%;
  }
}
#jccno .content .row .col.w50 {
  width: 49%;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col.w50 {
    width: 100%;
  }
}
#jccno .content .row .col.w35 {
  width: 34%;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col.w35 {
    width: 100%;
  }
}
#jccno .content .row .col.bg-white {
  background-color: #fff;
}
#jccno .content .row .col .box {
  position: relative;
  padding-top: 40px;
  padding-bottom: 40px;
  padding-left: 40px;
  padding-right: 40px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box {
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box {
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
#jccno .content .row .col .box + .box {
  margin-top: 6%;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box + .box {
    margin-top: 2%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box + .box {
    margin-top: 5%;
  }
}
#jccno .content .row .col .box.bg-white {
  background-color: #fff;
}
#jccno .content .row .col .box h2 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  text-align: center;
  margin-bottom: 30px;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box h2 {
    font-size: 2rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box h2 {
    margin-bottom: 20px;
  }
}
#jccno .content .row .col .box .text p {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box .text p {
    font-size: 1.3rem;
    line-height: 2.3rem;
  }
}
#jccno .content .row .col .box .text p.center {
  text-align: center;
}
#jccno .content .row .col .box .text p span.small {
  font-size: 1.3rem;
}
#jccno .content .row .col .box.membership .no {
  font-size: 4.8rem;
  line-height: 16rem;
  font-weight: 600;
  color: #000;
  text-align: center;
  white-space: nowrap;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.membership .no {
    font-size: 3.8rem;
    line-height: 12rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.membership .no {
    font-size: 2.6rem;
    line-height: 3.6rem;
  }
}
#jccno .content .row .col .box.membership .no span {
  font-family: "Montserrat", sans-serif;
  font-size: 16rem;
  line-height: 16rem;
  font-weight: 800;
  color: #BA3166;
  padding-right: 10px;
  white-space: nowrap;
  width: 414px;
  display: inline-block;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.membership .no span {
    width: 262px;
    font-size: 10rem;
    line-height: 12rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.membership .no span {
    width: 111px;
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.membership .graph {
  position: relative;
  width: 100%;
  max-width: 414px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.membership .graph {
    width: 75%;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
#jccno .content .row .col .box.membership .graph img {
  margin-left: auto;
  margin-right: auto;
}
#jccno .content .row .col .box.membership .graph img.abs {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
}
#jccno .content .row .col .box.membership .graph img.abs.main {
  z-index: 9;
}
#jccno .content .row .col .box.numberof .no {
  font-size: 3.6rem;
  line-height: 3rem;
  font-weight: 600;
  color: #000;
  text-align: center;
  margin-top: 60px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.numberof .no {
    font-size: 2.6rem;
    line-height: 2rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.numberof .no {
    font-size: 2rem;
    line-height: 3rem;
    margin-top: 50px;
  }
}
#jccno .content .row .col .box.numberof .no span {
  font-family: "Montserrat", sans-serif;
  font-size: 10rem;
  line-height: 10rem;
  font-weight: 800;
  color: #BA3166;
  padding-top: 28px;
  padding-left: 10px;
  padding-right: 10px;
  background-image: url("/assets/images/number/icon-crown.svg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 42px 28px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.numberof .no span {
    font-size: 6rem;
    line-height: 6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.numberof .no span {
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.numberof .remark {
  font-size: 1.5rem;
  line-height: 2.5rem;
  color: #000;
  text-align: center;
}
#jccno .content .row .col .box.established h2 {
  margin-bottom: 0;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.established h2 {
    margin-bottom: 10px;
  }
}
#jccno .content .row .col .box.established .rice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  max-width: 250px;
  height: 120px;
  margin-left: auto;
  margin-right: auto;
  background-image: url("/assets/images/number/rice-left.svg"), url("/assets/images/number/rice-right.svg");
  background-repeat: no-repeat;
  background-position: center left, center right;
  background-size: 43px 120px;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.established .rice {
    max-width: 135px;
    height: 60px;
    background-size: 22px 60px;
  }
}
#jccno .content .row .col .box.established .rice .no {
  font-family: "Montserrat", sans-serif;
  font-size: 10rem;
  line-height: 5rem;
  font-weight: 800;
  color: #BA3166;
  width: 135px;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.established .rice .no {
    width: 80px;
    font-size: 6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.established .rice .no {
    width: 70px;
    font-size: 5rem;
    line-height: 5rem;
  }
}
#jccno .content .row .col .box.established .rice .char {
  font-size: 3.6rem;
  line-height: 3.6rem;
  font-weight: 600;
  color: #BA3166;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: upright;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.established .rice .char {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.established .rice .char {
    font-size: 1.6rem;
    line-height: 1.6rem;
  }
}
#jccno .content .row .col .box.established .year {
  margin-top: -5px;
  font-size: 2.4rem;
  line-height: 2.4rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.established .year {
    margin-top: -30px;
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.established .year {
    margin-top: -10px;
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#jccno .content .row .col .box.established .year span {
  font-family: "Montserrat", sans-serif;
  font-size: 4rem;
  line-height: 4rem;
  font-weight: 800;
  color: #BA3166;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.established .year span {
    font-size: 3rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.established .year span {
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
#jccno .content .row .col .box.events .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.events .flex {
    display: block;
  }
}
#jccno .content .row .col .box.events .flex ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-right: 35px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.events .flex ul {
    padding-right: 0;
  }
}
#jccno .content .row .col .box.events .flex ul li {
  width: 10%;
  padding: 4px;
}
#jccno .content .row .col .box.events .flex .no {
  font-size: 3.6rem;
  line-height: 3.6rem;
  font-weight: 600;
  color: #000;
  white-space: nowrap;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.events .flex .no {
    margin-top: 10px;
    font-size: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.events .flex .no {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#jccno .content .row .col .box.events .flex .no span {
  font-family: "Montserrat", sans-serif;
  font-size: 10rem;
  line-height: 8.5rem;
  font-weight: 800;
  color: #BA3166;
  display: inline-block;
  width: 178px;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.events .flex .no span {
    width: 107px;
    font-size: 6rem;
    line-height: 6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.events .flex .no span {
    width: 72px;
    font-size: 4rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry {
    padding-bottom: 30px;
  }
}
#jccno .content .row .col .box.industry .img {
  padding-top: 10px;
  padding-bottom: 30px;
  position: relative;
}
#jccno .content .row .col .box.industry .img h3 {
  position: absolute;
  top: 30%;
  left: 0;
  right: 0;
  z-index: 9;
  width: 100%;
  font-size: 2.4rem;
  line-height: 2.4rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img h3 {
    font-size: 2rem;
    line-height: 2rem;
    top: 29%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img h3 {
    font-size: 1.2rem;
    line-height: 1.2rem;
  }
}
#jccno .content .row .col .box.industry .img h3 span {
  font-family: "Montserrat", sans-serif;
  font-size: 4rem;
  line-height: 4rem;
  font-weight: 800;
  color: #D3AA27;
  display: inline-block;
  width: 110px;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img h3 span {
    font-size: 3rem;
    line-height: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img h3 span {
    font-size: 1.6rem;
    line-height: 1.6rem;
  }
}
#jccno .content .row .col .box.industry .img p {
  position: absolute;
  z-index: 9;
  font-size: 2.4rem;
  line-height: 2.4rem;
  font-weight: 600;
  color: #000;
  white-space: nowrap;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p {
    font-size: 2rem;
    line-height: 2rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p {
    font-size: 1.2rem;
    line-height: 1.2rem;
  }
}
#jccno .content .row .col .box.industry .img p span {
  font-family: "Montserrat", sans-serif;
  font-size: 5.6rem;
  line-height: 2.4rem;
  font-weight: 800;
  color: #BA3166;
  display: inline-block;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p span {
    font-size: 3rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p span {
    font-size: 1.6rem;
  }
}
#jccno .content .row .col .box.industry .img p.no01 {
  top: 9.9%;
  left: -1.5%;
}
#jccno .content .row .col .box.industry .img p.no01 span {
  width: 130px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no01 span {
    width: 60px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no01 span {
    width: 30px;
  }
}
#jccno .content .row .col .box.industry .img p.no02 {
  top: 9.9%;
  left: 19.1%;
}
#jccno .content .row .col .box.industry .img p.no02 span {
  width: 130px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no02 span {
    width: 70px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no02 span {
    width: 37px;
  }
}
#jccno .content .row .col .box.industry .img p.no03 {
  top: 9.9%;
  left: 42%;
}
#jccno .content .row .col .box.industry .img p.no03 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no03 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no03 span {
    width: 25px;
  }
}
#jccno .content .row .col .box.industry .img p.no04 {
  top: 9.9%;
  left: 64.5%;
}
#jccno .content .row .col .box.industry .img p.no04 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no04 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no04 span {
    width: 25px;
  }
}
#jccno .content .row .col .box.industry .img p.no05 {
  top: 9.9%;
  left: 86%;
}
#jccno .content .row .col .box.industry .img p.no05 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no05 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no05 span {
    width: 25px;
  }
}
#jccno .content .row .col .box.industry .img p.no06 {
  top: 61%;
  left: 4.5%;
}
#jccno .content .row .col .box.industry .img p.no06 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no06 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no06 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no06 {
    top: 59%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no06 {
    top: 51%;
  }
}
#jccno .content .row .col .box.industry .img p.no07 {
  top: 61%;
  left: 20.5%;
}
#jccno .content .row .col .box.industry .img p.no07 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no07 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no07 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no07 {
    top: 59%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no07 {
    top: 51%;
  }
}
#jccno .content .row .col .box.industry .img p.no08 {
  top: 61%;
  left: 35.5%;
}
#jccno .content .row .col .box.industry .img p.no08 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no08 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no08 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no08 {
    top: 59%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no08 {
    top: 51%;
  }
}
#jccno .content .row .col .box.industry .img p.no09 {
  top: 61%;
  left: 53.5%;
}
#jccno .content .row .col .box.industry .img p.no09 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no09 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no09 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no09 {
    top: 59%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no09 {
    top: 51%;
  }
}
#jccno .content .row .col .box.industry .img p.no10 {
  top: 61%;
  left: 73.5%;
}
#jccno .content .row .col .box.industry .img p.no10 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no10 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no10 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no10 {
    top: 59%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no10 {
    top: 51%;
  }
}
#jccno .content .row .col .box.industry .img p.no11 {
  top: 87%;
  left: 15.1%;
}
#jccno .content .row .col .box.industry .img p.no11 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no11 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no11 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no11 {
    top: 82%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no11 {
    top: 75%;
  }
}
#jccno .content .row .col .box.industry .img p.no12 {
  top: 87%;
  left: 37.1%;
}
#jccno .content .row .col .box.industry .img p.no12 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no12 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no12 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no12 {
    top: 82%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no12 {
    top: 75%;
  }
}
#jccno .content .row .col .box.industry .img p.no13 {
  top: 87%;
  left: 54%;
}
#jccno .content .row .col .box.industry .img p.no13 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no13 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no13 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no13 {
    top: 82%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no13 {
    top: 75%;
  }
}
#jccno .content .row .col .box.industry .img p.no14 {
  top: 87%;
  left: 73%;
}
#jccno .content .row .col .box.industry .img p.no14 span {
  width: 91px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no14 span {
    width: 46px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no14 span {
    width: 25px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no14 {
    top: 82%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no14 {
    top: 75%;
  }
}
#jccno .content .row .col .box.industry .img p.no15 {
  top: 87%;
  left: 89%;
}
#jccno .content .row .col .box.industry .img p.no15 span {
  width: 96px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no15 span {
    width: 52px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no15 span {
    width: 28px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.industry .img p.no15 {
    top: 82%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.industry .img p.no15 {
    top: 75%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.interview .img {
    width: 75%;
    margin-left: auto;
    margin-right: auto;
  }
}
#jccno .content .row .col .box.interview .img img {
  margin-left: auto;
  margin-right: auto;
}
#jccno .content .row .col .box.interview .no {
  margin-top: 30px;
  font-size: 3.6rem;
  line-height: 3.6rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.interview .no {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.interview .no {
    margin-top: 15px;
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#jccno .content .row .col .box.interview .no span {
  font-family: "Montserrat", sans-serif;
  font-size: 10rem;
  line-height: 8.5rem;
  font-weight: 800;
  color: #BA3166;
  display: inline-block;
  width: 130px;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.interview .no span {
    width: 78px;
    font-size: 6rem;
    line-height: 6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.interview .no span {
    width: 52px;
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.interview .text {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.interview .text {
    margin-top: 15px;
  }
}
#jccno .content .row .col .box.meeting .capsule {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
  padding: 2px 0;
  background-color: #003165;
  white-space: nowrap;
  border-radius: 20px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.meeting .capsule {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.meeting .capsule {
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
}
#jccno .content .row .col .box.meeting .capsule + .no {
  margin-top: 20px;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.meeting .capsule + .no {
    margin-top: 10px;
  }
}
#jccno .content .row .col .box.meeting .no {
  font-size: 3.6rem;
  line-height: 3.6rem;
  font-weight: 600;
  color: #000;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.meeting .no {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.meeting .no {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#jccno .content .row .col .box.meeting .no span.big {
  font-family: "Montserrat", sans-serif;
  font-size: 8rem;
  line-height: 6rem;
  font-weight: 800;
  color: #BA3166;
  display: inline-block;
  width: 280px;
  text-align: right;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.meeting .no span.big {
    width: 209px;
    font-size: 6rem;
    line-height: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.meeting .no span.big {
    width: 140px;
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.meeting .no span.small {
  font-size: 2.4rem;
  line-height: 2.4rem;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.meeting .no span.small {
    font-size: 1.4rem;
    line-height: 1.4rem;
  }
}
#jccno .content .row .col .box.meeting .no + .capsule {
  margin-top: 40px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.meeting .no + .capsule {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.meeting .no + .capsule {
    margin-top: 20px;
  }
}
#jccno .content .row .col .box.meeting .text {
  margin-top: 40px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.meeting .text {
    margin-top: 20px;
  }
}
#jccno .content .row .col .box.survey {
  padding-bottom: 60px;
}
#jccno .content .row .col .box.survey .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.survey .flex {
    display: block;
  }
}
#jccno .content .row .col .box.survey .flex ul {
  width: 100%;
  max-width: 336px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-right: 35px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.survey .flex ul {
    padding-right: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
  }
}
#jccno .content .row .col .box.survey .flex ul li {
  width: 10%;
  padding: 3px;
}
#jccno .content .row .col .box.survey .flex .no {
  font-size: 3.6rem;
  line-height: 3.6rem;
  font-weight: 600;
  color: #000;
  white-space: nowrap;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.survey .flex .no {
    font-size: 2.6rem;
    margin-top: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.survey .flex .no {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
#jccno .content .row .col .box.survey .flex .no span {
  font-family: "Montserrat", sans-serif;
  font-size: 10rem;
  line-height: 6rem;
  font-weight: 800;
  color: #BA3166;
  display: inline-block;
  width: 170px;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.survey .flex .no span {
    width: 101px;
    font-size: 6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.survey .flex .no span {
    width: 68px;
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.survey .text {
  margin-top: 30px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.survey .text {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.survey .text p {
    text-align: left;
  }
}
#jccno .content .row .col .box.social .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#jccno .content .row .col .box.social .flex .icon {
  width: 70px;
  min-width: 70px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .flex .icon {
    width: 60px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social .flex .icon {
    width: 40px;
    min-width: 40px;
  }
}
#jccno .content .row .col .box.social .flex p {
  font-size: 3.6rem;
  line-height: 3.6rem;
  font-weight: 600;
  color: #000;
  padding-left: 20px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .flex p {
    font-size: 2.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social .flex p {
    font-size: 1.6rem;
    line-height: 2.6rem;
    padding-left: 10px;
  }
}
#jccno .content .row .col .box.social .flex p span {
  font-family: "Montserrat", sans-serif;
  font-size: 10rem;
  line-height: 6rem;
  font-weight: 800;
  color: #BA3166;
  display: inline-block;
  width: 320px;
  text-align: right;
  white-space: nowrap;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .flex p span {
    width: 182px;
    font-size: 6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social .flex p span {
    width: 125px;
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.social .flex p span span {
  width: auto;
  font-size: 8rem;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .flex p span span {
    font-size: 4rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social .flex p span span {
    font-size: 3rem;
  }
}
#jccno .content .row .col .box.social .year {
  margin-top: 35px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .year {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social .year {
    margin-top: 5px;
  }
}
#jccno .content .row .col .box.social .year p {
  font-size: 2.8rem;
  line-height: 3.8rem;
  font-weight: 600;
  color: #BA3166;
  text-align: center;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .year p {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#jccno .content .row .col .box.social .year p span {
  font-size: 3.6rem;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social .year p span {
    font-size: 2.6rem;
  }
}
#jccno .content .row .col .box.social .year p.small {
  font-size: 1.3rem;
  line-height: 2.3rem;
  font-weight: 300;
  color: #656565;
}
#jccno .content .row .col .box.social ul {
  margin-top: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul {
    display: block;
  }
}
#jccno .content .row .col .box.social ul li {
  width: 31.83%;
  padding: 40px 20px 25px 20px;
  border: 1px solid #073165;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li + li {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li {
    width: 100%;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li {
    padding: 20px 20px 25px 20px;
  }
}
#jccno .content .row .col .box.social ul li:nth-child(1) .top .sub .no span {
  display: inline-block;
  width: 206px;
  text-align: right;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li:nth-child(1) .top .sub .no span {
    width: 136px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li:nth-child(1) .top .sub .no span {
    width: 150px;
  }
}
#jccno .content .row .col .box.social ul li:nth-child(2) .top .sub .no span {
  display: inline-block;
  width: 120px;
  text-align: right;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li:nth-child(2) .top .sub .no span {
    width: 86px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li:nth-child(2) .top .sub .no span {
    width: 92px;
  }
}
#jccno .content .row .col .box.social ul li:nth-child(3) .top .sub .no span {
  display: inline-block;
  width: 102px;
  text-align: right;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li:nth-child(3) .top .sub .no span {
    width: 74px;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li:nth-child(3) .top .sub .no span {
    width: 80px;
  }
}
#jccno .content .row .col .box.social ul li .top h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: 600;
  color: #000;
  text-align: center;
  margin-bottom: 25px;
  white-space: nowrap;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li .top h3 {
    font-size: 2rem;
    line-height: 3rem;
    margin-bottom: 20px;
  }
}
#jccno .content .row .col .box.social ul li .top .sub .capsule {
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
  padding: 2px 0;
  background-color: #003165;
  white-space: nowrap;
  border-radius: 20px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li .top .sub .capsule {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li .top .sub .capsule {
    font-size: 1.5rem;
    line-height: 2.5rem;
  }
}
#jccno .content .row .col .box.social ul li .top .sub .no {
  margin-top: 5px;
  font-size: 2.4rem;
  line-height: 5.6rem;
  font-weight: 600;
  color: #000;
  text-align: center;
  white-space: nowrap;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li .top .sub .no {
    margin-top: 10px;
    font-size: 2rem;
    line-height: 3.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li .top .sub .no {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
#jccno .content .row .col .box.social ul li .top .sub .no span {
  font-family: "Montserrat", sans-serif;
  font-size: 5.6rem;
  line-height: 5.6rem;
  font-weight: 800;
  color: #BA3166;
  padding: 0 5px;
}
@media only screen and (max-width: 900px) {
  #jccno .content .row .col .box.social ul li .top .sub .no span {
    font-size: 3.6rem;
    line-height: 3.6rem;
  }
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li .top .sub .no span {
    font-size: 4rem;
    line-height: 4rem;
  }
}
#jccno .content .row .col .box.social ul li .top .text {
  margin-top: 10px;
}
#jccno .content .row .col .box.social ul li .btm {
  margin-top: 30px;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li .btm {
    margin-top: 20px;
  }
}
#jccno .content .row .col .box.social ul li .btm img {
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 750px) {
  #jccno .content .row .col .box.social ul li .btm img {
    width: 50%;
    height: auto;
  }
}
#jccno .content .row .col .date {
  position: absolute;
  bottom: 15px;
  left: 0;
  z-index: 8;
  width: 100%;
  font-size: 1.3rem;
  line-height: 1.3rem;
  text-align: center;
}

/* Footer */
footer {
  position: relative;
  z-index: 12;
  border-top: 4px solid #003165;
}
footer .sitemap {
  padding: 75px 0 15px 0;
  background-color: #F5F5F5;
}
@media only screen and (max-width: 900px) {
  footer .sitemap {
    padding-top: 50px;
  }
}
footer .sitemap .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 750px) {
  footer .sitemap .content {
    display: block;
  }
}
footer .sitemap .content .col {
  padding-right: 20px;
}
@media only screen and (max-width: 900px) {
  footer .sitemap .content .col {
    width: 49%;
    margin-bottom: 25px;
  }
}
@media only screen and (max-width: 750px) {
  footer .sitemap .content .col {
    width: 100%;
    padding-right: 0;
  }
}
footer .sitemap .content .col:last-child {
  padding-right: 0;
}
footer .sitemap .content .col ul.small li + li {
  margin-top: 10px;
}
footer .sitemap .content .col ul.small li a {
  font-size: 1.3rem;
}
footer .sitemap .content .col ul li {
  padding-left: 18px;
  background-image: url("/assets/images/commons/btn-page-next.svg");
  background-repeat: no-repeat;
  background-position: top 6px left;
  background-size: 12px 9px;
}
footer .sitemap .content .col ul li + li {
  margin-top: 25px;
}
footer .sitemap .content .col ul li.lock::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 12px;
  margin-left: 2px;
  background-image: url("/assets/images/commons/icon-lock.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 12px;
}
footer .sitemap .content .col ul li a {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1180px) {
  footer .sitemap .content .col ul li a {
    font-size: 1.4rem;
  }
}
footer .sitemap .content .col ul li a:hover {
  opacity: 1;
  color: #003165;
}
footer .sitemap .content .col ul li ul {
  margin-top: 10px;
}
footer .sitemap .content .col ul li ul li {
  padding-left: 0;
  background-image: none;
}
footer .sitemap .content .col ul li ul li + li {
  margin-top: 5px;
}
footer .sitemap .content .col ul li ul li a {
  font-size: 1.3rem;
  font-weight: 400;
}
@media only screen and (max-width: 1180px) {
  footer .sitemap .content .col ul li ul li a {
    font-size: 1.2rem;
  }
}
footer .sitemap .content .col-text {
  width: 100%;
  margin-top: 45px;
}
@media only screen and (max-width: 900px) {
  footer .sitemap .content .col-text {
    margin-top: 0;
  }
}
footer .sitemap .content .col-text p {
  font-size: 1.1rem;
  line-height: 1.6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
footer .sitemap .content .col-text p span {
  margin-right: 3px;
}
footer .footer {
  background-color: #fff;
  background-image: url("/assets/images/commons/footer-bg-btm.svg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: 634px 66px;
}
@media only screen and (max-width: 750px) {
  footer .footer {
    background-size: 634px 66px;
  }
}
footer .footer .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 40px 0 100px 0;
}
@media only screen and (max-width: 750px) {
  footer .footer .content {
    display: block;
  }
}
footer .footer .content .left {
  width: 390px;
  min-width: 390px;
  padding-right: 30px;
}
@media only screen and (max-width: 750px) {
  footer .footer .content .left {
    width: 100%;
    min-width: 100%;
    padding-right: 0;
  }
}
footer .footer .content .left .logo {
  width: 310px;
}
@media only screen and (max-width: 1180px) {
  footer .footer .content .left .logo {
    width: 300px;
  }
}
@media only screen and (max-width: 900px) {
  footer .footer .content .left .logo {
    width: 200px;
  }
}
@media only screen and (max-width: 750px) {
  footer .footer .content .left .logo {
    width: 90%;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }
}
footer .footer .content .left .text {
  margin-top: 25px;
}
footer .footer .content .left .text p {
  color: #000;
}
@media only screen and (max-width: 750px) {
  footer .footer .content .left .text p:first-child {
    text-align: center;
  }
}
footer .footer .content .left .text p + p {
  margin-top: 7px;
}
footer .footer .content .left .text p.time {
  font-size: 1.1rem;
  margin-bottom: 17px;
}
@media only screen and (max-width: 750px) {
  footer .footer .content .left .text p.time {
    text-align: center;
  }
}
footer .footer .content .left .text p a {
  color: #000;
}
footer .footer .content .left .text p span {
  font-size: 1.8rem;
}
footer .footer .content .right {
  width: 100%;
}
@media only screen and (max-width: 750px) {
  footer .footer .content .right {
    margin-top: 30px;
  }
}
footer .footer .content .right .map {
  position: relative;
  height: 240px;
  overflow: hidden;
}
footer .footer .content .right .map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
footer .copyright {
  padding: 12px 0;
  color: #fff;
  background-color: #003165;
}
footer .copyright p {
  font-size: 1.1rem;
  line-height: 1.6rem;
  text-align: center;
}

.gototop {
  display: none;
  position: fixed;
  bottom: 25px;
  right: 25px;
  z-index: 11;
}
@media only screen and (max-width: 750px) {
  .gototop {
    bottom: 2.5%;
    right: 5%;
  }
}

/* Under */
#under {
  width: 100%;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#under .under .logo {
  display: table;
  margin-left: auto;
  margin-right: auto;
}
#under .under .logo img {
  width: 514px;
  height: auto;
}
@media only screen and (max-width: 750px) {
  #under .under .logo img {
    width: 300px;
  }
}
#under .under h1 {
  font-size: 2rem;
  line-height: 3.2rem;
  font-weight: 600;
  color: #222;
  text-align: center;
  margin: 40px 0;
}
@media only screen and (max-width: 750px) {
  #under .under h1 {
    font-size: 1.6rem;
    line-height: 2.8rem;
    margin: 30px 0;
  }
}
#under .under p {
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #333;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  #under .under p {
    font-size: 1.3rem;
    line-height: 2rem;
  }
}

.show1100 {
  display: none !important;
}
@media only screen and (max-width: 1180px) {
  .show1100 {
    display: block !important;
  }
}

.show850 {
  display: none !important;
}
@media only screen and (max-width: 900px) {
  .show850 {
    display: block !important;
  }
}

.show750 {
  display: none !important;
}
@media only screen and (max-width: 750px) {
  .show750 {
    display: block !important;
  }
}

@media only screen and (max-width: 1180px) {
  .hide1100 {
    display: none !important;
  }
}

@media only screen and (max-width: 900px) {
  .hide850 {
    display: none !important;
  }
}

@media only screen and (max-width: 750px) {
  .hide750 {
    display: none !important;
  }
}
@charset "UTF-8";

/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

.animated {
  -webkit-animation-duration: .3s;
  animation-duration: .3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }

  100% {
    -webkit-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg);
    -ms-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg);
    -ms-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg);
    -ms-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }

  100% {
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }

  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
    -ms-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
    -ms-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
    -ms-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
    -ms-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
    -ms-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }

  100% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    -ms-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
}

@keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    -ms-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    -ms-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    -ms-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    -ms-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    -ms-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    -ms-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;

    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    -ms-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-60px);
    -ms-transform: translateY(-60px);
    transform: translateY(-60px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
	-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1) !important;
	     -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1) !important;
	        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1) !important;
}

@-webkit-keyframes slideInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(120px);
    transform: translateY(120px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(120px);
    -ms-transform: translateY(120px);
    transform: translateY(120px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1) !important;
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1) !important;
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1) !important;
}

@-webkit-keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40% {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
    -webkit-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    -ms-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40% {
    -webkit-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    -ms-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
    -webkit-transform: translateY(700px);
    -ms-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

@keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg);
    -ms-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

@keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg);
    -ms-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}