@charset "utf-8";

/*
div#grid {
  float: left;
  margin: 100px 10px 100px 100px;
}
*/
div#devbar {
  float:left;
  margin: 100px 10px;
}
#grid table {
  border-collapse: collapse;
}
#grid table td {
  border: 0 none;
  padding: 0;
}
#grid table td div {
  color: #FFFFFF;
  display: block;
  line-height: 1.1;
  overflow: hidden;
  padding: 0;
  position: relative;
  text-align: center;
}
#grid .slide {
  background-color: #000000;
/*  font-family: Helvetica,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif; */
  font-family: '游ゴシック',YuGothic,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Helvetica,Arial,clean,sans-serif; /* 2014/08/08 mod yasukawa 游ゴシックの導入 */
  left: 0;
  margin: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  z-index: 1;
}
#grid .slide.current {
  z-index: 10;
}
#grid .slide .sans-serif {
  font-family: Helvetica,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
}
#grid .slide .serif {
  font-family: "Times New Roman",Times,Georgia,"MS P明朝","Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3",serif;
}
#grid .slide .white {
  color: #FFFFFF;
}
#grid .slide .black {
  color: #000000;
}
#grid .slide div.disprow1 {
  padding: 0 5px;
  margin: -2px 0 0 0; /* 2014/08/08 add yasukawa html の div#slide ul li に直書きの padding: 4.5px 0px; の意図が分からずいじりたくなかったので、ここのネガディブmarginで対応 */
/*  height: 115px; */
  height: 113px; /* 2014/08/08 mod yasukawa */
/*  overflow: hidden; */
  overflow: visible; /* 2014/08/08 mod yasukawa 文字数が多いとdetailboxの領域の下に隠れてしまうため */
}
#grid .slide div.disprow2 {
  padding: 0 5px;
  height: 253px;
  overflow: hidden;
}
#grid .slide div.disprow3 {
  padding: 0 5px;
  height: 391px;
  overflow: hidden;
}
#grid .slide p {
  font-size: 10px;
/*  padding-bottom: 5px; */ /* 2014/08/08 del yasukawa */
}
#grid .slide p.date {
  font-size: 14px; 
  color: #FFFFFF;
/*  opacity: 0.9; */
  font-family: 'Lato','游ゴシック',YuGothic,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Helvetica,Arial,clean,sans-serif; /* 2014/08/08 add yasukawa 日付欄は数字がメインなので、数字が見やすいフォントをGoogle Fontsから選んだ */
  letter-spacing: 0.2em; /* 2014/08/08 add yasukawa */
  padding: 0 0 5px 0; /* 2014/08/08 add yasukawa */
  margin: 0; /* 2014/08/08 add yasukawa */
  text-shadow: 0 0 5px #000000; /* 2014/08/08 add yasukawa */
  filter: progid:DXImageTransform.Microsoft.Glow(color=#444444,strength=1); /* 2014/08/08 add yasukawa ie対応 */
}
#grid .slide h3 {
/*  font-size: 18px; */
  font-size: 20px; /* 2014/08/08 mod yasukawa */
  padding: 0 0 3px 0; /* 2014/08/08 add yasukawa */
/*  margin: 5px 0; */
  margin: 0; /* 2014/08/08 mod yasukawa */
  color: #FFFFFF;
/*  opacity: 0.9; */
  font-weight: bold; /* 2014/08/08 add yasukawa */
  line-height: 1.1; /* 2014/08/08 add yasukawa */
  text-shadow: 0 0 4px #000000; /* 2014/08/08 add yasukawa */
  filter: progid:DXImageTransform.Microsoft.Glow(color=#444444,strength=1); /* 2014/08/08 add yasukawa ie対応 */
}
#grid .slide p.desc {
/*  font-size: 18px;  */
/*  font-size: 14px; */
  font-size: 12px; /* 2014/08/08 mod yasukawa */
  padding: 0; /* 2014/08/08 add yasukawa */
/*  margin: 5px 0; */
  margin: 0 12px; /* 2014/08/08 mod yasukawa 左右の矢印に被らないように */
  color: #FFFFFF;
/*  opacity: 0.9; */
  text-shadow: 0 0 5px #000000; /* 2014/08/08 add yasukawa */
  filter: progid:DXImageTransform.Microsoft.Glow(color=#444444,strength=1); /* 2014/08/08 add yasukawa ie対応 */
}
#grid .slide p.detailbox {
/*  position: relative;
  top: 35px;  */
}
#grid .slide a {
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.5); /* 2014/08/08 add yasukawa */
  color: #FFFFFF;
/*  font-size: 13px; */
  font-size: 14px; /* 2014/08/08 mod yasukawa */
