body {
  width: 100%;
  font-family: Helvetica, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.8em;
  color: #111111;
}
body a {
  text-decoration: none;
  color: #888;
}
body a:hover {
  color: #111;
}
body ol {
  list-style-type: decimal;
  list-style-position: outside;
}
body table {
  border: 1px solid #ddd;
}
body table th, body table td {
  border: 1px solid #ddd;
}å

.pagelink:hover {
  cursor: pointer;
}

.btn {
  border: 1px solid #DDD;
  border-top: 1px solid #EEE;
  border-bottom: 1px solid #BBB;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  background-color: #e6e6e6;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, white), color-stop(100%, #e6e6e6));
  background-image: -webkit-linear-gradient(white, #e6e6e6);
  background-image: linear-gradient(#ffffff, #e6e6e6);
  background: -moz-linear-gradient(top, white, #e6e6e6);
  display: inline-block;
  padding: 2px 12px;
  color: #333333;
  font-weight: bold;
  cursor: pointer;
}
.btn:hover, #body .contents section#features .tab .btns .btn.actived {
  background-image: none;
  background-color: #e6e6e6;
}
.btn:active, #body .contents section#features .tab .btns .btn.actived {
  -webkit-box-shadow: inset 0 3px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 3px 3px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 3px 3px rgba(0, 0, 0, 0.15);
  border-bottom: 1px solid #CCC;
}

#mbBottom #mbNextLink,
#mbBottom #mbPrevLink {
  display: none;
}
#mbBottom #mbCloseLink:hover {
  text-decoration: none;
}

#header {
  width: 100%;
  z-index: 1000;
  position: absolute;
  top: 0;
  border-bottom: 1px solid #CECECE;
  background: -webkit-linear-gradient(#f3f3f3 20%, white 100%);
  background: -moz-linear-gradient(#f3f3f3 20%, white 100%);
  background: -o-linear-gradient(#f3f3f3 20%, white 100%);
  background: linear-gradient(#f3f3f3 20%, #ffffff 100%);
  background: -ms-linear-gradient(#f3f3f3 20%, white 100%);
}
#header.fix {
  position: fixed;
  top: -194px;
  -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 14px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.3);
}
#header.fix:before, #header.fix:after {
  content: "";
  position: absolute;
  z-index: -2;
}
#header h1 {
  width: 100%;
  text-align: center;
  padding: 26px 0 8px;
}
#header nav ul {
  overflow: hidden;
  *zoom: 1;
  width: 800px;
  margin: 0 auto;
  padding: 15px 0 10px;
}
#header nav ul li {
  float: left;
  height: 34px;
  width: 159px;
  font-size: 13px;
  border-left: 1px solid #979799;
}
#header nav ul li:last-child {
  width: 158px;
  border-right: 1px solid #979799;
}
#header nav ul li a {
  font-size: 1px;
  text-indent: 100%;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  width: 159px;
  height: 34px;
  cursor: pointer;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition-duration: 250ms;
  -moz-transition-duration: 250ms;
  -o-transition-duration: 250ms;
  transition-duration: 250ms;
}
#header nav ul li a.features {
  background-image: url(../img/nav-features.png);
}
#header nav ul li a.introduction {
  background-image: url(../img/nav-intro.png);
}
#header nav ul li a.video {
  background-image: url(../img/nav-video.png);
}
#header nav ul li a.download {
  background-image: url(../img/nav-download.png);
}
#header nav ul li a.contact {
  background-image: url(../img/nav-contact.png);
}
#header nav ul li a:hover {
  opacity: 1;
  -webkit-transition-duration: 500ms;
  -moz-transition-duration: 500ms;
  -o-transition-duration: 500ms;
  transition-duration: 500ms;
}
#header nav ul li a span {
  display: none;
}

