@charset "utf-8";

html {
  width: 100%;
  height:100%;
  padding: 0px;
  margin: 0px;
}

body {
  font-size: 14px;

/*###  font-size: 16px;###*/
  width: 100%;
  height:100%;
  padding: 0px;
  margin: 0px;
  background-color: #ffffff;
  background-attachment: fixed; 
  line-height: 2.0;
  font-family:"Roboto Slab", Garamond, "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  letter-spacing: 0.5pt;
  color: black;
  text-align: justify;
  text-justify: inter-ideograph;
}

table#frontpage{
width:100%;
height: 100vh;
}

td#frontcell{
width: 240px;
height: 100vh;
text-align: right;
vertical-align: middle;
}

#dayslogo {
margin-top: 100px;
/*###margin-top: 200px;###*/
opacity: 1;
}

img#daysimg {
width: 240px;
}

img#daysimg {
width: 240px;
}

.listtitle {
font-size: 24px;
margin: 40px 0 40px 0;
line-height: 50px;
}

.listtitle a {
color: #274a78 !important;
text-decoration: none;
}

.listtitle a:hover {
color: #a0d8ef !important;
}

.listtitle a:active {
color: #cccccc !important;
}

table.indxframe {
  max-width: 560px;

/*###  max-width: 850px;###*/
  white-space: normal;
  width: 100%;
  border-spacing: 20px;
  margin: 0 auto;
}

td.indxL {
  width: 40%;
  vertical-align: top;
  text-align: right;
  padding: 0px 10px 0px 0px;

}

td.indxR {
  width: 60%;
  vertical-align: top;
  text-align: left;
  border-left: 1px solid #274a78; /*索引リスト縦線color*/
  padding: 0px 0px 0px 10px;
}

td.indxBottom {
  width: 20%;
  height: 400px;
}

a.indxlink {
color: #274a78 !important;
text-decoration: none;
}

a.indxlink:hover {
color: #a0d8ef !important;
}

a.indxlink:active {
color: #cccccc !important;
}

a.anchor{
display: block;
padding-top: 100px;
margin-top: -100px;
}

a.insideindx {
color: #274a78 !important;
text-decoration: none;
}

a.insideindx:hover {
color: #a0d8ef !important;
}

a.insideindx:active {
color: #cccccc !important;
}


table.mttable {
max-width: 560px;
padding: 0;

/*###
max-width: 850px;
padding: 20px;
###*/
}

td.tableline {
height: 20px;
vertical-align: middle;
}

