@charset "utf-8";
/* 
スマホ・タブレット：320px - 660px
PC：800px以上
*/
/* 共通のスタイル */
.pagetop {
  padding: 5px;
  clear: both;
  text-align: right;
}
#datetxt {
  float: right;
}
/* スマホのスタイル */
#navi, .dr55, #navi, .bottompankuzu, .ggads, .editbutton, #logo, #header, #footerfornotprint, .dl70 {
  display: none;
}
#main {
  padding: 0;
}
#header {
  background: none;
  padding: 0 0 0 10px
}
body {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  background: none;
}
#footerfornotprint {
  margin: 0 -10px;
}
#footernavi {
  text-align: left;
  padding: 10px;
  width: 100%;
}
#footer {
  padding: 10px;
  margin: 10px 0;
}
#footer-m {
  display: block;
}
#footer-m ul {
  padding: 10px;
}
#footer-m ul:after {
  content: '';
  display: block;
  clear: both;
}
#footer-m li {
  float: left;
  display: block;
  padding: 0 .5em 0px;
  margin: 0 0 5px -1px;
  border: solid #999;
  border-width: 0 1px;
}
.nav_2 .naviheader2 {
  margin: 0 0 10px 0;
  background: #660000;
  border: solid #ccc;
  border-width: 1px 0 2px 1px;
}
.nav_2 .naviheader2:after {
  content: '';
  display: block;
  clear: both;
}
.nav_2 .naviheader2 li {
  width: 25%;
  float: left;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
}
.nav_2 .naviheader2 a {
  color: #fff;
  display: block;
  margin: 0;
  border: solid #ccc;
  border-width: 1px 1px 0 0;
  padding: 3px 0;
  background: #660000;
}
.ggsearch-m {
  padding-bottom: 10px;
  margin: -45px 2px 0px 0;
  text-align: right;
}
.formq {
  width: 35%;
  border: solid 1px #999;
}
.formk {}
#logo-m {
  border-top: solid 2px #660000;
  height: 50px;
  margin-bottom: 5px;
}
#logo-m img {
  display: block;
  max-width: 30%;
  height: 90%;
  background-size: contain;
  padding: 5px 5px 0;
}
#logo-m a span {
  display: none;
}
.menuanchorbutton {
  float: right;
  margin: -5em 0 0 0;
}
#content {
  float: none;
}
#content-inner {
  padding: 10px;
}
.bottompagenation {
  display: block;
  text-align: center;
  margin-bottom: 15px;
}
#header, #content-inner, #footer-inner {
  box-sizing: border-box;
}
#main, #mainaaa, #content, #content-inner, #i-content, #i-content-inner, #header-inner, #footer, #footer-inner {
  width: 100%;
}
#footernavi li {
  display: inline-block;
}
.copytxt {
  text-align: center;
  font-size: x-small;
}
.ggadsbordertxt {
  border-bottom: solid 1px #999;
  margin: 0 0 5px 0;
}
.ggads-side {
  text-align: center;
}
/* 一覧ページ用 */
.dl80 {
  width: 100%;
}
/* サイドバー */
#sidebar {
  display: block;
  margin: 0 auto 10px;
  padding: 10px;
  width: 100%;
  max-width: 100%;
  border: solid #ccc;
  border-width: 1px 0 1px 0;
  box-sizing: border-box;
}
#sidebar-inner {
  float: left;
  width: 300px;
  display: inline;
  margin: 0pt 10px;
}
#sidebar-inner {
  float: none;
  width: 100%;
  display: inline;
  text-align: left;
}
.dl25, .dr25 {
  width: 100%;
}
.dl25 img, .dr25 img {
  max-width: 300px;
  width: 100%
}
/* webページ用 */
.webpagetitle h1, .webpagetitle h1 img {
  width: 100%;
  height: auto
}
/* タブレットのスタイル */
@media all and (min-width:480px) {}
/* PCのスタイル */
@media all and (min-width:660px) {
  #main {
    max-width: 980px;
  }
  #navi, .dr55, #naviheader1, #sidebar, .bottompankuzu, .ggads, #logo, #header, #footerfornotprint, .dl70 {
    display: block;
  }
  body {
    padding: 0;
    background: transparent url(//www.piano.or.jp/css/images/bodybgline.png) repeat-x scroll 0 0;
  }
  #header-inner {
    clear: both;
    width: 80em;
    display: inline-block;
  }
  #footerfornotprint {
    margin: 0;
  }
  #footernavi {
    padding: 0px;
    text-align: center;
  }
  #sidebar {
    float: left;
    width: 320px;
    display: inline;
  }
  #sidebar-inner {
    float: left;
    width: 300px;
    display: inline;
    margin: 0pt 10px;
  }
  .nav_2, .menuanchorbutton, .bottompagenation, #footer-m {
    display: none;
  }
  #main {
    width: 980px;
    margin: 0 auto;
    text-align: left;
    border: 0;
    padding: 0;
  }
  #content {
    float: left;
    width: 660px;
    display: inline;
  }
  #content-inner {
    float: left;
    width: 650px;
    display: inline;
    padding: 0;
  }
  #mainaaa {
    margin: 0pt auto;
    text-align: left;
    width: 980px;
  }
  #i-content {
    float: left;
    width: 980px;
    display: inline;
  }
  #i-content-inner {
    float: left;
    width: 970px;
    display: inline;
  }
  #footer {
    margin: 10px auto;
    width: 100%;
  }
  #footer-inner {
    width: 80em;
  }
  .copytxt {
    font-size: 10pt;
    padding: 10px 0;
  }
  .editbutton {
    display: block;
    margin: 0 0 10px 0;
  }
  .editbutton a {
    display: block;
    float: right;
  }
  .ggads {
    padding: 5px;
    background: #eee;
    box-sizing: border-box;
  }
  .ggadswebbottom {
    width: 49%;
    float: left;
  }
  .dl80, .dr80 {
    width: 960px;
  }
  /*  サイドバー */
  #sidebar {
    float: left;
    width: 320px;
    display: inline;
    padding: 0;
    border: 0;
  }
  #sidebar-inner {
    float: left;
    width: 300px;
    display: inline;
    margin: 0pt 10px;
  }
  .dl25, .dr25 {
    width: 300px;
  }
  .dl25 img, .dr25 img {
    max-width: 300px;
    width: 100%
  }
  /*  webページのスタイル */
  .webpagetitle h1, .webpagetitle h1 img {
    width: 650px;
    height: 100px;
  }
}
.rightbox {
  display: none;
}
.leftbox {
  margin: 0 10px 0 0;
  padding: 10px;
  width: 100%;
}
.titleimg {
  margin-bottom: 10px;
}
.titleimg img {
  width: 100%;
  height: auto
}
/* 新着3件 */
.blogarchive1 .box-entry {
  margin: 0 0 20px;
  padding: 0 0 20px;
  border-bottom: solid 1px #ccc;
}
.ba1-title {
  margin: 0 0 5px;
  color: #fff;
  padding: 10px 5px 8px;
  background: #666;
  font-size: 11pt;
}
.ba1-title span {
  font-weight: normal;
  font-size: 8pt;
}
.ba1-title a {
  color: #fff;
}
/* アーカイブ20件 */
.blogarchive1, .blogarchive2 {
  margin: 0 0 20px 0;
}
.blogarchive2 ul.navi4 li {
  font-size: 10pt;
}
@media all and (min-width:660px) {
  .leftbox {
    margin: 0 10px 0 0;
    padding: 10px;
    width: 650px;
  }
  .leftbox, .rightbox {
    display: block;
  }
  .publicnavi2 {
    display: none;
  }
  .leftbox, .rightbox {
    float: left;
  }
  .rightbox {
    width: 300px;
  }
  .leftbox {
    padding: 0px
  }
  /* サイドバー */
  ul.publicnavi {
    margin: 1px 0 20px;
  }
  ul.publicnavi li {
    margin: -1px 0 0;
    border: solid 1px #999;
  }
  ul.publicnavi li a {
    display: block;
    padding: 10px 10px 7px 10px;
    font-size: 14pt;
    border: solid 1px #ccc;
    text-decoration: none;
  }
  ul.publicnavi li a small, ul.publicnavi li a.enquete small {
    font-weight: normal;
    display: inline-block;
  }
  ul.publicnavi li a i {
    padding-right: 5px;
  }
  ul.publicnavi li {
    color: #606060 !important;
    border: solid 1px #b7b7b7;
    background: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
    background: -moz-linear-gradient(top, #fff, #ededed);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
  }
  ul.publicnavi li:hover {
    background: #b61318;
    background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
    background: -moz-linear-gradient(top, #c9151b, #a11115);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
  }
  ul.publicnavi li:hover a, ul.publicnavi li.on a {
    color: #fff;
  }
  ul.publicnavi li a.enquete {
    font-size: 13pt;
    font-weight: bold;
    text-align: center;
  }
  ul.publicnavi li.on {
    background: #616161;
    background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
    background: -moz-linear-gradient(top, #757575, #4b4b4b);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
    font-size: 11pt;
  }
}
/* common */
.ba1-title, ul.publicnavi, .txttop {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}
/* モバイル用セカンドナビ */
.nav_2second_menubtn {
  display: block;
}
.togmenu, .menubtn {
  display: none;
}
.menubtn {
  padding: 5px 10px;
  background: #34C6CD;
  color: #fff;
}
#menusecond ul {
  margin: 0;
  padding: 0;
  background: #ccc;
}
#menusecond li {
  font-size: 12pt;
  list-style: none;
  border-top: 2px solid #fff;
}
#menusecond li a {
  padding: 5px 10px;
  display: block;
  text-decoration: none;
  color: #666;
  border: solid #999;
  border-width: 1px 0;
  background: rgb(255, 255, 255);
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(229, 229, 229, 1)));
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=0);
}
#menusecond li a:hover {
  background: #ffcccc;
}

@media only screen and (min-width: 660px) {
  .nav_2second_menubtn, #menusecond {
    display: none;
  }
  #menusecond li {
    display: inline-block;
    border: none;
  }
}
/* print */
@media print {
  .nav_2, #footer-m, .ggadsbordertxt, .ggads-side, .ggads, .nav_2second {
    display: none;
  }
}
a[href $='.pdf'] {
  padding: 0;
  background: none;
}