@charset "UTF-8";
/*//////////////////
  共通変数
//////////////////*/
#dirList {
  display: none; }

body {
  position: relative;
  margin: 0; }

.navi {
  display: none; }

/*///////////////////////////////////////
 font-size
/////////////////////////////////////////

	10px = 77%		11px = 85%
	12px = 93%		13px = 100%
	14px = 108%		15px = 116%
	16px = 123.1%   24px = 186%

////////////////////////////////////////*/
body #header {
  margin-bottom: -6px; }

#container {
  overflow: hidden;
  background: url(/jp/img/0401/bg_top.png?20120628) repeat-x scroll center 72px;
  background-color: #FAFAFA; }

#content {
  margin: 90px auto 0;
  position: relative;
  width: auto; }

#header {
  margin-bottom: 18px; }

#content p {
  line-height: 155%; }

#container #content .tweet,
#container #content .like {
  display: block;
  width: 68px;
  height: 22px; }

#container #content .tweet a {
  background: url(/jp/img/0401/tweet.png) no-repeat 0 0;
  width: 68px;
  height: 22px;
  overflow: hidden;
  display: block;
  text-indent: -9999px;
  margin-right: 8px; }

#container #content .tweet a:hover {
  background: url(/jp/img/0401/tweet.png) no-repeat 0 -22px; }

#container #content .like a {
  background: url(/jp/img/0401/share.png) no-repeat 0 0;
  width: 68px;
  height: 22px;
  overflow: hidden;
  display: block;
  text-indent: -9999px; }

#container #content .like a:hover {
  background: url(/jp/img/0401/share.png) no-repeat 0 -21px; }

/*////////////////////////////////
 pMenu
////////////////////////////////*/
#pMenu {
  width: 970px;
  margin: 20px auto 34px auto;
  height: 20px;
  position: relative;
  z-index: 2; }

#pMenu ul {
  float: right;
  background: url(/jp/img/0401/family_navi_bar.png?20120628) no-repeat right; }

#pMenu li {
  float: left;
  padding-left: 12px;
  margin-right: 12px;
  display: block;
  background: url(/jp/img/0401/family_navi_bar.png?20120628) no-repeat 0 0;
  font-size: 85%;
  font-weight: bold; }

#pMenu li a {
  display: block;
  color: #C0C0C0; }

#pMenu li a:hover,
#pMenu .current a {
  color: #FFFFFF; }

.movie #pMenu {
  width: 970px;
  margin: 22px auto 43px auto; }

.movie #pMenu ul {
  margin-right: 2px; }

/*////////////////////////////////
 main
////////////////////////////////*/
#main {
  clear: both;
  min-height: 568px;
  position: relative; }

#main h1 {
  background: url(/jp/img/0401/h1.png?20140401) no-repeat 0 0;
  width: 756px;
  height: 81px;
  margin: 146px auto 0 auto;
  overflow: hidden;
  text-indent: -9999px;
  position: relative;
  right: -19px; }

#main h1 .cursor {
  display: block;
  background: url(/jp/img/0401/cursor.png?20140401) no-repeat 0 0;
  position: absolute;
  width: 37px;
  height: 62px;
  top: 5px;
  right: 0px; }

#main h2 {
  background: url(/jp/img/0401/h2.png?20140401) no-repeat 0 0;
  width: 515px;
  height: 99px;
  overflow: hidden;
  text-indent: -9999px;
  position: absolute;
  top: -111px;
  left: 50%;
  margin-left: -257.5px; }

#main .download {
  width: 708px;
  height: 38px;
  margin: 9px auto;
  position: relative;
  background: url(/jp/img/0401/dl_top.png) no-repeat 0 0; }

#main .download a {
  background: url(/jp/img/0401/dl_top.png) no-repeat 0 0;
  width: 546px;
  height: 38px;
  overflow: hidden;
  display: block;
  text-indent: -9999px;
  cursor: pointer; }

#main .download a:hover,
#main .download a.hover {
  background: url(/jp/img/0401/dl_top.png) no-repeat 0 -38px; }

#main .version {
  text-align: center;
  font-size: 85%;
  color: #C0C0C0;
  margin-bottom: 75px; }

#main .read {
  text-align: left;
  width: 970px;
  font-size: 131%;
  color: #EAEAEA;
  line-height: 187%;
  margin: 0 auto; }

