body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Noto Sans JP", "Inter", system-ui, sans-serif;
  letter-spacing: 0;
	font-size: 16px;
}

/* Layout Styles
   ---------------------------------------------------------------------------*/
   
/*clearfix*/
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

.mt0 {
	margin-top: 0 !important;
}
.mt5 {
	margin-top: 0.5em !important;
}
.mt10 {
	margin-top: 1em !important;
}
.mt15 {
	margin-top: 1.5em !important;
}
.mt20 {
	margin-top: 2em !important;
}
.mt30 {
	margin-top: 3em !important;
}
.mt40 {
	margin-top: 4em !important;
}
.mt50 {
	margin-top: 5em !important;
}
.mt60 {
	margin-top: 6em !important;
}
.mb0 {
	margin-bottom: 0 !important;
}
.mb5 {
	margin-bottom: 0.5em !important;
}
.mb10 {
	margin-bottom: 1em !important;
}
.mb15 {
	margin-bottom: 1.5em !important;
}
.mb20 {
	margin-bottom: 2em !important;
}
.mb30 {
	margin-bottom: 3em !important;
}
.mb40 {
	margin-bottom: 4em !important;
}
.mb50 {
	margin-bottom: 5em !important;
}
.mb60 {
	margin-bottom: 6em !important;
}
.mr0 {
	margin-right: 0 !important;
}
.mr5 {
	margin-right: 5px !important;
}
.mr10 {
	margin-right: 10px !important;
}
.ml0 {
	margin-left: 0 !important;
}
.ml5 {
	margin-left: 5px !important;
}
.ml10 {
	margin-left: 10px !important;
}


.pt0 {
	padding-top: 0 !important;
}
.pt5 {
	padding-top: 0.5em !important;
}
.pt10 {
	padding-top: 1em !important;
}
.pt15 {
	padding-top: 1.5em !important;
}
.pt20 {
	padding-top: 2em !important;
}
.pt30 {
	padding-top: 3em !important;
}
.pt40 {
	padding-top: 4em !important;
}
.pb0 {
	padding-bottom: 0 !important;
}
.pb5 {
	padding-bottom: 0.5em !important;
}
.pb10 {
	padding-bottom: 1em !important;
}
.pb15 {
	padding-bottom: 1.5em !important;
}
.pb20 {
	padding-bottom: 2em !important;
}
.pb30 {
	padding-bottom: 3em !important;
}
.pb40 {
	padding-bottom: 4em !important;
}
.pb50 {
	padding-bottom: 5em !important;
}
.pb60 {
	padding-bottom: 6em !important;
}
.pr0 {
	padding-right: 0 !important;
}
.pr5 {
	padding-right: 5px !important;
}
.pr10 {
	padding-right: 10px !important;
}
.pr20 {
	padding-right: 20px !important;
}
.pl0 {
	padding-left: 0 !important;
}
.pl5 {
	padding-left: 5px !important;
}
.pl10 {
	padding-left: 10px !important;
}
.pl20 {
	padding-left: 20px !important;
}
.TextMincho {
	font-family:  "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.TextCenter {
	text-align: center;
}
.TextNormal {
	font-weight: normal;
}

form {
  margin: 0;
  padding: 0
}

input, select, textarea {
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  margin: 0;
  padding: 0
}


/* Bootstrap gutter
   ---------------------------------------------------------------------------*/
/*カラム落ち調整.rowにFlexboxを当てる*/
.flex {
	display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap; /* Safari6.1以降 */
	flex-wrap: wrap;
}

/*gridのgutter調整*/
.row-0 {
  margin-left: 0px;
  margin-right: 0px;
}
.row-0 > div {
  padding-right: 0px;
  padding-left: 0px;
}
.row-10 {
  margin-left: -5px;
  margin-right: -5px;
}
.row-10 > div {
  padding-right: 5px;
  padding-left: 5px;
}
.row-20 {
  margin-left: -10px;
  margin-right: -10px;
}
.row-20 > div {
  padding-right: 10px;
  padding-left: 10px;
}
.row-30 {
  margin-left: -15px;
  margin-right: -15px;
}
.row-30 > div {
  padding-right: 15px;
  padding-left: 15px;
}
.row-40 {
  margin-left: -20px;
  margin-right: -20px;
}
.row-40 > div {
  padding-right: 20px;
  padding-left: 20px;
}
.row-50 {
  margin-left: -25px;
  margin-right: -25px;
}
.row-50 > div {
  padding-right: 25px;
  padding-left: 25px;
}
.row-20 {
  margin-left: -10px;
  margin-right: -10px;
}
/*.row-0::before, .row-0::after,
.row-10::before, .row-10::after,
.row-20::before, .row-20::after,
.row-30::before, .row-30::after,
.row-40::before, .row-40::after,
.row-50::before, .row-50::after {
    content: " ";
    display: table;
}*/
.row-0::after,
.row-10::after,
.row-20::after,
.row-30::after,
.row-40::after,
.row-50::after {
    clear: both;
}




/*# sourceMappingURL=bundle.css.map */

/* 動画背景用　 */

.hero {
  position: relative;
}

/* video */

.video-box {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
}
@media (max-width: 768px) {
  .video-box {
    height: 100%;
  }
}
/* Safari用のハックは、Chromeに適用されないようにする */
@supports (-webkit-touch-callout: none) {
  .video-box {
    height: -webkit-fill-available;
  }
}
.video {
  width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    font-family: 'object-fit: cover;';
    position: absolute;
    top: 0;
    left: 0;
}
/*.video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}*/

/* overlay */

.overlay::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  background: rgba(0, 0, 0, 0.3);
}


/*=== 9-1-4 矢印が動いてスクロールを促す  ====*/

/*スクロールダウン全体の場所*/
.scrolldown4{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
	bottom:1%;
	right:50%;
    /*矢印の動き1秒かけて永遠にループ*/
	animation: arrowmove 1s ease-in-out infinite;
}


/* 年表*/

#chronology{
	margin: 0 auto 100px;
  padding-top: 150px;
  padding-top: 150px;
	position: relative;
	clear: both;
	/*border-top: thin dotted #000000;*/
}
@media (max-width: 768px) {
  #chronology  {
    margin: 100px auto 100px;
  }
}
#chronology h2 {
  margin-bottom: 30px;
  font-size: 3.6rem;
  font-weight: bold;
  background: #27acd9;
	padding: 1rem 0 1rem 2rem;
	position: relative;
	color: #fff
}
#chronology h2:before {
    position: absolute;
    content: '';
    top: 100%;
    left: 0;
    border: none;
    border-bottom: solid 10px transparent;
    border-right: solid 20px rgb(20, 86, 110);
}
#chronology p{
  /*margin-bottom: 50px;*/
  line-height: 2;
}

#anniversary_50{
	padding-bottom: 100px;
}