@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: local('Anton Regular'), local('Anton-Regular'), url("../font/anton-regular.woff2") format('woff2'), url("../font/anton-regular.woff") format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url("../font/roboto-500.woff2") format('woff2'), url("../font/roboto-500.woff") format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: local('Roboto Black'), local('Roboto-Black'), url("../font/roboto-900.woff2") format('woff2'), url("../font/roboto-900.woff") format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'RobotoCondensed';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'), url("../font/roboto-condensed-700.woff2") format('woff2'), url("../font/roboto-condensed-700.woff") format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: local('Lato Black'), local('Lato-Black'), url("../font/lato-900.woff2") format('woff2'), url("../font/lato-900.woff") format('woff');
  font-display: swap;
}

html {
  font-family: sans-serif;
  text-rendering: optimizeLegibility;
  outline: none;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-text-rendering: optimizeLegibility;
  -webkit-appearance: none;
  -moz-osx-font-smoothing: grayscale;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
dl,
p {
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Yu Gothic Medium', '游ゴシック Medium', YuGothic, '游ゴシック体', 'ヒラギノ角ゴ Pro W3', 'メイリオ', sans-serif;
  position: relative;
}

p {
  font-size: 1.4rem;
}

ul {
  list-style-type: none;
}

dd {
  margin: 0;
  padding: 0;
}

img {
  margin: 0;
  padding: 0;
  vertical-align: bottom;
  border: 0;
}

a {
  margin: 0;
  padding: 0;
  color: #0072cf;
  text-decoration: none;
  outline: none;
  -webkit-outline: none;
  -webkit-tap-highlight-color: transparent;
}

a:active,
a:hover {
  outline: 0;
}

button {
  margin: 0;
  padding: 0;
  appearance: none;
  background: none;
  border: none;
  outline: none;
}

.error {
  background-color: #f5f5f5;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  width: 100%;
  padding: 10%;
  animation: fadein 3s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
  will-change: animation, opacity;
}

.preload {
  transition: none !important;
}

html {
  font-size: 62.5%;
}

#content {
  margin-top: 205px;
}

.wrapper {
  margin: 0 20px;
}

.js-zoom {
  font-size: 75%;
}

.js-fadeout {
  transform-origin: top;
  animation: fadeslideout 0.3s ease forwards;
  will-change: animation, opacity, transform;
}

.js-fadein {
  transform-origin: top;
  animation: fadeslidein 0.5s ease forwards;
  will-change: animation, opacity, transform;
}

header {
  box-sizing: border-box;
  top: 0;
  position: fixed;
  width: 100%;
  z-index: 100;
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  animation: fadein 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
  will-change: animation, opacity, transform, height;
}

header.js-sticky .header-top,
header.js-sticky .header-logo {
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height;
}

header.js-sticky .header-top {
  height: 90px;
}

header.js-sticky .sns-ul,
header.js-sticky .sns-li,
header.js-sticky .sns-link,
header.js-sticky .sns-tw-img {
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, width;
}

header.js-sticky .header-acc {
  opacity: 0;
  visibility: hidden;
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 0.01s cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s;
  will-change: animation, opacity, transform, height, width;
}

header.js-sticky .acc-btn {
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1), height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: animation, opacity, transform, height, width, background-color;
}

header.js-sticky .acc-btn:hover {
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

header.js-sticky nav {
  transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), border-top 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, border-top, width, background-color;
}

.header-top {
  background-color: #fff;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height;
}

.header-logo {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  width: auto;
  margin-left: 15px;
  position: relative;
}

.header-logo-link {
  display: block;
  height: 44px;
  width: 138px;
}

.header-portal-link {
  display: block;
  margin-left: 15px;
}

.header-logo-img {
  height: 44px;
  width: 138px;
}

.header-portal-img,
.footer-portal-img {
  height: 40px;
  width: 95px;
}

.header-portal-img.pc,
.footer-portal-img.pc {
  display: none;
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, width;
}

.trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #2c4773;
  height: 90px;
  width: 90px;
  position: relative;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
  z-index: 101;
}

.trigger-icon {
  height: 23px;
  width: 35px;
  margin-bottom: 13px;
  position: relative;
  overflow: visible;
  animation: menu-close 0.6s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: animation, opacity, transform;
}

.trigger-name {
  color: #fff;
  bottom: -17px;
  font-family: 'Roboto', sans-serif;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.1rem;
  left: 50%;
  letter-spacing: 2px;
  width: 100%;
  position: absolute;
  transform: translateX(-50%);
}

.trigger-line {
  background-color: #fff;
  height: 3px;
  width: 35px;
  left: 0;
  position: absolute;
  transition: transform 0.5s, opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform;
}

.trigger-line:nth-child(1) {
  top: 0;
}

.trigger-line:nth-child(2) {
  top: 10px;
  opacity: 1;
}

.trigger-line:nth-child(3) {
  top: 20px;
}

.js-open {
  background-color: #fff;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.js-open .trigger-line {
  background-color: #23385b;
  transition: transform 0.5s, opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform;
}

.js-open .trigger-line:nth-of-type(1) {
  top: 10px;
  transform: rotate(45deg);
}

.js-open .trigger-line:nth-of-type(2) {
  opacity: 0;
}

.js-open .trigger-line:nth-of-type(3) {
  top: 10px;
  transform: rotate(-45deg);
}

.js-open .trigger-name {
  color: #23385b;
  letter-spacing: 1px;
}

.header-acc {
  background-color: #ecf3f9;
  border-bottom: 15px solid #23385b;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 115px;
  width: 100%;
  padding: 15px 20px;
  position: relative;
  transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.01s, visibility 0.01s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: animation, opacity, transform, height, width;
}

.acc-btn {
  background-color: #0072cf;
  background-repeat: no-repeat;
  border-radius: 5px;
  box-sizing: border-box;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.4rem;
  letter-spacing: 2px;
  height: 70px;
  width: 70px;
  padding-top: 35px;
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1), height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: animation, opacity, transform, height, width, background-color;
}

.acc-btn:hover {
  background-color: #00569c;
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}
.acc-btn.english {
    padding-top: 0px;
    letter-spacing: 1px;
  }
.acc-btn.skip {
  background-image: url("../img/common/icon-content.png");
  background-size: 22px 26px;
  background-position: center 10px;
}

.acc-btn.voice {
  background-image: url("../img/common/icon-voice.png");
  background-size: 27px 18px;
  background-position: center 15px;
}

.acc-btn.zoom {
  background-image: url("../img/common/icon-zoom.png");
  background-size: 33px 22px;
  background-position: center 13px;
}

.acc-btn.search {
  background-image: url("../img/common/icon-search.png");
  background-size: 25px 25px;
  background-position: center 10px;
}

.acc-btn.voice.playing {
  animation: playing 1s ease-in infinite;
}

.sp-none {
  display: none;
}

nav {
  background-color: #fff;
  height: 100vh;
  width: 100%;
  top: 0;
  left: 0;
  position: fixed;
  opacity: 0;
  visibility: hidden;
  z-index: 100;
  transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, background-color;
}

nav.js-show {
  opacity: 1;
  animation: modal-show 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  visibility: visible;
  will-change: animation, opacity, transform;
}

nav.js-hide {
  opacity: 0;
  animation: modal-close 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
  visibility: hidden;
  will-change: animation, opacity, transform;
}

.gnav-ul {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: calc(100% - 140px);
  /* height: calc(100% - 80px); */
  width: auto;
  margin: 0 auto;
  padding-top: 45px;
}
.gnav-p{
  color: #FF0000;
  font-weight: bold;
  width: 230px;
  padding: 0 15px;
}
.header-info{
margin-left: -200px;
    margin-top: 64px;
    color: red;
    font-size: 0.4em;
    line-height: 1em;
}

@media screen and (max-width: 895px){
  .gnav-p{
    width: 100vw;
    height: 60px;
    margin: auto;
    text-align: center;
    font-size: 1.25rem;
    padding: 0;
  }
}
.gnav-list {
  display: flex;
  min-height: 60px;
  min-width: 210px;
  margin: 1% 0;
}

.gnav-link {
  color: #000;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.8rem;
  display: flex;
  align-items: center;
  min-height: inherit;
  padding-left: 45px;
  position: relative;
}

.gnav-link::before,
.gnav-link::after {
  content: '';
  display: block;
  height: 38px;
  width: 38px;
  top: 50%;
  left: 0;
  position: absolute;
  transform: translateY(-50%);
  transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: opacity;
}

.gnav-link::before {
  opacity: 1;
  visibility: visible;
}

.gnav-link::after {
  opacity: 0;
  visibility: hidden;
}

.gnav-link.menu00::before {
  background: url("../img/common/icon-menu00.png") left center/38px 38px no-repeat;
}

.gnav-link.menu01::before {
  background: url("../img/common/icon-menu01.png") left center/38px 38px no-repeat;
}

.gnav-link.menu02::before {
  background: url("../img/common/icon-menu02.png") left center/38px 38px no-repeat;
}

.gnav-link.menu03::before {
  background: url("../img/common/icon-menu03.png") left center/38px 38px no-repeat;
}

.gnav-link.menu04::before {
  background: url("../img/common/icon-menu04.png") left center/38px 38px no-repeat;
}

.gnav-link.menu05::before {
  background: url("../img/common/icon-menu05.png") left center/38px 38px no-repeat;
}

.sns-ul {
  background-color: #ecf3f9;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
}

.sns-li {
  margin: 0 10px;
}

.sns-li.tw {
  background-color: #00c0ff;
}

.sns-li.fb {
  background-color: #0064d4;
}

.sns-link {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  width: 50px;
}

.sns-tw-img {
  height: 12px;
  width: 15px;
}

