@charset "utf-8";
/* ---------------------------------
   TOKYO MAS - modernized legacy css
   original design preserved
---------------------------------- */

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  background:#e1e5fe;
  color:#333;
  font-family:
    "Hiragino Kaku Gothic Pro",
    "Yu Gothic",
    Meiryo,
    sans-serif;
  font-size:12px;
  text-align:center;
  overflow-x: hidden;
}
/* -----------------------------
   common
------------------------------ */
img{
  border:0;
  vertical-align:top;
}

a{
  text-decoration:none;
  outline:none;
}

iframe{
  border:none;
  overflow-x: hidden;
}

/*ボタンの設定*/
::-webkit-scrollbar-button:single-button {
background-color: rgba(120, 170, 210,0.5);
display: block;
border-style: solid;
height: 12px;
width: 12px;
}
/*縦のスクロール*/
/* Up */
::-webkit-scrollbar-button:single-button:vertical:decrement {
border-top: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid blue;
border-left: 10px solid transparent;
}
/* Down */
::-webkit-scrollbar-button:single-button:vertical:increment {
border-top: 10px solid blue;
border-right: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent;
}
/*横のスクロール*/
/* Up */
::-webkit-scrollbar-button:single-button:horizontal:increment {
border-top: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid blue;
}
/* Down */
::-webkit-scrollbar-button:single-button:horizontal:decrement {
border-top: 10px solid transparent;
border-right: 10px solid blue;
border-bottom: 10px solid transparent;
border-left: 10px solid transparent ;
}
/* -----------------------------
   loader
------------------------------ */
#loader{
  width:940px;
  height:900px;
  margin:0 auto;
  padding-top:380px;
}

#loimg{
  width:150px;
  margin:0 auto;
}

/* -----------------------------
   layout
------------------------------ */
#wrapper,
#wrapper-1{
  width:940px;
  margin:0 auto;
  position:relative;
  background:#fff;
}

#wrapper{
  min-height:1000px;
}

#wrapper-1{
  z-index:10;
}

#wrapper-2{
  position:absolute;
  top:100px;
  left:0;
  /*
  width:0.1px;
  height:0.1px;
  z-index:1;
  */
  background:url("../sozai/b-50.png");
  transition:all .35s ease;
  z-index: 0;
}

/* -----------------------------
   top
------------------------------ */
#topbox{
  width:940px;
  height:70px;
}

#but-over{
  position:absolute;
  top:70px;
  left:0;
  width:134px;
  height:30px;
  display:none;
  z-index:5;
}

#lin{
  position:absolute;
  top:100px;
  left:0;
  width:940px;
  height:3px;
  z-index:900;
}

/* -----------------------------
   menu bar
------------------------------ */
#s-bar{
  width:940px;
  height:30px;
}

.bbox,
#bbox2{
  float:left;
  height:30px;
}

.bbox{
  width:134px;
}

#bbox2{
  width:136px;
}

/* -----------------------------
   frame
------------------------------ */
#myframe{
  width:930px;
  height:860px;
  border:none;
  overflow:hidden;
}
#subm{
  width:940px;
  min-height:780px;
  padding-top: 100px;
}

/* -----------------------------
   footer
------------------------------ */
#footer{
  width:940px;
  height:55px;
  clear:both;
}

.g-line{
  width:940px;
  height:5px;
}

.fo-1,
.fo-2,
.fo-3{
  float:left;
  height:30px;
}

.fo-1{ width:460px; }
.fo-2{ width:140px; }
.fo-3{ width:50px; }

/* -----------------------------
   tooltip
------------------------------ */
.tx1{
  position:absolute;
  top:105px;
  width:268px;
  font-size: 18px;
  font-weight: 600;
  padding:8px;
  text-align:left;
  line-height:1.45;
  color:#fff;
  background:#00f;
  border:3px ridge #009;
  border-radius:6px;
  opacity:.88;

  max-height:0;
  overflow:hidden;
  transform:translateY(-8px);
  transition:
    max-height .35s ease,
    opacity .35s ease,
    transform .35s ease;
  opacity:0;
  z-index:900;
  
  box-shadow: 10px 10px 15px -10px gray;
}

.tx1.is-open{
  max-height:300px;
  opacity:.88;
  transform:translateY(0);
}

#suM1{ left:0; }
#suM2{ left:134px; }
#suM3{ left:268px; }
#suM4{ left:402px; }
#suM5{ left:536px; }
#suM6{ left:655px; }
#suM7{ right:0; }
#suM9{
  top:150px;
  right:30px;
}
#suM99{
  top:60px;
  right:50px;
}

/* -----------------------------
   page top
------------------------------ */
#pagetop{
  position:absolute;
  right:10px;
  bottom:20px;
  width:100px;
  height:30px;
  z-index:999;

  opacity:0;
  pointer-events:none;
  transition:opacity .3s ease;
}

#pagetop.is-visible{
  opacity:1;
  pointer-events:auto;
}

/* -----------------------------
   新着情報
------------------------------ */
#sinchyaku{
  position:absolute;
  top:110px;
  right:30px;
  width:134px;
  height:30px;
  z-index:700;
  /*display:none;*/
}

#close-b{
  position:absolute;
  top:120px;
  right:110px;
  width:96px;
  height:24px;
  z-index:994;
  display:none;
}

#s-panel,
#s-pane12{
  position:absolute;
  left:40px;
  width:860px;
  height:300px;
  border-radius:15px;

  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:all .35s ease;
}

#s-panel{
  top:110px;
  background:#00c;
  border:3px ridge #009;
  z-index:992;
}

#s-pane12{
  top:140px;
  left:70px;
  background:#000;
  opacity:0;
  z-index:991;
}

#s-panel.is-open,
#s-pane12.is-open{
  max-height:300px;
  opacity:1;
}

#s-pane12.is-open{
  opacity:.4;
}

#infobox{
  width:790px;
  height:240px;
  margin:40px auto 0;
  background:#fff;
  border:3px ridge #009;
  border-radius:15px;
}

#infowaku{
  width:760px;
  height:190px;
  margin:0 auto;
  overflow-y:auto;
}

/* -----------------------------
   close button popup
------------------------------ */
#closeB{
  position:absolute;
  top:20px;
  right:40px;
  width:150px;
  height:30px;
  z-index: 900;
}

/* -----------------------------
   responsive (light support)
------------------------------ */
@media (max-width:980px){

  #wrapper,
  #wrapper-1,
  #wrapper-2,
  #loader{
    width:100%;
  }

  img{
    max-width:100%;
    height:auto;
  }

  #myframe,
  #subm{
    width:100%;
  }
}

.blink-soft {
  animation: blinkSoft 3.0s infinite ease-in-out;
}

@keyframes blinkSoft {
  0%   { opacity: 1; filter: brightness(1); }
  50%  { opacity: 0.6; filter: brightness(1.3); }
  100% { opacity: 1; filter: brightness(1); }
}