#body .main {
  margin-top: 248px;
  width: 100%;
  background-color: #000;
}
#body .main div {
  position: relative;
  width: 800px;
  height: 450px;
  margin: 0 auto;
}
#body .main div #cover {
  position: absolute;
  z-index: 10;
  background-image: url(../img/cover.jpg);
  background-repeat: no-repeat;
  background-position: center;
  width: 1024px;
  left: -112px;
}
#body .main div #cover.waiting {
  background-image: url(../img/loader.gif);
  background-color: black;
}
#body .main div #cover.waiting #playBtn {
  display: none !important;
}
#body .main div #cover #playBtn {
  width: 100%;
  height: 100%;
  background-image: url(../img/playbtn.png);
  background-repeat: no-repeat;
  background-position: 750px center;
  -webkit-transition-duration: 300ms;
  -moz-transition-duration: 300ms;
  -o-transition-duration: 300ms;
  transition-duration: 300ms;
}
#body .main div #cover #playBtn:hover {
  cursor: pointer;
  background-image: url(../img/playbtn_on.png);
  -webkit-transition-duration: 250ms;
  -moz-transition-duration: 250ms;
  -o-transition-duration: 250ms;
  transition-duration: 250ms;
}
#body .main div iframe {
  position: absolute;
  z-index: 1;
}
#body .contents_header {
  background: -webkit-linear-gradient(#f1f1f1 25%, white 100%);
  background: -moz-linear-gradient(#f1f1f1 25%, white 100%);
  background: -o-linear-gradient(#f1f1f1 25%, white 100%);
  background: linear-gradient(#f1f1f1 25%, #ffffff 100%);
  background: -ms-linear-gradient(#f1f1f1 25%, white 100%);
  border-top: 1px #FFF solid;
}
#body .contents_header section {
  width: 800px;
  margin: 0 auto;
  border-top: 1px solid #02cecc;
  overflow: hidden;
  *zoom: 1;
  margin-bottom: 40px;
}
#body .contents_header section h3 {
  margin: 16px 0 20px 0;
  color: #02cecc;
  font-weight: normal;
  font-size: 13px;
}
#body .contents_header section:first-child {
  border-top: 0;
  color: #747474;
}
#body .contents_header section:first-child h2 {
  margin: 37px 0 36px;
  display: inline-block;
}
#body .contents_header section:first-child .appstore {
  float: right;
  position: relative;
  top: 29px;
  -webkit-transition-duration: 250ms;
  -moz-transition-duration: 250ms;
  -o-transition-duration: 250ms;
  transition-duration: 250ms;
}
#body .contents_header section:first-child .appstore:hover {
  opacity: 0.6;
  -webkit-transition-duration: 500ms;
  -moz-transition-duration: 500ms;
  -o-transition-duration: 500ms;
  transition-duration: 500ms;
}
#body .contents_header section:first-child .desc {
  width: 400px;
  float: left;
  font-size: 14px;
  line-height: 1.7em;
}
#body .contents_header section:first-child .desc sup {
  vertical-align: text-top;
  line-height: 4px;
}
#body .contents_header section:first-child .desc small {
  font-size: 10px;
}
body.en #body .contents_header section:first-child .desc {
  font-size: 13px;
}
#body .contents_header section:first-child .info {
  width: 300px;
  float: right;
  text-align: right;
  color: #c5c5c5;
}
body.en #body .contents_header section:first-child .info {
  font-size: 11px;
}
#body .contents {
  width: 800px;
  margin: 0 auto;
}
#body .contents section {
  border-top: 1px solid #02cecc;
  overflow: hidden;
  *zoom: 1;
  margin-bottom: 110px;
}
#body .contents section h3 {
  margin: 16px 0 20px 0;
  color: #02cecc;
  font-weight: normal;
  font-size: 13px;
}
#body .contents section#features ul {
  list-style-type: disc;
  list-style-position: outside;
  padding-left: 1.5em;
  color: #747474;
  font-size: 19px;
  line-height: 1.8em;
}
body.en #body .contents section#features ul {
  font-size: 15px;
}
#body .contents section#features ul li small {
  font-size: 13px;
}
body.en #body .contents section#features ul li small {
  font-size: 11px;
}
#body .contents section#features .tab {
  margin: 40px 0 20px;
  height: 820px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.15);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  position: relative;
}
body.en #body .contents section#features .tab {
  height: 830px;
}
#body .contents section#features .tab .btns {
  text-align: center;
  position: relative;
  z-index: 20;
  top: -15px;
}
#body .contents section#features .tab .btns .btn {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
#body .contents section#features .tab .btns .btn:first-child {
  -moz-border-radius-topleft: 5px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -moz-border-radius-bottomleft: 5px;
  -webkit-border-bottom-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