.sns-fb-img {
  height: 16px;
  width: 8px;
}

.banner {
  background-color: #23385b;
  margin-top: 50px;
  padding: 30px 20px 50px;
  position: relative;
  z-index: 1;
}

.banner::before,
.banner::after {
  content: '';
  height: 99px;
  width: 42px;
  position: absolute;
  z-index: 2;
}

.banner::before {
  background: url("../img/common/bg-corner-l.png") top left/42px 99px no-repeat;
  top: 0;
  left: 0;
}

.banner::after {
  background: url("../img/common/bg-corner-r.png") bottom right/42px 99px no-repeat;
  bottom: 0;
  right: 0;
}

.banner-ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.banner-list {
  width: 70%;
  margin: 20px auto 0;
}

.banner-link {
  display: block;
}

.banner-img {
  width: 100%;
}

.footer-logo {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  height: 90px;
  width: calc(138px + 70px + 15px + 15px * 2);
  margin: 20px auto 0;
  padding: 0 15px;
  position: relative;
}

.footer-logo-img {
  height: 44px;
  width: 138px;
}

.footer-portal-img {
  margin-left: 15px;
}

address {
  box-sizing: border-box;
  background-color: #f5f5f5;
  margin: 20px 20px 0;
  padding: 20px;
}

.address-title,
.address-detail {
  font-size: 1.2rem;
  font-style: normal;
  font-weight: bold;
  line-height: 2.6rem;
}

.footer-nav {
  margin: 40px 20px 0;
}

.footer-nav-list {
  display: inline-block;
  box-sizing: border-box;
  font-weight: bold;
  margin-right: 20px;
}

.footer-nav-link {
  background: url("../img/common/icon-link-s.png") left center/8px 13px no-repeat;
  color: #000;
  display: block;
  font-size: 1.1rem;
  font-weight: bold;
  line-height: 2rem;
  padding-left: 13px;
}

.footer-copyright {
  background-color: #0066ba;
  padding: 20px;
  margin-top: 20px;
}

.copyright {
  color: #fff;
  font: 500 1.2rem 'Roboto', sans-serif;
  text-align: center;
}

.btn-prev {
  cursor: pointer;
  background: #c1a676 url("../img/common/icon-prev.png") center 23px/19px 30px no-repeat;
  color: #fff;
  font-size: 1rem;
  font-weight: bold;
  height: 90px;
  width: 90px;
  padding-top: 50px;
  position: fixed;
  bottom: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  transform: translateX(100%);
  transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1), transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  z-index: 99;
}

.btn-prev.js-show {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.btn-prev.js-fixed {
  position: absolute;
}

.sp-show {
  display: block;
}

.plus-txt{
display: none;
}

@media only screen and (min-width: 667px) and (orientation: landscape) {
  #content {
    margin-top: 90px;
  }

  header.js-sticky .header-acc {
    opacity: 1;
    visibility: visible;
  }

  .header-top {
    height: 90px;
  }

  .header-logo {
    height: 100%;
  }

  .gnav-ul {
    flex-direction: row;
    flex-wrap: wrap;
    height: calc(100% - 140px);
    /* height: calc(100% - 80px); */
    padding: 90px 40px 45px;
  }

  .gnav-list {
    box-sizing: border-box;
    width: 33.33%;
    min-width: auto;
    margin: 0;
    padding: 0 5px;
  }

  .gnav-link {
    font-size: 1.4rem;
  }

  .trigger {
    order: 3;
  }

  .header-acc {
    border-bottom: none;
    order: 2;
    height: 100%;
    /* width: calc(64px * 4 + 8px * 2 * 4); */
        /* width: calc(64px * 5 + 8px * 2 * 4); */
        width: calc(50px * 5 + 8px * 2 * 4);
    margin-left: auto;
    padding: 13px;
  }

  .acc-btn {
    /* font-size: 1.2rem;
    line-height: 1.2rem; */
    font-size: 1.0rem;
    line-height: 1.0rem;
    letter-spacing: 2px;
    /* height: 64px;
    width: 64px; */
    height: 50px;
    width: 50px;
    padding-top: 35px;
  }

  .banner-list {
    width: 45%;
  }

  .sp-show {
    display: none;
  }
}

@media tablet {
  .sp-none {
    display: none;
  }
}

@media only screen and (min-width: 667px) and (orientation: portrait) {
  .acc-btn {
    width: calc(100% / 5 - 10px);
    padding-top: 0;
    padding-left: 30px;
  }
  .acc-btn.english {
    padding-left: 0px;
  }

  .acc-btn.skip {
    background-position: 15px center;
  }

  .acc-btn.voice {
    background-position: 15px center;
  }

  .acc-btn.zoom {
    background-position: 15px center;
  }

  .acc-btn.search {
    background-position: 15px center;
  }

  .sp-none {
    display: inline;
  }

  .banner-list {
    width: 45%;
  }

  .address-title,
  .address-detail {
    text-align: center;
  }

  .footer-nav {
    margin: 40px auto 0;
    text-align: center;
  }

  .footer-nav-list {
    width: auto;
  }

  .footer-nav-link {
    display: inline-block;
    font-size: 1.2rem;
  }

  .sp-show {
    display: none;
  }
}

@media only screen and (min-width: 896px) and (orientation: landscape) {
  #content {
    margin-top: 185px;
  }

  .wrapper {
    margin: 0 40px;
  }

  header.js-sticky .header-acc {
    opacity: 1;
    visibility: visible;
  }

  .header-logo {
    margin-left: 20px;
  }

  .header-portal-img,
  .footer-portal-img {
    height: 50px;
    width: 120px;
  }

  .trigger {
    display: none;
  }

  .header-acc {
    background-color: transparent;
    width: auto;
    padding: 0 20px;
    order: 0;
  }

  .acc-btn {
    font-size: 1.4rem;
    height: 48px;
    width: 100px;
    padding-top: 0;
    padding-left: 35px;
  }
  .acc-btn.english {
    padding-left: 0px;
  }

  .acc-btn.skip {
    background-position: 15px center;
  }

  .acc-btn.voice {
    background-position: 15px center;
  }

  .acc-btn.zoom {
    background-position: 15px center;
  }

  .acc-btn.search {
    background-position: 15px center;
  }

  .acc-btn:not(:first-child) {
    margin-left: 15px;
  }

  .sp-none {
    display: none;
  }

  nav {
    border-top: 15px solid #23385b;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 95px;
    width: 100%;
    position: relative;
    opacity: 1;
    visibility: visible;
  }

  .gnav-ul {
    flex-wrap: nowrap;
    justify-content: flex-start;
    height: 100%;
    width: calc(100% - 420px);
    /* width: calc(100% - 160px); */
    margin: 0;
    padding: 0 0 0 20px;
  }

  .gnav-list {
    min-width: auto;
    height: 100%;
    width: auto;
    padding: 0;
  }

  .gnav-link {
    color: #000;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: 35px;
    padding-right: 10px;
  }

  .gnav-link.menu01::before {
    background: url("../img/common/icon-menu01.png") left center/30px 30px no-repeat;
  }

  .gnav-link.menu02::before {
    background: url("../img/common/icon-menu02.png") left center/30px 30px no-repeat;
  }

  .gnav-link.menu03::before {
    background: url("../img/common/icon-menu03.png") left center/30px 30px no-repeat;
  }

  .gnav-link.menu04::before {
    background: url("../img/common/icon-menu04.png") left center/30px 30px no-repeat;
  }

  .gnav-link.menu05::before {
    background: url("../img/common/icon-menu05.png") left center/30px 30px no-repeat;
  }

  .pc-none {
    display: none;
  }

  .sns-ul {
    display: flex;
    height: 100%;
    width: 160px;
    transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    will-change: height, width;
  }

  .sns-li {
    margin: 0;
    width: 50%;
    height: 100%;
    transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    will-change: height, width;
  }

  .sns-link {
    height: 100%;
    width: 100%;
    transition: height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    will-change: height, width;
  }

  .sns-tw-img {
    height: 24px;
    width: 32px;
  }

  .sns-fb-img {
    height: 32px;
    width: 16px;
  }

  .js-sticky .header-top {
    height: 70px;
    flex-wrap: nowrap;
  }

  .js-sticky nav {
    background-color: #2c4773;
    height: 70px;
  }

  .js-sticky .gnav-ul {
    width: calc(100% - 380px);
    /* width: calc(100% - 120px); */
  }
  .js-sticky .gnav-p {
    color: #ffffff;
  }

  .js-sticky .gnav-link {
    color: #fff;
    font-size: 1.4rem;
  }

  .js-sticky .gnav-link::before,
  .js-sticky .gnav-link::after {
    transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    will-change: opacity;
  }

  .js-sticky .gnav-link::before {
    opacity: 0;
    visibility: hidden;
  }

  .js-sticky .gnav-link::after {
    opacity: 1;
    visibility: visible;
  }

  .js-sticky .gnav-link.menu01::after,
  .js-sticky .gnav-link.menu02::after,
  .js-sticky .gnav-link.menu03::after,
  .js-sticky .gnav-link.menu04::after,
  .js-sticky .gnav-link.menu05::after {
    background: url("../img/common/icon-menu06.png") left center/30px 30px no-repeat;
  }

  .js-sticky .sns-ul {
    width: 120px;
  }

  .banner {
    margin-top: 80px;
    padding-left: calc(40px - 1%);
    padding-right: calc(40px - 1%);
  }

  /* .banner-ul {
    max-width: calc(1200px + 2%);
  } */
  .banner-ul {
    max-width: calc(990px + 2%);
  }

  /* .banner-list {
    width: 23%;
    margin: 20px 1% 0;
  } */
  .banner-list {
    width: 29%;
    margin: 20px 2% 0;
  }

  footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .footer-logo {
    margin: 20px 20px 0;
    padding: 0;
    width: calc(138px + 222px + 15px);
  }

  .footer-info,
  .footer-nav {
    width: calc(50% - 20px * 2);
  }

  .address-title,
  .address-detail {
    text-align: left;
  }

  .address-tell {
    color: #0072cf;
  }

  .footer-copyright {
    width: 100%;
  }

  .footer-nav-ul {
    justify-content: flex-end;
  }

  .footer-nav-list {
    margin-bottom: 10px;
  }
}

