@charset "utf-8";

html {
  width: 100%;
  height:100%;
  padding: 0px;
  margin: 0px;
  overflow-x: hidden;
}

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;
}

/*========== iframe ==========*/
div#maincontent {
margin: 80px 0 400px 0;
}

iframe#newspart {
width: 100%;
height: 2000px;
}
/*========== スライドヘッダー ==========*/
#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);
  }
}
###*/

/*========== メニュー ==========*/
#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;
}

/*========== 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;###*/
/*###margin-right: 20px; EN版のみ###*/
}

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