#body .contents section#features .tab .btns .btn:last-child {
  -moz-border-radius-topright: 5px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
  -moz-border-radius-bottomright: 5px;
  -webkit-border-bottom-right-radius: 5px;
  border-bottom-right-radius: 5px;
}
#body .contents section#features .tab .btns .btn:not(:last-child) {
  border-right: 0;
}
#body .contents section#features .tab .btns .btn.actived {
  cursor: default;
}
#body .contents section#features .tab .texts p {
  position: absolute;
  z-index: 10;
  margin: 20px 50px;
  font-size: 13px;
  color: #747474;
}
#body .contents section#features .tab .screenshot {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
#body .contents section#features .tab .screenshot > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 800px;
  height: 814px;
  background-repeat: no-repeat;
  background-position: center bottom;
}
body.en #body .contents section#features .tab .screenshot > * {
  height: 824px;
}
#body .contents section#features .tab .screenshot .highlight {
  z-index: 5;
  background-image: url(../img/ss-highlight.png);
}
#body .contents section#features .tab .screenshot .screen.modeA {
  z-index: 3;
  background-image: url(../img/ss-screenA.png);
}
#body .contents section#features .tab .screenshot .screen.modeB {
  z-index: 2;
  background-image: url(../img/ss-screenB.png);
}
#body .contents section#features .tab .screenshot .device {
  z-index: 1;
  background-image: url(../img/ss-device.png);
}
#body .contents section#video #video_item {
  margin-bottom: 30px;
  width: 800px;
}
#body .contents section#video #video_item .icon_artist {
  margin-top: 30px;
  margin-bottom: 20px;
}
#body .contents section#video #video_item p {
  margin-top: 10px;
}
#body .contents section#video #video_item .playBtn {
  width: 400px;
  height: 214px;
  background-image: url(../img/video/playVideo_mini_off.png);
  background-repeat: no-repeat;
  background-position: center 175px;
  position: absolute;
  -webkit-transition-duration: 300ms;
  -moz-transition-duration: 300ms;
  -o-transition-duration: 300ms;
  transition-duration: 300ms;
}
#body .contents section#video #video_item .playBtn:hover {
  cursor: pointer;
  background-image: url(../img/video/playVideo_mini_on.png);
  -webkit-transition-duration: 250ms;
  -moz-transition-duration: 250ms;
  -o-transition-duration: 250ms;
  transition-duration: 250ms;
}
#body .contents section#video #video_item #dubrussell {
  width: 390px;
  height: 570px;
  float: left;
}
#body .contents section#video #video_item #dubrussell a.video_thumb {
  width: 390px;
  height: 219px;
  background-image: url(../img/video/thumb_dubrussell.png);
  display: block;
  background-repeat: no-repeat;
}
#body .contents section#video #video_item #katsuhirochiba {
  width: 390px;
  height: 570px;
  float: right;
}
#body .contents section#video #video_item #katsuhirochiba a.video_thumb {
  width: 390px;
  height: 219px;
  background-image: url(../img/video/thumb_katsuhirochiba.png);
  display: block;
  background-repeat: no-repeat;
}
#body .contents section#download .item {
  overflow: hidden;
  *zoom: 1;
  margin-bottom: 30px;
  border-top: 1px solid #EFEFEF;
  padding-top: 20px;
}
#body .contents section#download .item .info {
  width: 190px;
  float: left;
  font-size: 10px 15px;
}
#body .contents section#download .item .info h4 {
  font-size: 16px;
}
#body .contents section#download .item .info .btn {
  padding: 10px 25px 9px 16px;
  margin-bottom: 10px;
  font-size: 16px;
  color: #111;
}
#body .contents section#download .item .info .btn:before {
  content: '';
  width: 30px;
  height: 30px;
  background-image: url(../img/icon-download.png);
  background-repeat: no-repeat;
  background-position: left center;
  padding: 5px 13px;
  letter-spacing: 0.05em;
}
#body .contents section#download .item .info a {
  display: inline-block;
}
#body .contents section#download .item .info p {
  margin: 10px 0;
}
#body .contents section#download .item .desc {
  width: 610px;
  float: right;
}
#body .contents section#download .item .desc .screenshot {
  display: block;
  border: 1px solid #dedede;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  -ms-border-radius: 7px;
  -o-border-radius: 7px;
  border-radius: 7px;
  overflow: hidden;
  height: 270px;
  width: 608px;
  padding-top: 20px;
  text-align: center;
  margin-bottom: 20px;
  -webkit-transition-delay: 0;
  -moz-transition-delay: 0;
  -o-transition-delay: 0;
  transition-delay: 0;
}
#body .contents section#download .item .desc .screenshot:hover {
  border-color: transparent;
  -webkit-transition-delay: 250ms;
  -moz-transition-delay: 250ms;
  -o-transition-delay: 250ms;
  transition-delay: 250ms;
}
#body .contents section#download .item .desc .screenshot.midibridge {
  -webkit-transition-duration: 537ms;
  -moz-transition-duration: 537ms;
  -o-transition-duration: 537ms;
  transition-duration: 537ms;
}
#body .contents section#download .item .desc .screenshot.midibridge:hover {
  height: 537px;
}
#body .contents section#download .item .desc .screenshot.processing {
  -webkit-transition-duration: 689ms;
  -moz-transition-duration: 689ms;
  -o-transition-duration: 689ms;
  transition-duration: 689ms;
}
#body .contents section#download .item .desc .screenshot.processing:hover {
  height: 689px;
}
#body .contents section#download .item .desc .screenshot.polygranular {
  -webkit-transition-duration: 699ms;
  -moz-transition-duration: 699ms;
  -o-transition-duration: 699ms;
  transition-duration: 699ms;
}
#body .contents section#download .item .desc .screenshot.polygranular:hover {
  height: 699px;
}
#body .contents section#download .item .desc .screenshot.polygranular img {
  width: 537px;
}
#body .contents section#download .item .desc .screenshot img {
  width: 540px;
  margin: 0 auto;
}
#body .contents section#download .item .desc ol {
  display: block;
  float: left;
  margin-bottom: 30px;
  margin-left: 17px;
}
#body .contents section#download .item .desc .playBtn {
  width: 400px;
  height: 214px;
  background-image: url(../img/video/playVideo_mini_off.png);
  background-repeat: no-repeat;
  background-position: center 175px;
  position: absolute;
  -webkit-transition-duration: 300ms;
  -moz-transition-duration: 300ms;
  -o-transition-duration: 300ms;
  transition-duration: 300ms;
}
#body .contents section#download .item .desc .playBtn:hover {
  cursor: pointer;
  background-image: url(../img/video/playVideo_mini_on.png);
  -webkit-transition-duration: 250ms;
  -moz-transition-duration: 250ms;
  -o-transition-duration: 250ms;
  transition-duration: 250ms;
}
#body .contents section#download .item .desc a.video_thumb {
  width: 390px;
  height: 219px;
  background-image: url(../img/video/thumb_polygranular.png);
  display: block;
  background-repeat: no-repeat;
  margin: 0px auto;
}
#body .contents section#introduction h6:not(first-child) {
  margin: 40px 0 8px;
}
#body .contents section#introduction ol {
  margin-left: 2em;
}
#body .contents section#introduction ol li {
  margin-bottom: 0;
}
#body .contents section#introduction > div {
  overflow: hidden;
  *zoom: 1;
  margin: -20px 0 40px;
}
#body .contents section#introduction > div > div {
  margin: 20px 0 20px;
  width: 390px;
  float: left;
}
#body .contents section#introduction > div > div:not(.big):nth-child(odd) {
  margin-right: 20px;
}
#body .contents section#introduction > div > div.big {
  width: 800px;
}
#body .contents section#introduction > div > div.big table {
  width: 800px;
}
#body .contents section#introduction > div > div h4 {
  text-align: left;
  font-weight: bold;
  margin: 8px 0;
  font-size: 16px;
}
#body .contents section#introduction > div > div h4 small {
  font-size: 13px;
  margin-left: 10px;
  font-weight: normal;
}
#body .contents section#introduction > div > div > p {
  margin-bottom: 15px;
  width: 390px;
  float: left;
}
#body .contents section#introduction > div > div > p.left {
  margin-right: 20px;
}
#body .contents section#introduction > div > div > p span {
  display: block;
  width: 388px;
  border: 1px solid #666666;
  border-bottom: 0;
  border-right: 0;
  border-left: 0;
}
#body .contents section#introduction > div > div > p span:last-child {
  border-bottom: 1px solid #666666;
}
#body .contents section#introduction > div > div > p span:before {
  display: inline-block;
  padding: 6px;
  min-width: 70px;
  padding-left: 10px;
  margin-right: 10px;
  color: #999;
}
#body .contents section#introduction > div > div > p span.message:before {
  content: 'Massage';
}
#body .contents section#introduction > div > div > p span.arguments:before {
  content: 'Arguments';
}
#body .contents section#introduction > div > div table {
  width: 390px;
}
#body .contents section#introduction > div > div table tr th, #body .contents section#introduction > div > div table tr td {
  border-color: #666;
  font-weight: normal;
  text-align: left;
  padding: 4px 4px 4px 8px;
}
#body .contents section#introduction > div > div table tr th:first-child, #body .contents section#introduction > div > div table tr td:first-child {
  color: #999;
}
#body .contents section#introduction > div > div table tr:first-child th {
  font-weight: bold;
}
#body .contents section#contact div {
  overflow: hidden;
  *zoom: 1;
}
#body .contents section#contact div p {
  width: 270px;
  float: left;
}
#body .contents section#contact div div {
  overflow: hidden;
  *zoom: 1;
  width: 465px;
  float: right;
}
#body .contents section#contact div div a {
  display: inline-block;
  width: 180px;
  float: left;
  color: #02cecc;
  display: block;
  background-repeat: no-repeat;
  background-position: 8px center;
  padding: 5px 0 5px 38px;
  letter-spacing: 0.05em;
  border: 1px solid transparent;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