@media only screen and (min-width: 1024px) {
  address {
    max-width: 400px;
  }

  .footer-nav {
    max-width: 500px;
    margin: 40px 20px 0 auto;
  }

  .sp {
    display: none;
  }
}

@media only screen and (min-width: 1366px) {
  #content {
    margin-top: 185px;
  }

  .wrapper {
    max-width: 1200px;
    margin: 0 auto;
  }

  .header-top {
    height: 90px;
  }

  .header-logo {
    margin-left: 30px;
  }

  .header-acc {
    padding: 0 30px;
  }

  .acc-btn {
    font-size: 1.6rem;
    height: 50px;
    width: 160px;
  }

  .gnav-ul {
    padding-left: 30px;
  }

  .gnav-link {
    font-size: 1.6rem;
    letter-spacing: 0.2rem;
  }

  .sp-none {
    display: inline;
  }

  .footer-logo {
    margin: 20px 30px 0;
  }

  address {
    margin: 20px 30px 0;
  }

  .footer-nav {
    margin: 40px 30px 0 auto;
  }
}

@-moz-keyframes slidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
    visibility: visible;
  }
}

@-webkit-keyframes slidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
    visibility: visible;
  }
}

@-o-keyframes slidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
    visibility: visible;
  }
}

@keyframes slidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
    visibility: visible;
  }
}

@-moz-keyframes slideout {
  0% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
  }

  90% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    visibility: hidden;
  }
}

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

  90% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    visibility: hidden;
  }
}

@-o-keyframes slideout {
  0% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
  }

  90% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    visibility: hidden;
  }
}

@keyframes slideout {
  0% {
    opacity: 1;
    transform: translateY(0);
    transform: scale(1);
  }

  90% {
    opacity: 0;
    transform: translateY(10px);
    transform: scale(1.05);
  }

  100% {
    visibility: hidden;
  }
}

@-moz-keyframes fadeslidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }

  90% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    visibility: visible;
  }
}

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

  90% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    visibility: visible;
  }
}

@-o-keyframes fadeslidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }

  90% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    visibility: visible;
  }
}

@keyframes fadeslidein {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }

  90% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    visibility: visible;
  }
}

@-moz-keyframes fadeslideout {
  0% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    transform: translateY(-10px);
    visibility: hidden;
  }
}

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

  100% {
    opacity: 0;
    transform: translateY(-10px);
    visibility: hidden;
  }
}

@-o-keyframes fadeslideout {
  0% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    transform: translateY(-10px);
    visibility: hidden;
  }
}

@keyframes fadeslideout {
  0% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    transform: translateY(-10px);
    visibility: hidden;
  }
}

@-moz-keyframes fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
    visibility: visible;
  }
}

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

  100% {
    opacity: 1;
    visibility: visible;
  }
}

@-o-keyframes fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
    visibility: visible;
  }
}

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

  100% {
    opacity: 1;
    visibility: visible;
  }
}

@-moz-keyframes fadeout {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    visibility: hidden;
  }
}

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

  100% {
    opacity: 0;
    visibility: hidden;
  }
}

@-o-keyframes fadeout {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    visibility: hidden;
  }
}

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

  100% {
    opacity: 0;
    visibility: hidden;
  }
}

@-moz-keyframes playing {
  0% {
    background-color: #0072cf;
  }

  50% {
    background-color: #00569c;
  }

  100% {
    background-color: #0072cf;
  }
}

@-webkit-keyframes playing {
  0% {
    background-color: #0072cf;
  }

  50% {
    background-color: #00569c;
  }

  100% {
    background-color: #0072cf;
  }
}

@-o-keyframes playing {
  0% {
    background-color: #0072cf;
  }

  50% {
    background-color: #00569c;
  }

  100% {
    background-color: #0072cf;
  }
}

@keyframes playing {
  0% {
    background-color: #0072cf;
  }

  50% {
    background-color: #00569c;
  }

  100% {
    background-color: #0072cf;
  }
}

@-moz-keyframes modal-show {
  0% {
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }
}

@-webkit-keyframes modal-show {
  0% {
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }
}

@-o-keyframes modal-show {
  0% {
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }
}

@keyframes modal-show {
  0% {
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }
}

@-moz-keyframes modal-close {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  100% {
    opacity: 0;
    transform: scale(1.1);
    visibility: hidden;
  }
}

@-webkit-keyframes modal-close {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  100% {
    opacity: 0;
    transform: scale(1.1);
    visibility: hidden;
  }
}

@-o-keyframes modal-close {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  100% {
    opacity: 0;
    transform: scale(1.1);
    visibility: hidden;
  }
}

@keyframes modal-close {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  100% {
    opacity: 0;
    transform: scale(1.1);
    visibility: hidden;
  }
}

.breadcrumb {
  box-sizing: border-box;
  background-color: #ecf3f9;
  padding: 10px 20px;
  vertical-align: middle;
  visibility: hidden;
  animation: fadein 5s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
  will-change: animation, opacity;
}

.breadcrumb-list {
  display: inline-block;
  margin: 5px 0;
}

.breadcrumb-list:not(:last-child) {
  margin-right: 15px;
}

.breadcrumb-list:not(:first-child) .breadcrumb-link {
  background: url("../img/common/icon-link-ss.png") left top/8px 12px no-repeat;
  padding-left: 12px;
}

.breadcrumb-link {
  color: #000;
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.2rem;
  letter-spacing: 0.1rem;
}