div.gradline {
 max-width: 560px;

/*###  max-width: 850px;###*/
  background-image: linear-gradient(to right, transparent, #274a78 50%, transparent);
  background-repeat: no-repeat;
  content: "";
  height: 1px;
  left: 0;
  margin-inline: auto;
  right: 0;
  width: 100%;
}

td.mtdate {
width: 10%;
text-align:left;
vertical-align:middle;
font-size:12px;
}

td.mtname {
width: 30%;
text-align:left;
vertical-align:middle;
font-size:16px;
}

td.mtlocation {
width: 35%;
text-align:left;
vertical-align:middle;
font-size:12px;
}

td.mtyear {
width: 15%;
text-align:left;
vertical-align:middle;
font-size:12px;
}

td.mtdate a {
color: #000 !important;
text-decoration: none;
}

td.mtname a {
color: #274a78 !important;
text-decoration: none;
}

td.mtlocation a {
color: #274a78 !important;
text-decoration: none;
}

td.mtyear a {
color: #000 !important;
text-decoration: none;
}

td.mtdate a:hover, td.mtname a:hover, td.mtlocation a:hover, td.mtyear a:hover {
color: #a0d8ef !important;
text-decoration: none;
}

td.mtdate a:active, td.mtname a:active, td.mtlocation a:active, td.mtyear a:active {
color: #cccccc !important;
text-decoration: none;
}

div.ednotetitle {
width: 100%;
font-size:16px;

/*###
width: 70%;
font-size:20px;
###*/
margin: auto;
text-align: center;
padding: 60px;
}

div.ednotemain {
width: 100%;

/*###width: 70%;###*/
margin: auto;
text-align: left;
}

div.ednotedate {
width: 100%;
font-size:12px;

/*####
width: 70%;
font-size:14px;
###*/
margin: auto;
text-align: right;
padding: 20px 0 0;
}

div.ednotename {
width: 100%;
font-size:16px;

/*###
width: 70%;
font-size:18px;
###*/
margin: auto;
text-align: right;
padding: 40px 0 60px;
}

/*----------------------------------------------------------*/
/* モーダルウインドウ Slide In */
/*----------------------------------------------------------*/
body.fixed {
  position: fixed;
  width: 100%;
  height: 100vh;
}

.modal1{
  display: none;
}

.modal2{
  display: none;
}

/* モーダルウインドウ／背景 */
.modal-bg {
  width: 100%;
  height: 100vh;
  background-color: rgba(0,0,0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  transition: .3s;
}

/* モーダルウインドウ／コンテンツ */
.modal-main-container1 {
  max-width: 560px;

/*###  max-width: 850px;###*/
  color: black;
  z-index: 1001;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 90%;
  height: 90%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.modal-main-container1.slide{
  top: 50%;
  transition: .3s;
}

.modal-main-container2 {
  max-width: 560px;

/*###  max-width: 850px;###*/
  color: black;
  z-index: 1001;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  height: 90%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.modal-main-container2.slide{
  top: 50%;
  transition: .3s;
}

.modal-main-contents {
  max-width: 560px;

/*###  max-width: 850px;###*/
  background-color: #fff;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: .3s; 
}

/* モーダルウインドウ／閉じるボタンのwrapper */
.modal-close-btn__wrapper {
  border-bottom: solid 1px #ebebeb;
  height: 40px;
  display: flex;
 justify-content: flex-end;
}

/* モーダルウインドウ／閉じるボタン */
.modal-close-btn {
  color: #274a78;
  font-weight: bold;
  font-size: 18px;
  cursor: pointer;
  margin-right:10px
}

/* スクロール用タグ */
.modal-scroll__container {
  overflow-x: hidden;
}

/* コンテンツ用タグ */
.modal-wrapper {
  margin: 24px;
white-space: normal;
}


/*========== スライドヘッダー ==========*/
#headerbanner{
display:none;

/*###
  position: fixed;
  height: 80px;
  width:100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background:rgb(28, 46, 89, 0.97);
  color:#fff;
  text-align: center;
  padding: 20px;
  z-index: 100;
###*/
}

/*###
#headerbanner.UpMove{
  animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime{
  from {
    opacity: 1;
  transform: translateY(0);
  }
  to {
    opacity: 0;
  transform: translateY(-100px);
  }
}

#headerbanner.DownMove{
  animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime{
  from {
    opacity: 0;
  transform: translateY(-100px);
  }
  to {
    opacity: 1;
  transform: translateY(0);
  }
}
###*/

/*========== スライドショー ==========*/
#slider {
    width: 100%;
    height: 100vh;
  position: fixed;
  z-index: -1;
  opacity: 0.2;

}

/*========== メニュー ==========*/
#g-nav.panelactive{
  position:fixed;
  z-index: 999;
  top: 0;
  width:100%;
  height: 100vh;
}

.circle-bg{
  position: fixed;
  z-index:998;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: rgb(0, 123, 187, 0.97);
  transform: scale(0);  right:-50px;
  top:-50px;
  transition: all .3s;/*Duration*/
}

.circle-bg.circleactive{
  transform: scale(50);
}

#g-nav-list{
  display: none;
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

#g-nav.panelactive #g-nav-list{
     display: block;
}

#g-nav ul {
  opacity: 0;
  position: absolute;
  z-index: 999;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
}

#g-nav.panelactive ul {
  opacity:1;
}