/*  font-weight: bold; */
/*  padding: 2px 15px; */
  padding: 5px 20px 10px; /* 2014/08/08 mod yasukawa */
  margin: 0; /* 2014/08/08 add yasukawa */
  text-decoration: none;
  font-family: 'Lato','游ゴシック',YuGothic,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Helvetica,Arial,clean,sans-serif; /* 2014/08/08 mod yasukawa p.date と同様 */
  box-shadow: 0 1px 3px rgba(255, 255, 255, 0.3) inset; /* 2014/08/08 add yasukawa */
  border-radius: 25px 25px 0 0; /* 2014/08/08 add yasukawa */
  position: relative; /* 2014/08/08 add yasukawa 文字数が多くdetailbox領域に被る場合に、ボタンを最前面に表示するため */
  z-index: 10; /* 2014/08/08 add yasukawa 文字数が多くdetailbox領域に被る場合に、ボタンを最前面に表示するため */
  top: 2px; /* 2014/08/08 add yasukawa 非hover時は少し引っ込めておく */
  transition-duration: 0.3s;  /* 2014/08/08 add yasukawa 戻るときは少し遅めに */
}

/* 2014/08/08 add-new yasukawa パネルhover時に少し浮き上がる動き */
#grid .slide:hover a {
  background-color: rgba(0, 0, 0, 0.7);
  padding-top: 7px;
  top: -2px;
  transition-duration: 0.1s; /* hover時は早めに */
}

/* 2014/08/08 add-new yasukawa ボタンhover時に元デザインの平面真っ黒ボタンに戻ると同時に、領域と位置を操作して動きをつけた */
#grid .slide a:hover {
  background-color: #000000;
  padding: 10px 22px 14px;
  text-decoration: underline;
  box-shadow: none;
  border-radius: 0;
  top: -5px;
  transition-duration: 0.1s; /* hover時は早めに */
}

/* 2014/08/08 add-new yasukawa パネルhover時にClick吹き出し、一旦保留 */
/*#grid .slide:hover a:after {
  content: "Click!";
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
  color: #222;
  background-color: #e6b028;
  padding: 1px 10px;
  border: 2px solid #dbaa37;
  border-radius: 12px;
  box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.5), inset 0px 2px 4px rgba(255, 255, 255, 0.3);
  position: absolute;
  top: -17px;
  right: -10px;
  filter: alpha(opacity=60);
  -ms-filter: "alpha(opacity=60)";
  opacity: 0.6; 
}*/


/* 2014/08/08 add-new yasukawa ボタンhover時にClick吹き出し */
html>/**/body #grid .slide a:hover:after {
  text-decoration: underline;
  /* IE（最新も含む）で、hover時にafterの"Click"にまで、白色の下線が出てしまう不具合が発生。IEのみ、せめて黒色の下線を表示させることで対応しようと考えCSSハックを検討したが、下記の "none !important" と併記するとIEで下線が消えたので解決。 */
}
#grid .slide a:hover:after {
  content: "Click!";
  font-size: 12px;
  font-weight: bold;
  text-decoration: none !important; /* 上記のCSSハックに関連 */
  line-height: 1.5;
  letter-spacing: 0.2em;
  color: #222;
  background-color: #e6b028;
  padding: 2px 12px;
  box-shadow:
               0px 1px 0 #b0861b,
              -1px 2px 0 #b0861b,
              -2px 3px 0 #b0861b,
              -1px 0px 0 #b0861b,
              -2px 1px 0 #b0861b,
              -3px 2px 0 #b0861b;
  position: absolute;
  top: -20px;
  right: -10px;
/* パネルhover時の吹き出しを有効時に有効
  border-radius: 0;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  opacity: 1;
*/
}

/* 2014/08/08 add-new yasukawa ボタンクリック時にヘコむアクション */
#grid .slide a:active:after {
  box-shadow: none;
  top: -17px;
  right: -7px; /* Chrome だと横移動がうまく動かず */
}

p#announce {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background-color: #49AFCD;
  background-image: linear-gradient(to bottom, #5BC0DE, #2F96B4);
  background-repeat: repeat-x;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) #A2A2A2;
  border-image: none;
  border-radius: 4px 4px 4px 4px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
  color: #333333;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 0;
  padding: 4px 12px;
  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
}
p#announce a#announce-info {
  background-repeat: repeat-x;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  color: #FFFFFF;
  font-family: Helvetica,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