.photo-img {
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.title-01 {
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 3.4rem;
  letter-spacing: 0.2rem;
  position: relative;
  z-index: 2;
}

.title-02 {
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 3.2rem;
  letter-spacing: 0.2rem;
}

.title-03 {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 3rem;
  letter-spacing: 0.2rem;
}

.paragraph {
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 2.4rem;
  letter-spacing: 0.1rem;
  margin-top: 30px;
  text-align: justify;
}

.list-circle,
.list-num {
  margin-top: 30px;
}

.list-circle-item {
  background: url("../img/common/icon-list-circle.png") left 7px/10px 10px no-repeat;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 2.4rem;
  padding-left: 15px;
}

.list-circle-item:not(:first-child) {
  margin-top: 20px;
}

.list-num {
  counter-reset: li;
  list-style: none;
}

.list-num-item {
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 2.4rem;
  padding-left: 15px;
  position: relative;
  text-indent: -15px;
}

.list-num-item:not(:first-child) {
  margin-top: 20px;
}

.list-num-item::before {
  color: #0066ba;
  counter-increment: li;
  content: counter(li) '.';
  padding-right: 3px;
}

.text-box::before {
  border: 100px solid #16243b;
  border-radius: 50%;
  box-sizing: border-box;
  content: '';
  height: 400px;
  width: 400px;
  position: absolute;
}

.divider {
  border-top: 15px solid #16243b;
  margin-top: 50px;
}

.module-01 {
  margin-top: 50px;
}

.module-01-photo {
  height: 250px;
  position: relative;
  overflow: hidden;
}

.module-02 {
  margin-top: 50px;
}

.module-02-block {
  background-color: #2c4773;
  display: block;
  padding-bottom: 100px;
  position: relative;
  overflow: hidden;
  transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-02-block:not(:first-child) {
  margin-top: 50px;
}

.module-02-block::before {
  top: -40%;
  left: -40%;
}

.module-02-block::after {
  background: url("../img/common/icon-link-01.png") right center/65px 65px no-repeat;
  content: '';
  height: 65px;
  width: 65px;
  bottom: 20px;
  right: 30px;
  position: absolute;
  z-index: 2;
}

a.module-02-block:hover {
  background-color: #16243b;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

a.module-02-block:hover .photo-img {
  transform-origin: center center;
  transform: scale(1.1);
  transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform;
}

.module-02-photo {
  height: 190px;
  overflow: hidden;
  position: relative;
}

.module-02-text {
  color: #fff;
  padding: 0 30px;
  position: relative;
  z-index: 2;
}

.module-02-text .title-03 {
  margin-top: 30px;
}

.module-03 {
  background-color: #f5f5f5;
  margin-top: 20px;
  padding: 20px;
}

.module-03-block {
  display: block;
  padding-bottom: 100px;
  position: relative;
  overflow: hidden;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-03-block:not(:first-child) {
  margin-top: 20px;
}

.module-03-block::before,
.module-03-block::after {
  content: '';
  height: 65px;
  width: 65px;
  bottom: 20px;
  right: 30px;
  position: absolute;
  z-index: 2;
  transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: opacity;
}

.module-03-block.solid {
  background-color: #2c4773;
  color: #fff;
}

.module-03-block.solid::after {
  background: url("../img/common/icon-link-01.png") right center/65px 65px no-repeat;
}

.module-03-block.solid:hover {
  background-color: #16243b;
}

.module-03-block.line {
  background-color: #fff;
  border-top: 40px solid #16243b;
  color: #000;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1), color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color, color;
}

.module-03-block.line::before {
  background: url("../img/common/icon-link-02.png") right center/65px 65px no-repeat;
  opacity: 1;
}

.module-03-block.line::after {
  background: url("../img/common/icon-link-01.png") right center/65px 65px no-repeat;
  opacity: 0;
}

.module-03-block.line:hover {
  background-color: #23385b;
  color: #fff;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1), color 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color, color, opacity;
}

.module-03-block.line:hover::before {
  opacity: 0;
}

.module-03-block.line:hover::after {
  opacity: 1;
}

.module-03-block:hover {
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-03-text {
  padding: 0 20px;
  position: relative;
  z-index: 2;
}

.module-03-text .title-03 {
  margin-top: 30px;
}

.module-04 {
  margin-top: 50px;
}

.module-04-block {
  display: block;
  position: relative;
}

.module-04-block:not(:first-child) {
  margin-top: 50px;
}

.module-04-block:nth-of-type(odd) .module-04-text::after {
  right: 0;
}

.module-04-block:nth-of-type(even) .module-04-text::after {
  left: 0;
}

.module-04-photo {
  height: 190px;
  overflow: hidden;
  position: relative;
}

.module-04-text {
  background-color: #f5f5f5;
  color: #000;
  padding: 0 30px 30px;
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.module-04-text::after {
  background-color: #16243b;
  content: '';
  height: 15px;
  width: 100px;
  top: 0;
  position: absolute;
  z-index: 2;
}

.module-04-text .title-02 {
  margin-top: 40px;
}

.module-05 {
  background-color: #f5f5f5;
  margin-top: 50px;
  padding: 20px;
}

.module-05-block {
  background-color: #2c4773;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.8rem;
  display: block;
  padding: 30px 20px 100px;
  position: relative;
  overflow: hidden;
  text-align: center;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-05-block:not(:first-child) {
  margin-top: 20px;
}

.module-05-block::after {
  background: url("../img/common/icon-link-03.png") center bottom/65px 65px no-repeat;
  content: '';
  height: 65px;
  width: 65px;
  bottom: 20px;
  left: 50%;
  position: absolute;
  z-index: 2;
  transform: translateX(-50%);
}

.module-05-block:hover {
  background-color: #16243b;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-06 {
  margin-top: 50px;
}

.module-06-block {
  display: flex;
}

.module-06-block:not(:first-child) {
  margin-top: 50px;
}

.module-06-wrapper {
  background-color: #2c4773;
  box-sizing: border-box;
  flex-wrap: wrap;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 2.3rem;
  width: 100%;
  min-height: 80px;
  padding: 20px 100px 20px 30px;
  position: relative;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-06-wrapper::after {
  background: url("../img/common/icon-link-01.png") right center/55px 55px no-repeat;
  content: '';
  height: 55px;
  width: 55px;
  top: 50%;
  right: 30px;
  position: absolute;
  transform: translateY(-50%);
}

.module-06-wrapper:hover {
  background-color: #16243b;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-title-01 {
  color: #fff;
  margin-top: 60px;
  position: relative;
  overflow: hidden;
}

.module-title-01::before,
.module-title-01::after {
  content: '';
  height: 100%;
  width: 100%;
  position: absolute;
}

.module-title-01::before {
  height: 99px;
  width: 42px;
  top: 0;
  left: 0;
  z-index: 2;
}

.module-title-01::after {
  height: 100px;
  width: 300%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(60deg);
  z-index: 1;
}

.module-title-01.blue {
  background-color: #00569c;
}

.module-title-01.blue::before {
  background: url("../img/common/title-corner-l-01.png") top left/42px 99px no-repeat;
}

.module-title-01.blue::after {
  background-color: #0072cf;
}

.module-title-01.red {
  background-color: #c70e0e;
}

.module-title-01.red::before {
  background: url("../img/common/title-corner-l-02.png") top left/42px 99px no-repeat;
}

.module-title-01.red::after {
  background-color: #e01010;
}

.module-title-01.green {
  background-color: #00914a;
}

.module-title-01.green::before {
  background: url("../img/common/title-corner-l-03.png") top left/42px 99px no-repeat;
}

.module-title-01.green::after {
  background-color: #00b259;
}

.module-title-01.yellow {
  background-color: #f0a300;
}

.module-title-01.yellow::before {
  background: url("../img/common/title-corner-l-04.png") top left/42px 99px no-repeat;
}

.module-title-01.yellow::after {
  background-color: #f9b200;
}

.module-title-01.navy {
  background-color: #16243b;
}

.module-title-01.navy::before {
  background: url("../img/common/title-corner-l-05.png") top left/42px 99px no-repeat;
}

.module-title-01.navy::after {
  background-color: #23385b;
}

.module-title-01 .title-01 {
  background: url("../img/common/title-corner-r.png") bottom right/42px 99px no-repeat;
  padding: 30px;
  position: relative;
  z-index: 3;
}

.module-title-02 {
  background-color: #f5f5f5;
  margin-top: 40px;
  padding: 0 30px 30px;
}

.module-title-02.blue {
  border-top: 15px solid #00569c;
}

.module-title-02.red {
  border-top: 15px solid #c70e0e;
}

.module-title-02.green {
  border-top: 15px solid #00914a;
}

.module-title-02.yellow {
  border-top: 15px solid #f0a300;
}

.module-title-02.navy {
  border-top: 15px solid #16243b;
}

.module-title-02 .title-02 {
  margin-top: 30px;
}

.module-title-03 {
  margin-top: 20px;
}

.module-title-03.blue {
  border-left: 15px solid #00569c;
}

.module-title-03.red {
  border-left: 15px solid #c70e0e;
}

.module-title-03.green {
  border-left: 15px solid #00914a;
}

.module-title-03.yellow {
  border-left: 15px solid #f0a300;
}

.module-title-03.navy {
  border-left: 15px solid #16243b;
}

.module-title-03 .title-03 {
  padding-left: 15px;
}

.module-08 {
  margin-top: 50px;
}

.module-08-block {
  display: block;
  position: relative;
  overflow: hidden;
}

.module-08-block::before {
  top: -40%;
  left: -40%;
}

.module-08-block:not(:first-child) {
  margin-top: 30px;
}

.module-08-photo {
  height: 190px;
  overflow: hidden;
  position: relative;
}

.module-08-text {
  background-color: #23385b;
  color: #fff;
  padding: 0 30px 30px;
  position: relative;
  overflow: hidden;
  z-index: 2;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.cheer .module-08-text {
  padding: 5px 10px 30px;
}

.cheer .paragraph {
    font-size: 1.8rem;
    margin-top: 10px;
    text-align: center;
}
.cheer .nhk {
    text-align: right;
}

.cheer .paragraph span {
    font-size: 120%;
    line-height: 1.5em;
}

.module-08-text .title-03 {
  margin-top: 30px;
}

a.module-08-block:hover .photo-img {
  transform-origin: center center;
  transform: scale(1.1);
  transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform;
}

a.module-08-block:hover .module-08-text {
  background-color: #16243b;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-09 {
  margin-top: 50px;
}

.module-10 {
  margin-top: 50px;
}

.module-10-block {
  position: relative;
}

.module-10-block:not(:first-child) {
  margin-top: 50px;
}

.module-10-title {
  background-color: #2c4773;
  color: #fff;
  padding: 0 30px 100px;
  position: relative;
  overflow: hidden;
  z-index: 2;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-10-title::after {
  background: url("../img/common/icon-link-03.png") center bottom/65px 65px no-repeat;
  content: '';
  height: 65px;
  width: 65px;
  bottom: 20px;
  left: 50%;
  position: absolute;
  z-index: 2;
  transform: translateX(-50%);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform;
}

.module-10-title.js-toggle-btn::after {
  background: url("../img/common/icon-link-03.png") center bottom/65px 65px no-repeat;
  transform: translateX(-50%) rotate(180deg);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform;
}

.module-10-title .title-03 {
  margin-top: 30px;
}

.module-10-title:hover {
  background-color: #16243b;
  transition: background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.module-10-content {
  background-color: #f5f5f5;
  border-bottom: 15px solid #16243b;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: max-height;
}

.module-10-content .paragraph {
  line-height: 0;
  margin-top: 0;
  padding: 0 30px;
  opacity: 0;
  transition: opacity 0.2s cubic-bezier(0.075, 0.82, 0.165, 1), line-height 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), padding 1s cubic-bezier(0.075, 0.82, 0.165, 1), margin-top 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: opacity, line-height, padding, margin-top;
}

.module-10-content.js-toggle-cnt .paragraph {
  line-height: 2.4rem;
  margin-top: 30px;
  padding: 0 30px 30px;
  opacity: 1;
  transition: opacity 0.3s linear 0.3s, line-height 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), padding 0.4s cubic-bezier(0.075, 0.82, 0.165, 1), margin-top 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: opacity, line-height, padding, margin-top;
}

.module-11,
.module-12 {
  background-color: #f5f5f5;
  margin-top: 50px;
  padding: 20px;
}

.module-11-block,
.module-12-block {
  background-color: #fff;
  padding: 0 20px 30px;
  overflow: hidden;
}

.module-11-block:not(:first-child),
.module-12-block:not(:first-child) {
  margin-top: 20px;
}

.module-11-block .title-03,
.module-12-block .title-03 {
  border-top: 15px solid #16243b;
  margin-top: 30px;
  padding-top: 10px;
}

.module-table-01,
.module-table-02,
.module-table-03 {
  margin-top: 50px;
  width: 100%;
  overflow-x: auto;
}

.module-table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 627px;
}

.module-table-01 .module-table,
.module-table-02 .module-table {
  table-layout: fixed;
}

.table-title,
.table-sub-title,
.table-item {
  border-bottom: 5px solid #fff;
  box-sizing: border-box;
  font-size: 1.4rem;
  height: 80px;
  min-height: 80px;
  padding: 20px;
}

.table-title,
.table-sub-title {
  font-weight: bold;
  letter-spacing: 0.2rem;
}

.table-title {
  background-color: #16243b;
  border-right: 5px solid #fff;
  color: #fff;
}

.table-sub-title {
  background-color: #2c4773;
  color: #fff;
  text-align: center;
}

.table-sub-title:not(:last-child),
.table-item:not(:last-child) {
  border-right: 5px solid #fff;
}

.table-item {
  background-color: #f5f5f5;
  vertical-align: top;
}

.module-table-01 .table-title {
  width: 30%;
}

.module-table-03 .table-sub-title {
  width: 30%;
}

.table-tr.top {
  height: 90px;
  min-height: 90px;
}

.color-w {
  color: #fff;
}

@media only screen and (min-width: 667px) and (orientation: portrait) {
  .module-02-block::before {
    top: -40%;
    left: -20%;
  }

  .module-title-01::after {
    width: 300%;
    transform: translate(-50%, -50%) rotate(20deg);
    z-index: 1;
  }
}

@media only screen and (min-width: 896px) and (orientation: landscape) {
  .title-01 {
    font-size: 3rem;
    line-height: 4rem;
  }

  .title-02 {
    font-size: 2.4rem;
    line-height: 3.4rem;
  }

  .title-03 {
    font-size: 2rem;
    line-height: 3rem;
  }

  .paragraph {
    line-height: 2em;
  }

  .text-box::before {
    border: 100px solid #16243b;
    border-radius: 50%;
    box-sizing: border-box;
    content: '';
    height: 400px;
    width: 400px;
    position: absolute;
  }

  .module-01 {
    padding: 0 40px;
  }

  .module-01::after {
    content: "";
    display: block;
    clear: both;
  }

  .module-01:not(:first-child) {
    margin-top: 50px;
  }

  .module-01-photo {
    height: 400px;
    width: 485px;
  }
  .module-01-photo.message {
    height: 273px;
    width: 485px;
}

  .module-01-photo.left {
    float: left;
    margin-right: 50px;
  }

  .module-01-photo.right {
    float: right;
    margin-left: 50px;
  }

  .module-01-photo.center {
    width: 100%;
  }

  .module-01-photo:not(:last-of-type).left,
  .module-01-photo:not(:last-of-type).right {
    margin-bottom: 30px;
  }

  .module-01-text.left {
    float: left;
    width: calc(100% - 485px - 50px);
  }

  .module-01-text.right {
    float: right;
    width: calc(100% - 485px - 50px);
  }

  .module-01-text .module-title-01,
  .module-01-text .module-title-02,
  .module-01-text .module-title-03,
  .module-01-text .module-table-01,
  .module-01-text .module-table-02,
  .module-01-text .module-table-03,
  .module-01-text .paragraph:first-child {
    margin-top: 0;
  }

  .module-02 {
    padding: 0 40px;
    display: flex;
    justify-content: flex-start;
  }

  .module-02-block {
    width: calc(100% / 3 - 80px / 3);
  }

  .module-02-block:not(:first-child) {
    margin-top: 0;
  }

  .module-02-block:not(:nth-child(3n+1)) {
    margin-left: calc(80px / 2);
  }

  .module-03 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0 40px 40px;
  }

  .module-03-block {
    /* width: calc(100% / 3 - 80px / 3); */
    width: calc(33.3% - 80px / 3);
    margin-top: 40px;
  }

  .module-03-block:not(:first-child) {
    margin-top: 40px;
  }

  .module-03-block:not(:nth-child(3n+1)) {
    margin-left: calc(80px / 2);
  }

  .module-04-block {
    display: flex;
    align-items: flex-start;
    margin: 0 40px;
    min-height: 485px;
  }

  .module-04-block:not(:first-child) {
    margin-top: 80px;
  }

  .module-04-block.left .module-04-photo {
    left: 0;
    order: 2;
  }

  .module-04-block.left .module-04-text {
    margin-left: auto;
  }

  .module-04-block.right .module-04-photo {
    right: 0;
    order: 2;
  }

  .module-04-block.right .module-04-text {
    margin-right: auto;
  }

  .module-04-photo {
    height: 485px;
    width: 485px;
    top: 0;
    position: absolute;
  }

  .module-04-text {
    box-sizing: border-box;
    width: 60%;
    margin-top: 80px;
    padding: 0 60px 40px;
  }

  .module-04-text .title-02 {
    margin-top: 60px;
  }

  .module-05 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0 40px 40px;
  }



  .module-05-block {
    box-sizing: border-box;
    /* width: calc(100% / 3 - 80px / 3); */
    width: calc(33.3% - 80px / 3);
    margin-top: 40px;
  }

  .module-05-block:not(:first-child) {
    margin-top: 40px;
  }

  .module-05-block:not(:nth-child(3n+1)) {
    margin-left: calc(80px / 2);
  }

  .module-06-block {
    justify-content: center;
    min-height: 100px;
  }

  .module-06-block.small {
    max-width: 340px;
    margin: 0 auto;
  }

  .wrapper>.module-07 {
    padding: 0 40px;
  }

  .module-08 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0 40px;
  }

  .module-08-block:not(:first-child) {
    margin-top: 0;
  }

  .module-08-block.full {
    width: 100%;
  }

  .module-08-block.full .module-08-text {
    width: calc(50% - 20px);
  }

  .module-08-block:nth-child(even) {
    margin-left: 40px;
  }

  .module-08-block.half {
    width: calc((100% - 40px) / 2);
  }

  .module-08-block.half:nth-child(n+3) {
    margin-top: 40px;
  }

  .module-08-block.half .module-08-text {
    width: 100%;
  }

  .module-08-block.third {
    width: calc((100% - 80px) / 3);
  }

  .module-08-block.third:not(:nth-child(3n+1)) {
    margin-left: 40px;
  }

  .module-08-block.third .module-08-text {
    width: calc(100%);
  }

  .module-08-photo {
    height: 350px;
  }

  .doc .module-08-photo {
    height: 550px;
  }

  .mov .module-08-photo {
    height: 280px;
  }

  .cheer .module-08-photo {
    height: 380px;
  }

  #tourist-pr .module-08-photo {
    height: 271px;
  }

  .module-08-text {
    box-sizing: border-box;
    color: #fff;
    width: 50%;
    padding: 0 30px 30px;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 2;
  }

  .module-08-text .paragraph {
    margin-top: 30px;
  }

  .cheer .module-08-text .paragraph {
    margin-top: 10px;
  }

  .module-09 {
    padding: 0 40px;
  }

  .module-10 {
    padding: 0 40px;
  }

  .module-10-title {
    padding: 0 100px 30px 30px;
  }

  .module-10-title::after {
    background: url("../img/common/icon-link-03.png") right center/65px 65px no-repeat;
    bottom: 50%;
    left: auto;
    right: 20px;
    transform: translateY(50%);
  }

  .module-10-title.js-toggle-btn::after {
    background: url("../img/common/icon-link-03.png") right center/65px 65px no-repeat;
    transform: translateY(50%) rotate(-180deg);
  }

  .module-11,
  .module-12 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 40px 40px;
  }

  .module-11-block {
    box-sizing: border-box;
    width: calc(100% / 3 - 80px / 3);
    margin-top: 40px;
  }

  .module-11-block:not(:first-child) {
    margin-top: 40px;
  }

  .module-12-block {
    box-sizing: border-box;
    width: calc(100% / 2 - 40px / 2);
    margin-top: 40px;
  }

  .module-12-block:not(:first-child) {
    margin-top: 40px;
  }

  .module-12 .plus-txt{
    display: block;
  }

  .module-title-01::after {
    transform: translate(-50%, -50%) rotate(13deg);
  }

  main>.wrapper>.module-table-01,
  main>.wrapper>.module-table-02,
  main>.wrapper>.module-table-03 {
    box-sizing: border-box;
    padding: 0 40px;
  }

  .module-table {
    width: 100%;
  }

  .table-title,
  .table-sub-title,
  .table-item {
    font-size: 1.6rem;
  }

  .module-title-01 {
    margin-top: 80px;
  }

  .module-title-02 {
    margin-top: 60px;
  }

  .module-title-03 {
    margin-top: 40px;
  }
}

@media only screen and (min-width: 1366px) {
  .breadcrumb {
    padding: 20px 30px;
  }

  .module-01 {
    margin-top: 80px;
  }

  .module-02 {
    margin-top: 60px;
  }

  .module-02-block::before {
    top: -20%;
    left: -40%;
  }

  .module-03 {
    margin-top: 40px;
  }

  .module-04 {
    margin-top: 80px;
  }

  .module-04-text {
    padding: 0 80px 60px;
  }

  .module-title-01 {
    margin-top: 100px;
  }

  .module-title-02 {
    margin-top: 80px;
  }

  .module-title-03 {
    margin-top: 60px;
  }
}

/*  COMMON ---------------------------- */
section {
  margin: 50px 0 0;
  width: 100%;
}

.title-en {
  display: block;
  font-family: 'Anton', sans-serif;
  font-size: 6rem;
  font-weight: 400;
  line-height: 6rem;
  letter-spacing: 0.8rem;
}

.title-ja {
  display: block;
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.5rem;
  letter-spacing: 0.5rem;
}

/*  HERO　---------------------------- */
.hero {
  height: calc(100vh - 205px);
  width: 100%;
  position: relative;
  overflow: hidden;
}

.hero-img {
  display: flex;
  height: 100%;
  width: 100%;
  top: 0;
  position: absolute;
  z-index: 1;
  animation: slidein 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
  will-change: animation, opacity, transform;
}

.hero-text {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  position: relative;
  visibility: hidden;
  transform-origin: right bottom;
  animation: rotatefadein 2s cubic-bezier(0.075, 0.82, 0.165, 1) 0.1s forwards;
  will-change: animation, opacity, transform;
  z-index: 2;
}

.hero-text::after {
  content: '';
  position: absolute;
  background: #e01010 url("../img/index/hero-text-bg-01.png") center center/25rem 25rem no-repeat;
  border-radius: 50%;
  height: 25rem;
  width: 25rem;
  bottom: -10rem;
  left: -5rem;
  z-index: -1;
}

.hero-copy {
  color: #fff;
  font-size: 4rem;
  font-weight: 900;
  line-height: 4.5rem;
  letter-spacing: 0.25rem;
  position: absolute;
  bottom: 0.5rem;
  left: 1rem;
  transform: rotate(-5deg);
}

.hero-copy-br {
  display: block;
  margin-left: 20px;
}

/*  SLIDER---------------------------- */
.slider {
  height: 100%;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.slide {
  height: 100%;
  width: 100vw;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
  overflow: hidden;
  transform-origin: center center;
  visibility: hidden;
}

.slide span {
  position: relative;
  z-index: 2;
}

.slide-img {
  background-position: right center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;
  font-size: 5rem;
  top: 0;
  position: absolute;
  height: 100%;
  width: 100vw;
  z-index: 1;
}

.js-current {
  z-index: 4;
  animation: zoomfadeout 5s ease-in;
  will-change: animation, opacity;
}

.js-next {
  will-change: transform;
  visibility: visible;
  z-index: 2;
}

/*  COUNT　---------------------------- */
.count {
  background-color: #23385b;
  padding: 30px 0;
  position: relative;
  animation: fadein 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
  will-change: animation, opacity;
  z-index: 1;
}

.count::before,
.count::after {
  content: '';
  height: 99px;
  width: 42px;
  position: absolute;
  z-index: 2;
}

.count::before {
  background: url("../img/common/bg-corner-l.png") top left/42px 99px no-repeat;
  top: 0;
  left: 0;
}

.count::after {
  background: url("../img/common/bg-corner-r.png") bottom right/42px 99px no-repeat;
  bottom: 0;
  right: 0;
}

.count-time {
  margin: 0 30px;
  position: relative;
  z-index: 3;
}

.count-time::before {
  background-color: #fff;
  content: '';
  height: 100%;
  width: 12px;
  left: 0;
  position: absolute;
}

.count-time:not(:first-child) {
  margin-top: 20px;
}

.time-title,
.time-text,
.tokyo2020-title,
.tokyo2020-text {
  color: #fff;
}

.time-title {
  font-size: 1.4rem;
  line-height: 1.8rem;
  padding-left: 25px;
  padding-bottom: 4px;
}

.time-text {
  padding-left: 25px;
}

.num {
  font-family: 'Lato', sans-serif;
  font-size: 4.5rem;
  font-weight: 900;
  line-height: 4.5rem;
  letter-spacing: 3px;
}

.unit {
  font-size: 1.44rem;
  font-weight: bold;
  line-height: 1.44rem;
  letter-spacing: 2px;
  margin: 0 5px 0 2px;
}

.tokyo2020 {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 90px;
  width: calc(100% - 20px * 2);
  margin: 20px 20px 0;
  position: relative;
  overflow: hidden;
}

.tokyo2020::before {
  background-color: #c1a676;
  box-sizing: border-box;
  content: '';
  height: 280px;
  width: 300%;
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%) rotate(-70deg);
}

.tokyo2020-title,
.tokyo2020-text {
  position: relative;
  z-index: 2;
}

.tokyo2020-title {
  font-family: 'Anton', sans-serif;
  font-size: 5rem;
  font-weight: 400;
  line-height: 5rem;
  letter-spacing: 5px;
}

.tokyo2020-text {
  font-size: 1.4rem;
  font-weight: bold;
}

/*  NEWS　---------------------------- */
.news-text {
  display: flex;
  justify-content: space-between;
}

.news-title {
  color: #0066ba;
}

.news-more-link {
  background: #0072cf url("../img/common/icon-link-01.png") right center/35px 35px no-repeat;
  border-right: 10px solid transparent;
  box-sizing: border-box;
  color: #fff;
  display: flex;
  align-items: center;
  align-self: flex-end;
  font-size: 1.5rem;
  font-weight: bold;
  height: 60px;
  width: 45%;
  padding-left: 20px;
  padding-right: 35px;
}

.news-headline {
  background-color: #0066ba;
  padding: 30px 20px;
  margin-top: 30px;
  position: relative;
  overflow: hidden;
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.news-headline::before {
  border: 150px solid #0072cf;
  border-radius: 50%;
  box-sizing: border-box;
  content: '';
  height: 680px;
  width: 680px;
  top: -40%;
  left: -20%;
  position: absolute;
  transition: height 2s cubic-bezier(0.075, 0.82, 0.165, 1), width 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, width;
}

.news-headline:hover {
  background-color: #00569c;
}

.news-headline:hover::before {
  height: 480px;
  width: 480px;
}

.news-list {
  position: relative;
  z-index: 2;
}

.news-info {
  display: flex;
  align-items: center;
}

.news-info:not(:first-child) {
  margin-top: 3rem;
}

.news-category {
  background-color: #fff;
  display: block;
  color: #0066ba;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 4rem;
  width: 120px;
  text-align: center;
}

.news-date {
  color: #fff;
  font-family: 'RobotoCondensed', sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  padding-left: 20px;
}

.news-detail {
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 2.4rem;
  margin-top: 20px;
}

.news-link {
  color: #fff;
}

/*  PICK UP ---------------------------- */
.pickup {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 3;
}

.pickup-text {
  background-color: #23385b;
  order: 2;
  padding: 30px 20px 100px;
  position: relative;
  overflow: hidden;
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.pickup-text::before {
  border: 150px solid #2c4773;
  border-radius: 50%;
  box-sizing: border-box;
  content: '';
  height: 680px;
  width: 680px;
  top: -40%;
  right: -20%;
  position: absolute;
  transition: height 2s cubic-bezier(0.075, 0.82, 0.165, 1), width 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, width;
}

.pickup-text:hover {
  background-color: #16243b;
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.pickup-text:hover::before {
  height: 480px;
  width: 480px;
}

.pickup-title,
.pickup-paragraph {
  color: #fff;
  position: relative;
  z-index: 2;
}

.pickup-photo {
  height: 250px;
  order: 1;
  position: relative;
  overflow: hidden;
}

.pickup-photo-img {
  /* width: 120%; */
  width: 102%;
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
}

.pickup-paragraph {
  font-weight: bold;
  line-height: 2.9rem;
  margin-top: 20px;
}
.pickup-text ol {
  font-weight: bold;
  line-height: 2.9rem;
  /* margin-top: 20px; */
  font-size: 1.75em;
      color: #fff;
  margin-left: -1em;
  margin-top: 0;
margin-bottom: -20px;
}

.pickup-more-link {
  background: #0072cf url("../img/common/icon-link-01.png") right center/60px 60px no-repeat;
  border-right: 20px solid transparent;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 80px;
  letter-spacing: 0.2rem;
  height: 80px;
  width: 100%;
  bottom: 0;
  right: 0;
  position: absolute;
  text-align: center;
}

/*  MAIN CONTENT ---------------------------- */
.main-content-block {
  box-sizing: border-box;
  display: block;
  min-height: 225px;
  padding: 40px 30px;
  overflow: hidden;
  position: relative;
  transition: background-color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: background-color;
}

.main-content-block::before {
  border-radius: 50%;
  box-sizing: border-box;
  content: '';
  height: 600px;
  width: 600px;
  position: absolute;
  transition: height 3s cubic-bezier(0.075, 0.82, 0.165, 1), width 3s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: height, width;
}

.main-content-block::after {
  background: url("../img/common/icon-link-01.png") right center/60px 60px no-repeat;
  content: '';
  height: 60px;
  width: 60px;
  top: 90px;
  right: 30px;
  position: absolute;
  z-index: 2;
}

.main-content-block:hover::before {
  height: 400px;
  width: 400px;
}

.main-content-block.content-01 {
  background-color: #e01010;
}

.main-content-block.content-01::before {
  background-color: #c70e0e;
  border: 100px solid #ef3314;
  top: -50%;
  left: 10%;
}

.main-content-block.content-01:hover {
  background-color: #c70e0e;
}

.main-content-block.content-02 {
  background-color: #00b259;
  margin-top: 20px;
}

.main-content-block.content-02::before {
  background-color: #00914a;
  border: 100px solid #3fc582;
  top: -80%;
  left: 0%;
}

.main-content-block.content-02:hover {
  background-color: #00914a;
}

.main-content-block.content-03 {
  background-color: #f9b200;
  margin-top: 20px;
}

.main-content-block.content-03::before {
  background-color: #f0a300;
  border: 100px solid #fcc349;
  top: -10%;
  right: -10%;
}

.main-content-block.content-03:hover {
  background-color: #f0a300;
}

.main-content-block.content-03:hover::before {
  background-color: #f0a300;
  border: 100px solid #fcc349;
}

.main-content-title {
  color: #fff;
  position: relative;
  z-index: 2;
}

.title-num {
  font-family: 'Roboto', sans-serif;
  font-size: 13.5rem;
  font-weight: 900;
  display: block;
  line-height: 13.5rem;
}

.title-ja {
  font-size: 2.5rem;
  line-height: 3rem;
  letter-spacing: 3px;
}

/*  MODIFIER ---------------------------- */
.pc-show {
  display: none;
}

/* ========================================
   SP LANDSCAPE
---------------------------------------- */
@media only screen and (min-width: 667px) and (orientation: landscape) {
  .hero {
    height: calc(100vh - 90px);
  }

  .hero-copy {
    left: 1.5rem;
  }

  .hero-text::before {
    display: none;
  }

  .hero-text::after {
    background: #e01010 url("../img/index/hero-text-bg-01.png") center center/25rem 25rem no-repeat;
  }

  .hero-copy {
    left: 0.7rem;
  }

  .news-more-link {
    justify-content: center;
    letter-spacing: 0.5rem;
  }

  .count-time {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .count-time::before {
    display: none;
  }

  .pc-show {
    display: none;
  }
}

/* ========================================
  TABLET PORTRAIT
---------------------------------------- */
@media only screen and (min-width: 667px) and (orientation: portrait) {
  .hero-text::before {
    left: -120px;
  }

  .hero-text::after {
    background: #e01010 url("../img/index/hero-text-bg-01.png") center center/40rem 40rem no-repeat;
    height: 40rem;
    width: 40rem;
    bottom: -15rem;
    left: -5rem;
  }

  .hero-copy {
    font-size: 6.5rem;
    line-height: 7.2rem;
    bottom: 0.8rem;
    left: 3.5rem;
  }

  .count-time {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .count-time::before {
    display: none;
  }

  .main-content-block {
    min-height: 150px;
  }

  .main-content-block::after {
    top: 50%;
    transform: translateY(-50%);
  }

  .main-content-title {
    display: flex;
    align-items: center;
  }

  .title-num {
    font-family: 'Roboto', sans-serif;
    font-size: 10rem;
    font-weight: 900;
    line-height: 10rem;
    padding-right: 10px;
  }

  .pc-show {
    display: block;
  }

  .pc-show {
    display: none;
  }
}

/* ========================================
   TABLET LANDSCAPE
---------------------------------------- */
@media only screen and (min-width: 896px) and (orientation: landscape) {
  .title-ja {
    margin-top: 15px;
  }

  .hero {
    height: calc(100vh - 185px);
  }

  .hero-text::after {
    background: #e01010 url("../img/index/hero-text-bg-01.png") center center/38rem 38rem no-repeat;
    height: 38rem;
    width: 38rem;
    bottom: -18rem;
    left: calc(50% - 38rem / 2);
    transform-origin: right bottom;
    will-change: animation, transform;
  }

  .hero-copy {
    font-size: 7rem;
    line-height: 8rem;
    letter-spacing: 0.8rem;
    left: 45%;
    transform: translateX(-50%);
  }

  .hero-copy-br {
    margin-left: 7.5rem;
  }

  .slide-img {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
  }

  .count {
    padding: 0 20px;
  }

  .count-wrapper {
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
  }

  .count-time {
    align-items: flex-start;
    margin: 20px 0;
    width: calc(100% / 4);
  }

  .count-time:not(:first-child) {
    margin-left: 15px;
  }

  .count-time::before {
    display: block;
  }

  .since311,
  .olympic,
  .paralympic {
    width: calc((100% - 28%) / 3);
  }

  .tokyo2020 {
    height: auto;
    width: 28%;
    margin: 0 20px 0;
    padding: 20px;
  }

  .tokyo2020::before {
    transform: translate(-50%, -50%) rotate(0);
  }

  .tokyo2020-title {
    font-family: 'Anton', sans-serif;
    font-size: 4rem;
    font-weight: 400;
    line-height: 4rem;
    letter-spacing: 3px;
  }

  .tokyo2020-text {
    font-size: 1.2rem;
    font-weight: bold;
  }

  .num {
    font-family: 'Lato', sans-serif;
    font-size: 4rem;
    font-weight: 900;
    line-height: 4rem;
    letter-spacing: 2px;
  }

  .unit {
    font-size: 1.4rem;
    line-height: 1.4rem;
    letter-spacing: 1px;
  }

  .news {
    display: flex;
    flex-wrap: wrap;
  }

  .news-text {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 300px;
  }

  .news-more-link {
    align-self: auto;
    margin-top: 50px;
    width: calc(100% - 50px);
  }

  .news-headline {
    box-sizing: border-box;
    width: calc(100% - 300px);
    margin-top: 0;
    padding: 30px;
  }

  .pickup {
    flex-direction: row;
  }

  .pickup-text,
  .pickup-photo {
    width: 50%;
  }

  .pickup-text {
    box-sizing: border-box;
    padding: 60px 60px 120px;
  }

  .pickup-more-link {
    width: 70%;
  }

  .pickup-photo {
    height: auto;
  }

  .main-content {
    display: flex;
    justify-content: space-between;
  }

  .main-content-block {
    padding: 40px 30px 120px;
    width: calc(100% / 3 - 80px / 3);
  }

  .main-content-block::after {
    top: auto;
    bottom: 30px;
  }

  .main-content-block.content-01::before {
    top: -70%;
    left: -90%;
  }

  .main-content-block.content-02 {
    margin-top: 0;
  }

  .main-content-block.content-03 {
    box-sizing: border-box;
    margin-top: 0;
  }
}

/* ========================================
   PC STANDARD
---------------------------------------- */
@media only screen and (min-width: 1024px) {

  .since311,
  .olympic,
  .paralympic {
    width: calc((100% - 360px) / 3);
  }

  .tokyo2020 {
    width: 360px;
  }

  .tokyo2020::before {
    box-sizing: border-box;
    content: '';
    height: 280px;
    width: 300%;
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%) rotate(-70deg);
  }
}

/* ========================================
   PC WIDE
---------------------------------------- */
@media only screen and (min-width: 1366px) {
  section {
    margin: 80px 0 0;
  }

  .title-en {
    font-family: 'Anton', sans-serif;
    font-size: 4rem;
    font-weight: 400;
    font-size: 9.5rem;
    line-height: 10.5rem;
    letter-spacing: 0.8rem;
  }

  .title-ja {
    font-size: 4.5rem;
    line-height: 5rem;
    letter-spacing: 0.5rem;
  }

  .count-wrapper {
    margin: 0 auto;
  }

  .time-title {
    font-size: 1.8rem;
  }

  .news-more-link {
    font-size: 2.4rem;
    letter-spacing: 0.5rem;
    height: 100px;
  }

  .news-headline {
    padding: 50px;
  }

  .news-detail {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }

  .pickup-paragraph {
    font-size: 1.6rem;
    line-height: 3.6rem;
    margin-top: 40px;
  }

.pickup-paragraph.pt-0 {
    margin-top: 20px;
}
.pickup-text ol {
    line-height: 3.6rem;
}

  .pickup-more-link {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.4rem;
    letter-spacing: 0.5rem;
    height: 100px;
  }

  .pickup-text {
    padding: 80px 80px 140px;
  }

  .main-content-block::after {
    background: url("../img/common/icon-link-01.png") right center/70px 70px no-repeat;
    content: '';
    height: 70px;
    width: 70px;
  }

  .main-content-block.content-01::before {
    top: -80%;
    left: -70%;
  }

  .main-content-title .title-ja {
    font-size: 3.3rem;
    line-height: 4.3rem;
    letter-spacing: 0rem;
  }
}

@media only screen and (min-width: 897px) and (orientation: landscape) {
  .sp {
    display: none;
  }
}

@media screen and (min-width: 0px) and (max-width: 896px) {
  .pc {
    display: none;
  }
}

@-moz-keyframes rotatefadein {
  0% {
    opacity: 0;
    transform: translate(-10px, 10px);
  }

  100% {
    opacity: 1;
    transform: translate(0, 0);
    visibility: visible;
  }
}

@-webkit-keyframes rotatefadein {
  0% {
    opacity: 0;
    transform: translate(-10px, 10px);
  }

  100% {
    opacity: 1;
    transform: translate(0, 0);
    visibility: visible;
  }
}

@-o-keyframes rotatefadein {
  0% {
    opacity: 0;
    transform: translate(-10px, 10px);
  }

  100% {
    opacity: 1;
    transform: translate(0, 0);
    visibility: visible;
  }
}

@keyframes rotatefadein {
  0% {
    opacity: 0;
    transform: translate(-10px, 10px);
  }

  100% {
    opacity: 1;
    transform: translate(0, 0);
    visibility: visible;
  }
}

@-moz-keyframes zoomfadeout {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  80% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(1.05);
    visibility: visible;
  }
}

@-webkit-keyframes zoomfadeout {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  80% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(1.05);
    visibility: visible;
  }
}

@-o-keyframes zoomfadeout {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  80% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(1.05);
    visibility: visible;
  }
}

@keyframes zoomfadeout {
  0% {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }

  80% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(1.05);
    visibility: visible;
  }
}

/* ========================================
   mini-SP acc-btn
---------------------------------------- */
@media screen and (min-width: 361px) and (max-width: 380px) {
.acc-btn {
    width: 62px;
    width: 62px;
    letter-spacing: 0px;
}
.acc-btn.english {
    letter-spacing: 0px;
}
}
@media screen and (min-width: 301px) and (max-width: 360px) {
.acc-btn {
    width: 53px;
    letter-spacing: 0px;
}
.acc-btn.english {
    letter-spacing: 0px;
}

.header-logo-link {
    display: block;
    height: 38px;
    width: 118px;
}
.header-logo-img {
    height: 38px;
    width: 118px;
}
.header-logo {
    margin-left: 10px;
}
.header-portal-img {
  height: 32px;
  width: 79px;
}
.header-portal-link {
    margin-left: 10px;
}
}

@media screen and (min-width: 0px) and (max-width: 300px) {
.acc-btn {
    width: 45px;
    letter-spacing: 0px;
}
.header-acc {
    padding: 15px 15px;
  }
.acc-btn.english {
    letter-spacing: -0.25px;
    font-size: 1.2rem;
}
.header-logo {
    margin-left: 10px;
}
.header-portal-img {
  height: 25px;
  width: 56px;
}
.header-portal-link {
    margin-left: 10px;
}

.header-logo-link {
    display: block;
    height: 33px;
    width: 104px;
}
.header-logo-img {
    height: 33px;
    width: 104px;
}
.tokyo2020-title {
    font-size: 4rem;
  }
  .tokyo2020-text {
    font-size: 1.2rem;
}
}


/* 個別ページカスタマイズCSS */

/* NHK 「世界を応援しよう！」プロジェクト 上書きCSS*/

@media screen and (min-width: 896px) and (orientation: landscape) {
#cheer .module-01-photo {
    height: 500px;
    /* width: 485px; */
}
.cheer_nhk .module-01-photo.left {
    /* height: 200px; */
        height: 137px;
}
}

@media screen and (min-width: 0px) and (max-width: 896px) {
  #cheer  .module-01-photo {
    height: 50vw;
    overflow: hidden;
    position: relative;
  }
  .cheer_nhk .module-01-photo.left {
      height: 26vw;
  }
}

#cheer.module-02.center{
  justify-content: center;
}
#cheer .module-02-photo{
  height: 217px;
  overflow: hidden;
  position: relative;
}
@media screen and (min-width: 0px) and (max-width: 896px) {
  #cheer .module-02-photo{
    height: 60vw;
    overflow: hidden;
    position: relative;
  }
}
#cheer .module-02-text .title-03{
text-align: center;
margin-top: 10px;
}
@media only screen and (min-width: 896px) and (orientation: landscape) {
.cheer_nhk .module-01-photo:not(:last-of-type).left, .module-01-photo:not(:last-of-type).right {
    margin-bottom: 0px;
}
}
.cheer_nhk {
    margin-bottom: -10px;
}