#body .contents section#contact div div a:nth-child(odd) {
  margin-right: 25px;
}
#body .contents section#contact div div a:hover {
  border-color: #02cecc;
}
#body .contents section#contact div div a.twitter {
  background-image: url(../img/mark-twitter.png);
}
#body .contents section#contact div div a.mail {
  background-image: url(../img/mark-mail.png);
}
#body .contents section#contact div div a.facebook {
  background-image: url(../img/mark-facebook.png);
}
#body .contents section#contact div div a.github {
  background-image: url(../img/mark-github.png);
}
#body .contents section#contact div div a.gplus {
  background-image: url(../img/mark-gplus.png);
}
#body .contents section#release_notes table {
  width: 100%;
}
#body .contents section#release_notes table tr {
  text-align: left;
}
#body .contents section#release_notes table tr th {
  padding: 4px 8px;
  background-color: #f9f9f9;
}
#body .contents section#release_notes table tr td {
  padding: 4px 8px;
}
#body .contents section#release_notes table tr td:first-child, #body .contents section#release_notes table tr td:nth-child(2) {
  width: 80px;
}
#body .contents #scrolltop {
  display: block;
  float: right;
  width: 100px;
  height: 20px;
  font-size: 13px;
  letter-spacing: 0.06em;
  margin-bottom: 15px;
  background-image: url(../img/arrow_top.png);
  background-repeat: no-repeat;
  background-position: right center;
}
#body .contents #footer {
  clear: both;
  border-top: 1px solid #cecece;
  padding: 15px 0;
  margin-bottom: 30px;
}
#body .contents #footer .social {
  position: relative;
  z-index: 1;
  width: 300px;
  float: left;
}
#body .contents #footer .social div {
  display: inline-block;
  float: left;
}
#body .contents #footer .social div.twitter {
  width: 95px;
  overflow: hidden;
}
#body .contents #footer .social div.gplus {
  width: 65px;
  overflow: hidden;
}
#body .contents #footer .social div.facebook {
  width: 100px;
}
#body .contents #footer .copy_language {
  float: right;
  width: 350px;
  z-index: 10;
  text-align: right;
}
#body .contents #footer .copy_language .copy {
  color: #111111;
  text-align: right;
}
#body .contents #footer .copy_language .copy a {
  color: #111111;
}
#body .contents #footer .copy_language .languages {
  width: 110px;
  text-align: right;
  margin-left: 20px;
  font-size: 13px;
  letter-spacing: 0.06em;
}
#body .contents #footer .copy_language .languages b {
  font-weight: normal;
  color: #02cecc;
}