#g-nav.panelactive ul li{
  animation-name:gnaviAnime;
  animation-duration:1s;
  animation-delay:.2s;/*Delay*/
  animation-fill-mode:forwards;
  opacity:0;
}
@keyframes gnaviAnime{
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

#g-nav li{
  padding: 10px;
  font-size: 14px;

/*###
  padding:20px;
  font-size: 16px;
###*/

  text-align: center; 
  list-style: none;
  font-weight: bold;
  letter-spacing: 0.1em;
}

#g-nav li a{
  color: #a0d8ef;
  text-decoration: none;
  display: block;
}

.hovact a:hover {
  color: #ffffff !important;
}

.hovact a:active {
  color: #ffffff !important;
}

li.herenow a {
  color: #fff !important; /*現在地color*/
}

li.notyet {
  color: #274a78; /*メニュー準備中color*/
  list-style: none;
}

/*========== メニューボタン ==========*/
.openbtn1{
  top: 3px;
  right: 0px;

/*###
  top:13px;
  right: 10px;
###*/
  width: 50px;
  height:50px;
  position:fixed;
  z-index: 1000;
  cursor: pointer;
}

.openbtn1 span{
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #a0d8ef;
  width: 45%;
}

.openbtn1 span:nth-of-type(1) {
  top:15px; 
}
.openbtn1 span:nth-of-type(2) {
  top:23px;
}
.openbtn1 span:nth-of-type(3) {
  top:31px;
}
.openbtn1.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
  background-color: #a0d8ef;
}
.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}
.openbtn1.active span:nth-of-type(3){
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
  background-color: #a0d8ef;
}

/*========== タブインデックス ==========*/
table#tabtable {
width:100%;
}

.ptabwrap {
margin: 50px 0 0;

/*###margin: 130px 0 0;###*/
display:flex;
justify-content: center;
}

.ptab {
  height: 25px;
  width: 25px;
  line-height: 25px;
  font-size: 16pt;

/*###
  height: 40px;
  width: 50px;
  line-height: 40px;
  font-size: 20pt;
###*/
  color: #274a78;
  border-bottom: 2px solid #274a78;
  text-align: center;
  cursor: pointer;
  margin: 0 0 30px 0;
}

.ptab a {
  text-decoration: none;
  color: #274a78 !important;
}


.selected {
  background-color: #274a78;
}

.selected a {
  color: #fff !important;
}

/*###
div#footermargin {
height:400px;
}
###*/

/*========== Logo ==========*/
img#topbannerlogo { /*### 追加 ###*/
width: 240px;
}

.logobox {
display: none;

/*###
  position: fixed;
  top: 15px;
  left: 60px;
  z-index: 101;
  opacity: 0;
###*/
}

/*========== JP/EN ==========*/
.text_box_top_right {
  top: 15px;
  right: 45px;
  font-size: 12px;

/*###
  top: 20px;
  right: 70px;
 ###*/
  position: fixed;
  z-index:101;
}

.lang_box li {
  display: inline-block;
  color: #a0d8ef !important;
}

.lang_link {
margin: 0 10px 0 0;

/*###
  font-size: 1.0rem;
  margin: .15em;
  display: block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 50%;
  text-align: center;
  position: relative;
###*/
  text-decoration: none;
}