/* NEWS&EVENT上書きCSS*/

/* @media only screen and (min-width: 896px) and (orientation: landscape) {
.newsevent .module-02-block {
    width: calc(100% / 4 - 80px / 4);
}
} */

/* @media only screen and (min-width: 896px) and (orientation: landscape){
.newsevent .module-02-block:not(:nth-child(4n+1)) {
    margin-left: calc(80px / 2);
}
} */

@media only screen and (min-width: 896px) and (orientation: landscape){
.newsevent  {
    padding: 0px;
}
}

.newsevent .module-02-block{
    margin-left: 20px;
        margin-top: 0px;
}

.newsevent{
    margin-left: -20px;
    /* display: -ms-grid;
    -ms-grid-columns: min-content; */
}

.autoplay-slider{
display: flex;
width: 100vw;
overflow: hidden;
}

#content {
width: 100vw;
overflow-x: hidden;
}

.ns_slide{
 /* height: 200px; */
 width: calc(100vw / 4 - 80px / 4);
/* width: 400px; */
/* background: #3486eb; */
/* border: 1px solid #000; */
/* margin: 20px; */
position: relative;
}

@media screen and (min-width: 668px) and (max-width: 896px) {
  .ns_slide{
   width: calc(100vw / 2 - 60px);
  position: relative;
  }
  }