#main .read_bg {
  position: absolute;
  left: 50%;
  margin-left: -607.5px;
  bottom: 0px;
  line-height: 0;
  font-size: 0; }

#container #main .tweet {
  position: absolute;
  top: 10px;
  right: 90px; }

#container #main .like {
  position: absolute;
  top: 10px;
  right: 15px; }

/*////////////////////////////////
 entry
////////////////////////////////*/
#entry {
  background: url(/jp/img/0401/entry_bg.png) repeat;
  position: relative;
  padding-top: 37px; }

#entry .entry_01,
#entry .entry_02,
#entry .entry_03 {
  width: 510px;
  margin: 0 auto;
  border-bottom: 1px solid #8C8C8C; }

#entry .entry_01 .bg,
#entry .entry_02 .bg,
#entry .entry_03 .bg {
  text-indent: -9999px;
  overflow: hidden; }

#entry h3 {
  font-weight: bold;
  font-size: 174%;
  color: #E0E0E0;
  margin-bottom: 34px; }

#entry p {
  font-size: 116%;
  color: #A0A0A0;
  line-height: 155%;
  width: 540px; }

#entry .entry_01 {
  min-height: 385px;
  padding: 65px 460px 32px 0;
  margin-bottom: 60px;
  position: relative; }

#entry .entry_01 .bg {
  background: url(/jp/img/0401/entry_01_bg.png) no-repeat 0 0;
  width: 448px;
  height: 467px;
  position: absolute;
  right: -41px;
  top: 0px; }

#entry .entry_01 h3 {
  margin-left: 40px; }

#entry .entry_01 .desc {
  margin-left: 0px; }

#entry .entry_01 .jpg {
  background: url(/jp/img/0401/entry_01.png) no-repeat center top;
  min-height: 91px;
  width: 520px;
  padding-top: 45px;
  margin: 13px 0 0 17px; }

#entry .entry_01 .jpg p {
  color: #707070;
  font-size: 85%;
  line-height: 155%; }

#entry .entry_01 .jpg .left {
  text-align: right;
  float: left;
  width: 182px; }

#entry .entry_01 .jpg .right {
  text-align: left;
  float: right;
  width: 195px; }

#entry .entry_02 {
  min-height: 363px;
  padding: 40px 0 29px 398px;
  margin-bottom: 52px;
  position: relative;
  width: 572px; }

#entry .entry_02 .bg {
  background: url(/jp/img/0401/entry_02_bg.png) no-repeat 0 0;
  width: 382px;
  height: 412px;
  position: absolute;
  left: -31px;
  top: 0px; }

#entry .entry_02 h3 {
  margin-left: 72px; }

#entry .entry_02 .desc {
  margin-left: 28px; }

#entry .entry_02 .gstr {
  background: url(/jp/img/0401/entry_02.png) no-repeat center top;
  min-height: 91px;
  width: 473px;
  padding: 82px 0 0 47px;
  margin: 22px 0 0 31px; }

#entry .entry_02 .gstr p {
  width: 204px;
  float: left;
  color: #707070;
  font-size: 85%;
  line-height: 155%; }

#entry .entry_03 {
  min-height: 363px;
  padding: 49px 440px 29px 0;
  margin-bottom: 0px;
  border: none;
  position: relative;
  width: 530px; }

#entry .entry_03 .bg {
  background: url(/jp/img/0401/entry_03_bg.png) no-repeat 0 0;
  width: 440px;
  height: 344px;
  position: absolute;
  right: -25px;
  top: 0px; }

#entry .entry_03 h3 {
  margin-left: 27px; }

#entry .entry_03 .desc {
  margin-left: 0px; }

#entry .entry_03 .tab {
  background: url(/jp/img/0401/entry_03.png) no-repeat center top;
  min-height: 91px;
  width: 520px;
  padding-top: 111px;
  margin-left: 28px; }

#entry .entry_03 .tab p {
  color: #707070;
  font-size: 85%;
  line-height: 140%; }

#entry .entry_03 .tab .left {
  text-align: right;
  float: left;
  width: 230px; }

#entry .entry_03 .tab .right {
  text-align: left;
  float: right;
  width: 203px; }

/*////////////////////////////////
 other
////////////////////////////////*/
.other {
  background: url(/jp/img/0401/other_bg.png?20120628) repeat-x top #393A3C;
  position: relative;
  padding: 60px 0 60px 0; }