/*========== SNSアイコン ==========*/
/* Link Color */
a:link { color: #a0d8ef; }
a:visited { color: #a0d8ef; }
a:hover { color: #007bbb; }
a:active { color: #a0d8ef; }

.text_box_bottom_left {
bottom: 15px;
left: 5px;

/*###
  bottom: 30px;
  left: 30px;
###*/
  position: fixed;
  z-index:101;
}

.sns_box li {
  display: inline-block;
}

.sns_link {
margin: 0px;

/*###  margin: .15em;###*/
  display: block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 50%;
  text-align: center;
  position: relative;
  font-size: 1.0rem;
  background: rgba(39, 74, 120, 0);
  transition: transform ease-out 0.2s;
  color: #a0d8ef !important;
}

/*========== Twitter ==========*/
.fab.fa-twitter {
  display: inline-block;
}

.icon_twitter::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  transform: scale(1);
  opacity: 0 !iportant;
}

.icon_twitter:hover {
  background: #00b0ed;
  transform: scale(1.1);
  color: #fff !important;
}

/*========== Instagram ==========*/
.fab.fa-instagram {
  display: inline-block;
}

.icon_instagram::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  transform: scale(1);
}

.icon_instagram:hover {
  background: radial-gradient(
    circle farthest-corner at 32% 106%,
    rgb(255, 225, 125) 0%,
    rgb(255, 205, 105) 10%,
    rgb(250, 145, 55) 28%,
    rgb(235, 65, 65) 42%,
    transparent 82%
    ),
  linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
  transform: scale(1.1);
  color: #fff !important;
}

/*========== トップボタン ==========*/
#re-top {
bottom: 10px;
right: 10px;

/*###
  bottom:45px;
  right:30px;
###*/
  display: none ;
  position:fixed;
  z-index:101;
  background:transparent
  transform: scale(1);
}

#re-top:hover #re-topButton {
  background: #007bbb; /*トップボタンhover color*/
  color: #ffffff !important;
  transform: scale(1.1);
}

#re-top:active #re-topButton {
  background: #a0d8ef; /*トップボタンactive color*/
  color: #ffffff !important;
  transform: scale(1);
}

#re-topButton {
  background: rgb(38, 72, 117, 0.97); /*トップボタン color*/

/*###  background: rgb(17, 53, 99, 0.97); ###*/
  display:block; 
  color: #a0d8ef !important;
  position:relative;
  opacity: 100%;
  text-decoration:none;
  font-weight:bold;
  font-size:12px;
  font-family:"Arial", "Avenir", "YuGothic", "Yu Gothic","游ゴシック","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif !important;
  width:40px;
  height:40px;
  border-radius: 50%;
  text-align:center;
  line-height:24px;
  padding-top:30px;
  box-sizing:border-box;
}

#re-topButton:before {
  content:'\02227';
  position:absolute;
  top:50%;
  transform: scale(2, 1) translate(0, -50%);
  left:0;
  width:100%;
  text-align:center;
  font-size:20px;
}

/*========= フッター ===============*/
#article {
	margin-bottom: 0px;
}

#footer {
	overflow: hidden;
	position: fixed;
	margin: 0;
	padding: 0;
	width: 100%;
	bottom: 0;
	z-index: -10; <!-- important in accordance with pagenation -->
}

#slidebar {
	height: 200px;

/*###
	height: 400px;
	background-image: url(mt.png);
###*/
	background: #113565;
	color: #fff;
	width: 100%;
	background-repeat: no-repeat center bottom;
	background-size: cover;
	background-image: url(mt_s.png);/* phone */
}

#slidebar-in {
	padding: 0px;
}

#footer a {
	color: #a0d8ef;
	text-decoration: none;
	cursor: pointer;
}

a.herenow {
  color: #fff !important; /*現在地color*/
}

div.notyet {
  color: #007bbb; /*メニュー準備中color*/
}

#footer a:hover {
  color: #ffffff !important;
}

#footer a:active {
  color: #ffffff !important;
}


#foottable {
	height: 180px;
	max-width: 560px;
	margin: 0;

/*###
	height: 360px;
	max-width: 850px;
	margin: 0 20px;
###*/
}

.footcell1 {
display: none;

/*###	width: 50%;
	height: auto;
	padding: 0 10px 30px 0;
	text-align: left;
	vertical-align: bottom;
###*/
}

.footcell2 {
	padding: 0 50px 0 0;
	text-align: right;

/*###
	padding: 0 0 50px 10px;
	text-align: right;
###*/
	width: 50%;
	height: auto;
	vertical-align: bottom;
	font-size: 13px;
	color: #a0d8ef;
}

#mountainslogo {
margin-bottom: 10px;

/*###margin-bottom: 20px;###*/
}

#copyright {
	color: #007bbb;
	font-size: 8px;/*phone版のみ*/
	text-align: center;
	vertical-align:bottom;
	height: 40px;
}