@media screen and (min-width: 0px) and (max-width: 667px) {
  .ns_slide{
   width: calc(100vw - 60px);
  position: relative;
  }
  }

.newsevent .module-02 {
    padding: 0px;
  }

@keyframes sliderAnimation {
100% {
  transform: translateX(-50%);
}
}


.autoplay-slider{
display: flex;
min-width: 100%;
-ms-min-width: 200%;
width: min-content;
/* display: -ms-grid;
-ms-grid-columns: min-content; */
/* 以下の**sで時間調節 */
animation: 30s linear infinite sliderAnimation;
}

@media all and (-ms-high-contrast:none){
  .autoplay-slider{
  min-width: 200%;
  }
}

/* 復興五輪に向けた復興庁の取組 上書きCSS */
@media only screen and (min-width: 896px) and (orientation: landscape){
.module-08-block.half {
    width: calc(50% - 20px);
}
}
@media screen and (min-width: 360px) and (max-width: 667px) and (orientation: portrait) {
#initiative .module-08-photo {
    height: 240px;
}
}
@media screen and (min-width: 640px) and (max-width: 895px) and (orientation: landscape) {
#initiative .module-08-photo {
    height: 400px;
}
}
@media only screen and (min-width: 896px) and (max-width: 1149px) and (orientation: landscape){
#initiative .module-08-photo {
    height: 432px;
}
}
@media only screen and (min-width: 1150px) and (orientation: landscape){
#initiative .module-08-photo {
    height: 450px;
}
}
@media screen and (min-width: 501px) and (max-width: 667px) and (orientation: portrait) {
#initiative .module-02-photo {
      height: 30vh;
}
#initiative .module-08-photo {
      height: 30vh;
}
}
@media screen and (min-width: 668px) and (max-width: 895px) {
#initiative .module-02-photo {
      height: 45vh;
}
#initiative .module-08-photo {
      height: 45vh;
}
}
@media screen and (min-width: 896px) and (orientation: portrait){
#initiative .module-02-photo {
    height: 42vh;
}
#initiative .module-08-photo {
    height: 42vh;
}
}