.other h3 {
  color: #D1D1D1;
  font-size: 118%;
  font-weight: bold;
  margin-bottom: 19px; }

.other .feature {
  padding-left: 4px;
  width: 971px;
  margin: 0 auto 31px auto; }

.other .mb {
  margin: 0 auto 46px auto; }

.other .feature h4 {
  text-align: left;
  color: #CFCFCF;
  font-weight: bold;
  padding-top: 65px;
  margin-bottom: 5px;
  font-size: 108%; }

#content .other .feature p {
  color: #747575;
  font-size: 100%;
  line-height: 155%; }

.other .feature div {
  width: 306px;
  float: left;
  margin-right: 25px; }

.other .feature span {
  font-size: 85%; }

.other .feature span.w {
  color: #2EA0E4; }

.other .feature span.m {
  color: #BA9038; }

.other .feature .fd h4 {
  background: url(/jp/img/0401/other_fd_icn.png) no-repeat top left; }

.other .feature .function h4 {
  background: url(/jp/img/0401/other_function_icn.png) no-repeat top left; }

.other .feature .bbs {
  margin-right: 0px; }

.other .feature .bbs h4 {
  background: url(/jp/img/0401/other_bbs_icn.png) no-repeat top left; }

.other .feature .portable h4 {
  background: url(/jp/img/0401/other_portable_icn.png) no-repeat top left; }

.other .feature .custom h4 {
  background: url(/jp/img/0401/other_custom_icn.png) no-repeat top left; }

.other .feature .mouse {
  margin-right: 0px; }

.other .feature .mouse h4 {
  background: url(/jp/img/0401/other_mouse_icn.png) no-repeat top left; }

.other .link {
  width: 970px;
  margin: 49px auto 93px auto; }

#btmnavi {
  border: 1px solid #888888;
  width: 971px;
  margin-left: 8px;
  margin-right: 14px;
  margin: 0 auto;
  position: relative; }

#btmnavi li {
  float: left;
  line-height: 155%; }

#btmnavi li a {
  color: #78797A;
  line-height: 155%;
  font-size: 85%;
  display: block;
  font-weight: bold;
  text-decoration: none; }

#btmnavi li a:hover {
  color: #5DB6F0; }

#btmnavi li a span {
  font-size: 110%; }

#btmnavi .border {
  background: url(/jp/img/0401/border.png) no-repeat center center;
  width: 1px;
  height: 54px;
  margin: 0 10px 0 10px; }

#btmnavi .release_date {
  width: 270px;
  text-align: center;
  color: #DC72A8;
  font-weight: bold;
  border-right: 1px solid #888888;
  padding: 8px 0 6px; }

#btmnavi .recommend {
  width: 415px;
  text-align: left;
  color: #888888;
  font-weight: bold;
  background: url(/jp/img/0401/btmnavi_arrow.png) no-repeat right 13px;
  padding: 8px 50px 6px 28px;
  line-height: 155%; }

#btmnavi .recommend span {
  color: #CFCFCF; }

#btmnavi .sns .tweet {
  position: absolute;
  top: 17px;
  right: 116px; }

#btmnavi .sns .like {
  position: absolute;
  top: 17px;
  right: 40px; }

/*////////////////////////////////
 btm
////////////////////////////////*/
.btm {
  width: 970px;
  margin: 0 auto;
  padding: 60px 0 142px 0;
  position: relative;
  margin-bottom: 60px; }

.btm h3 {
  font-size: 123.1%;
  color: #303030;
  font-weight: bold;
  margin-bottom: 6px; }

.btm p {
  font-size: 108%;
  line-height: 155%;
  color: #676767;
  margin-bottom: 17px;
  width: 440px; }

.btm .link {
  width: 302px;
  height: 55px;
  margin: 0 auto; }

.btm .link a {
  width: 302px;
  height: 55px;
  background: url(/jp/img/0401/link_btm.png) no-repeat;
  display: block; }

.btm .link a:hover {
  background: url(/jp/img/0401/link_btm.png) no-repeat 0 -55px; }

.btm .bg {
  width: 1585px;
  bottom: 0;
  left: 50%;
  margin-left: -792.5px;
  position: absolute;
  margin-bottom: 0px; }