p.bx-controls-direction {
}
.bx-controls-direction a, .bx-controls-direction span {
/*  height: 32px; */
  height: 49px; /* 2014/08/08 mod yasukawa 新しい矢印画像に変更のため */
/*  margin-top: -16px;  */
/*  margin-top: 25px; */ /* 2014/08/08 del yasukawa */
  outline: 0 none;
  position: absolute;
  text-indent: -9999px;
/*  top: 50%; */
  top: 20px; /* 2014/08/08 mod yasukawa 縦位置調整、h3の3行目あたりを狙っている */
/*  width: 32px; */
  width: 26px; /* 2014/08/08 mod yasukawa 新しい矢印画像に変更のため */
  z-index: 99;
  filter: alpha(opacity=50);        /* 2014/08/08 add yasukawa ie lt 8 */
  -ms-filter: "alpha(opacity=50)";  /* 2014/08/08 add yasukawa ie 8 */
  opacity: 0.5; /* 2014/08/08 add yasukawa */
  transition-duration: 0.2s; /* 2014/08/08 add yasukawa */
}
.bx-controls-direction .bx-next {
/*  background: url("images/controls.png") no-repeat scroll -43px -31px transparent; */
  background: url("images/controls-new-next.png") no-repeat scroll 20px 30px transparent; /* 2014/08/08 mod yasukawa 新しい矢印画像に変更、css spriteを使うと transition との関係で一瞬元画像が表示されるので、個別の画像に分けた */
/*  right: 10px; */
  right: -5px; /* 2014/08/08 mod yasukawa */
  padding: 30px 0 10px 20px; /* 2014/08/08 add yasukawa クリック範囲拡大のための処置、こちらボタンに被らないように下にはあまり伸ばさず */
}
.bx-controls-direction .bx-prev {
/*  background: url("images/controls.png") no-repeat scroll 0 -31px transparent; */
  background: url("images/controls-new-prev.png") no-repeat scroll 0 30px transparent; /* 2014/08/08 mod yasukawa 新しい矢印画像に変更、css spriteを使うと transition との関係で一瞬元画像が表示されるので、個別の画像に分けた */
/*  left: 10px; */
  left: -5px; /* 2014/08/08 mod yasukawa */
  padding: 30px 20px 10px 0; /* 2014/08/08 add yasukawa クリック範囲拡大のための処置、こちらボタンに被らないように下にはあまり伸ばさず */
}

 /* 2014/08/08 add yasukawa hover時に内側へ飛び出す動きと透過を無くす */
.bx-controls-direction .bx-next:hover,
.bx-controls-direction .bx-prev:hover {
  filter: alpha(opacity=100);        /* ie lt 8 */ 
  -ms-filter: "alpha(opacity=100)";  /* ie 8 */
  opacity: 1;
}
.bx-controls-direction .bx-next:hover {
  right: 0;
}
.bx-controls-direction .bx-prev:hover {
  left: 0;
}

/*
a {
  cursor: pointer;
  text-decoration: underline;
}
*/
.panelno {
/*  font-size: 24pt; */
  font-size: 45px; /* 2014/08/08 mod yasukawa */
/*  font-family: Georgia,Segoe UI Symbol,Helvetica,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif; */
  font-family: Cardo,'Times New Roman',serif; /* 2014/08/08 mod yasukawa Google Fonts 使用。数字がオールドスタイルで無く、イタリックがロゴのニュアンスに似ているものを選択 */
  font-style: italic; /*2014/08/08 add yasukawa */
  margin: 0;
  padding: 0 8px 0 0; /*2014/08/08 add yasukawa 斜体にすると右にはみ出るため*/  
  overflow: hidden;
  position: absolute;
/*  position: relative; */
/*  top: 95px; */
  bottom: -10px; /* 2014/08/08 mod yasukawa パネル連結時に表示位置がズレてしまっていたので、右下からの指定に変更 */
/*  left: 230px; */
  right: -4px; /* 2014/08/08 mod yasukawa パネル連結時に表示位置がズレてしまっていたので、右下からの指定に変更 */
  z-index: 90;
/*  opacity: 0.7; */
  filter: alpha(opacity=50);        /* 2014/08/08 add yasukawa ie lt 8 */
  -ms-filter: "alpha(opacity=50)";  /* 2014/08/08 add yasukawa ie 8 */
  opacity: 0.5; /* 2014/08/08 mod yasukawa */
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.btn:first-child {
}
p.btn span.btn-success {
  background-color: #5BB75B;
  background-image: -moz-linear-gradient(center top , #62C462, #51A351);
  background-repeat: repeat-x;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  color: #FFFFFF;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  font-family: Helvetica,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
}
.btn {
  border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25);
}
p.btn {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background-color: #5BB75B;
  background-image: -moz-linear-gradient(center top , #62C462, #51A351);
  background-repeat: repeat-x;
  border-color: #5BB75B #5BB75B #62C462;
  border-image: none;
  border-radius: 4px 4px 4px 4px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
  color: #333333;
  display: inline-block;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 0;
  padding: 4px 14px;
  text-align: center;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
}