/* 復興五輪関連イベントを通じた被災地の情報発信 上書きCSS */
@media only screen and (min-width: 896px) and (orientation: landscape){
#event .module-08-block.third {
    width: calc(33% - 26px);
}
}
@media screen and (min-width: 896px) and (orientation: landscape){
#event .module-08-photo {
    height: 194px;
}
}

@media screen and (min-width: 668px) and (max-width: 895px) {
#event .module-08-photo {
      height: 306px;
}
}

/* 被災地での聖火リレー 上書きCSS */
@media only screen and (min-width: 896px) and (orientation: landscape) {
#practice .module-table-03 .relayroute {width: 270px;}
}

#practice table .center{
  text-align: center;
}
#practice table .middle{
  vertical-align: middle;
}
#practice table .p-10{
  padding: 10px;
}

/* 「復興五輪」開幕に当たっての復興大臣からのメッセージ公表について 上書きCSS */

@media screen and (max-width: 895px){
#pickup0720 .pc {
  display:none;}
}
@media screen and (max-width: 895px){
#pickup0720 .pickup-title .title-ja{
 font-size: 2rem;
 padding-top: 0.5em;
}
}
#pickup0720 .title-ja{
 font-size: 2.5rem;
 line-height: 1.45em;"
}
#pickup0720 .pickup-paragraph{
  font-size: 1.75em;
}

/* 「交通広告」による東北（被災地の魅力、復興五輪）に関する情報発信について 上書きCSS */
#event .trans-ad .paragraph {
    font-size: 1.4rem;
    font-weight: normal;
    line-height: 2.4rem;
    letter-spacing: 0.1rem;
    margin-top: 2px;
    text-align: center;
}
#event .monument .caption {
    font-size: 1.4rem;
    font-weight: normal;
    line-height: 2.4rem;
    letter-spacing: 0.1rem;
    margin-top: 2px;
    text-align: center;
    position: relative;
}

@media only screen and (min-width: 896px) and (orientation: landscape){
#event .monument .module-01-photo.left img {
    width: 100%;
}
#event .monument .module-01-photo.left {
    margin-right: 32px;
}

#event .module-01-photo.center {
    /* width: calc(33% - 26px); */
    width:50%;
}
}

#event .trans-ad img {
    position: relative;
}
#event .trans-ad {
    margin-top: 30px;
}
#event .trans-ad .module-08-photo {
    height: auto !important;
    min-height: 1px;
}
#event .move-ti{
  font-size: 1.6rem;
  font-weight: bold;
  padding-bottom: 6px;
}
#event .move-txt{
  padding-top: 0px;
}
#event .module-01-photo {
  height: auto !important;
  min-height: 1px;
}
@media only screen and (min-width: 896px) and (orientation: landscape) {
  #event .move-txt{
    padding-top: 70px;
  }
  #event .module-01-photo {
    height: auto !important;
    min-height: 1px;
  }
  #event .trans-ad .module-08-photo {
      height: auto !important;
      min-height: 1px;
  }
  #event .module-01-photo.left {
      margin-right: -80px;
  }
  #event .module-01-photo.left img {
      width: 70%;
  }
  #event .module-01-photo.right {
      height: 400px !important;
  }
  #event .module-08-photo.h350 {
      height: 350px !important;
  }
}

#event .module-01-photo.right {
    height: 250px !important;
}
/* @media screen and (min-width: 668px) and (max-width: 895px){
  #event .trans-ad .module-08-photo {
      height: 230px;
  }
} */

/* TOP PICKUP画像（SP） */
@media screen and (max-width: 895px){
.pickup-photo-img {
  width: 100%;
  top: 0%;
  left: 0%;
  position: inherit;
  transform: none;
}
.pickup-photo {
    height: auto;
}
}
/* 被災地の情報発信ー観光地のPR 上書きCSS */
@media only screen and (min-width: 896px) and (orientation: landscape){
#tourist-pr .module-08-block.third {
    width: calc(33% - 26px);
}
}
@media screen and (min-width: 896px) and (orientation: landscape){
#tourist-pr .third .module-08-photo {
    height: 194px;
}
}

@media screen and (min-width: 668px) and (max-width: 895px) {
#tourist-pr .third .module-08-photo {
      height: 306px;
}
}
/* @media only screen and (min-width: 896px) and (orientation: landscape){
#tourist-pr .trans-ad .module-08-photo {
    height: auto !important;
    min-height: 1px;
}
} */

#tourist-pr .trans-ad .module-08-photo {
    height: auto !important;
    min-height: 1px;
}
#tourist-pr .trans-ad img {
    position: relative;
}
#tourist-pr .trans-ad .paragraph {
    font-size: 1.4rem;
    font-weight: normal;
    line-height: 2.4rem;
    letter-spacing: 0.1rem;
    margin-top: 2px;
    text-align: center;
}