@charset "utf-8";

/* #mban-wrap
----------------------------------------------------------------------- */
#mban-wrap { margin: 16px 0 24px; }
#mban-wrap #mban-side { float: left; }
#mban-wrap #mban-main { float: right; }

/* #mban-wrap .header
----------------------------------------------------------------------- */
#mban-wrap .header { margin: 0; width: 200px; height: 600px; border-radius: 6px; }
#mban-wrap .header .header-title { padding: 0; width: auto; border-radius: 6px 6px 0 0; }
#mban-wrap .header .header-title h1 { padding: 12px; }
#mban-wrap .header .header-title h1 a { margin: 0 auto; }
#mban-wrap .header .header-title h2 { margin: 16px 0 0; position: relative; z-index: 10; height: 52px; background: url(../img/header-search-balloon.png) center center no-repeat; }
#mban-wrap .header .registration { margin: 0 -8px; }
#mban-wrap .header .header-menu { margin-top: -12px; position: relative; top: auto; right: auto; bottom: auto; height: auto; background-color: #e3e3e3; border-radius: 0 0 6px 6px; }
#mban-wrap .header .header-menu dl { display: block; height: auto; text-align: center; }
#mban-wrap .header .header-menu dt { padding: 20px 0 6px; display: block; height: auto; text-align: center; }
#mban-wrap .header .header-menu dd { margin: 16px 16px 0; display: block; height: auto; }
#mban-wrap .header .header-menu dd br { display: none; }
#mban-wrap .header .header-menu dt + dd { margin-top: 0; margin-left: 16px; }
#mban-wrap .header .header-menu dd a { border-width: 1px 2px 0; display: block; width: auto; height: 48px; line-height: 48px; border-radius: 0; }
#mban-wrap .header .header-menu dd a:first-child { border-top-width: 2px; border-radius: 6px 6px 0 0; }
#mban-wrap .header .header-menu dd a:last-child { border-bottom-width: 2px; border-radius: 0 0 6px 6px; }
#mban-wrap .header .header-menu dd a:first-child:last-child { border-radius: 6px; }
#mban-wrap .header .header-menu .search-all { margin: 16px 16px 0; display: block; }
#mban-wrap .header .header-menu .search-all a { display: block; width: auto; height: 48px; line-height: 48px; }

/* #updates
----------------------------------------------------------------------- */
#updates .section-body { padding: 8px; background-color: #e3e3e3; }
#updates .section-body .pane { padding: 16px; background-color: #fff; }
#updates .section-body ul { margin: 0; padding: 0; list-style-type: none; }
#updates .section-body ul .row { margin: 0 0 8px; padding: 0 0 8px 96px; position: relative; border-bottom: 1px solid #ccc; min-height: 88px; }
#updates .section-body ul .row:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
#updates .section-body ul .row .link { display: block; text-decoration: none; }
#updates .section-body ul .row .thumb { position: absolute; top: 0; left: 0; width: 80px; height: 80px; line-height: 80px; background-color: #eee; }
#updates .section-body ul .row .thumb img { max-width: 80px; max-height: 80px; vertical-align: middle; }
#updates .section-body ul .row .text { color: #666; }
#updates .section-body ul .row .text p { line-height: 1.6; font-size: 1.3rem; font-size: 13px; }
#updates .section-body ul .row .text p em { display: block; color: #ff449c; font-weight: bold; font-style: normal; }
#updates .section-body ul .row .text p b { font-weight: normal; }
#updates .section-body ul .row .text .pf { margin: 8px 0 0; font-size: 0; list-style-type: none; }
#updates .section-body ul .row .text .pf li { margin-right: 8px; display: inline-block; }
#updates .section-body ul .row .text .pf .icon-flat { padding: 0 1em; color: #fff; background-color: #ffa3cd; line-height: 20px; text-align: center; font-size: 1.3rem; font-size: 13px; }
#updates .section-body ul .row .text .pf .icon-image img {}

/* .section-heading
----------------------------------------------------------------------- */
#content .section-heading { border-width: 4px 0 1px; border-style: solid; border-color: #ccc; position: relative; box-sizing: border-box; }
#content .section-heading span { padding: 12px 16px 16px; display: block; position: relative; z-index: 2; color: #ff449c; font-size: 1.6rem; font-size: 16px; }
#content .section-heading:before { content: ""; position: absolute; top: 50%; right: 0; bottom: 0; left: 0; z-index: 1; background: url(../img/texture-stripe-gray.png) repeat; }
#content .section-heading:after { content: ""; position: absolute; top: -4px; left: 0; width: 100px; height: 4px; background-color: #ff449c; }








#content .search-siteapp-count { margin: -15px 0 -20px 0; line-height: 1.25; }
#content .search-siteapp-count a { padding: 8px 10px 8px 27px; display: block; float: right; border-radius: 5px; color: #ffffff; background: #b80000 url(../img/arrow_white_on_red.gif) 10px center no-repeat; text-decoration: none; }
#content .search-siteapp-count a strong { margin: auto .25em; }
#content .search-siteapp-count a:hover { background-color: #dc2243; }
#content .search-count { margin: 20px 0; color: #505050; font-size: 16px; font-weight: bold; }
#content .search-count .notice-siteapp { margin-left: 1em; color: #888888; font-size: 12px; font-weight: normal; font-style: normal; }

#content .pager { margin: 16px 0; padding: 16px 0; background-color: #ccc; line-height: 1; text-align: center; } /* #e0e0d8 */
#content .pager a,
#content .pager em { padding: 5px 10px; border-radius: 4px; font-weight: bold; vertical-align: middle; font-style: normal; }
#content .pager a { color: #333; background-color: #fff; color: #ff499c; text-decoration: none; }
#content .pager a:hover,
#content .pager em { color: #fff !important; background-color: #ff499c; }
#content .pager .dash { padding: 5px; color: #ffffff; }

#content .search-result { margin: 10px 0 0; padding: 1px 0 0; border-top: 1px solid #d0d0c8; width: 920px; }
#content .search-result dt { float: left; width: 80px; height: 80px; background-color: #cccccc; background-position: center center; background-repeat: no-repeat; }
#content .search-result dd { margin: 0; float: right; width: 839px; }
#content .search-result dd .title { position: relative; background-color: #f0f0e8; line-height: 1; _zoom: 1; }
#content .search-result dd .title p { padding: 5px 10px; font-size: 14px; }
#content .search-result dd .title p a { margin-right: 5px; font-weight: bold; }
#content .search-result dd .title p img { margin-left: 2px; vertical-align: middle; }
#content .search-result dd .title .genre { padding: 4px 8px; color: #ffffff; background-color: #666666; position: absolute; top: 3px; _top: 5px; right: 5px; font-size: 12px; }
#content .search-result dd .outline { position: relative; }
#content .search-result dd .outline p { padding: 5px 150px 0 10px; }
#content .search-result dd .outline .release { color: #666666; position: absolute; top: 10px; right: 5px; _right: 20px; font-size: 11px; }

#content .gen-title { margin: 30px 0; padding-bottom: 15px; line-height: 1.25; color: #505050; background: url(../img/title-line.png) left bottom no-repeat; font-size: 26px; font-weight: bold; }
#content .gen-title img { margin-left: 2px; vertical-align: middle; }

#content .gen-title-siteapp { margin-bottom: 30px; }
#content .gen-title-siteapp p { padding-bottom: 5px; line-height: 1.25; color: #505050; font-size: 14px; font-weight: bold; }
#content .gen-title-siteapp .gen-title { margin: 0; padding: 15px 0 0; background-position: left top; }

#content .article-with-pics .article { width: 480px; float: left; }
#content .article-with-pics .pic-box { width: 420px; float: right; }

#content .gen-story { margin: 20px 0; }
#content .gen-story .icon { margin: 0 20px 20px 0; float: left; width: 80px; height: 80px; background-color: #cccccc; background-position: center center; background-repeat: no-repeat; }
#content .article .gen-story { margin-top: 0; }

#content .methods { margin: 20px 0; width: 480px; }
#content .methods li,
#content .methods .sns { margin-top: 5px; padding-top: 1px; border-top: 1px solid #d0d0c8; line-height: 1.25; }
#content .methods .spec { float: left; width: 410px; }
#content .methods .spec .route { padding: 3px 5px; background-color:#f0f0e8; vertical-align: middle; font-size: 11px; }
#content .methods .spec .route strong { vertical-align: middle; margin-right: 2px; }
#content .methods .spec table { margin: 5px; font-size: 11px; }
#content .methods .spec table th,
#content .methods .spec table td { padding: 3px 8px;  border-bottom: 1px solid #d0d0c8; }
#content .methods .spec table tr:last-child th,
#content .methods .spec table tr:last-child td { border-bottom: none; }
#content .methods .spec table th { border-right: 1px solid #d0d0c8; background-color: #f0f0e8; text-align: center; width: 5%; white-space: nowrap; font-weight: normal; }
#content .methods .spec table td { word-wrap: break-word; }
#content .methods .spec table table { margin: 0; }
#content .methods .spec table table th { text-align: right; }
#content .methods .spec table table th,
#content .methods .spec table table td { padding: 0; border: none; background-color: transparent; }
#content .methods .qr { float: right; width: 70px; }
#content .methods .more { padding: 10px; border-top: 1px solid #acaca8; background-color: #d0d0c8; }
#content .methods .more em { margin-bottom: 5px; display: block; font-weight: normal; }
#content .methods .more .badge { float: left; }
#content .methods .more .howto { float: right; }
#content .methods .more .note { font-size: 11px; }
#content .methods .apple       .howto { width: 315px; }
#content .methods .google      .howto { width: 321px; }
#content .methods .banadoroid  .howto { width: 335px; }
#content .methods .bnid        .howto { width: 335px; }
#content .methods .ausmartpass .howto { width: 335px; }
#content .methods .download .button { line-height: 1.25; text-align: center; }
#content .methods .download .button strong { margin-right: .25em; font-size: 14px; font-weight: bold; }
#content .methods .download .button a { margin: 0 auto; padding: 10px; border: 1px solid #ffffff; border-radius: 5px; display: block; width: 300px; color: #ffffff; background-color: #202020; text-decoration: none; }
#content .methods .download .button a { background-image: -ms-linear-gradient(top, #505050 0%, #000000 100%); }	/* IE10 */
#content .methods .download .button a { background-image: -moz-linear-gradient(top, #505050 0%, #000000 100%); }	/* Fx */
#content .methods .download .button a { background-image: -o-linear-gradient(top, #505050 0%, #000000 100%); }	/* Opera */
#content .methods .download .button a { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #505050), color-stop(1, #000000)); }	/* Webkit (Safari/Chrome 10) */
#content .methods .download .button a { background-image: -webkit-linear-gradient(top, #505050 0%, #000000 100%); }	/* Webkit (Chrome 11+) */
#content .methods .download .button a { background-image: linear-gradient(top, #505050 0%, #000000 100%); }	/* Proposed W3C Markup */
#content .methods .download .button a:hover { text-decoration: underline; }

#content .methods .careers { margin: 0; padding: 0; list-style: none; }

/* 2014-01-17: Add QR code, Redesigning alternate store badge; */
#content .methods table { width: 100%; }
#content .methods .morewbc th,
#content .methods .morewbc td { border-top: 1px solid #acaca8; background-color: #e8e8e0; vertical-align: middle; }
#content .methods .morewbc .badge { padding: 10px; text-align: center; width: 5%; white-space: nowrap; }
#content .methods .morewbc .note { padding: 10px 0; line-height: 1.5; font-size: 11px; }
#content .methods .morewbc .bcode { padding: 5px; width: 5%; white-space: nowrap; }
#content .methods .morewbc .bcode .outer { padding: 0px; background-color: #ffffff; }
#content .methods .morewbc .bcode .outer img { width: 100px; height: 100px; }
#content .methods .morewbc .badge b a {
	padding: 5px;
	display: table-cell;
	vertical-align: middle;
	width: 120px;
	height: 2.4em;
	line-height: 1.4;
	color: #ffffff;
	background-color: #555555;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	text-shadow: 1px 1px 0 #222222;
	border-radius: 5px;
	box-shadow: 1px 1px 1px rgba(0,0,0,.33);
	#display: inline;
	#zoom: 1;
}

#content .copyright,
#content .release { margin: 10px 0; color: #888888; font-size: 11px; }

#content .pic-box ul { margin: 0; padding: 0; list-style: none; }
#content .pic-box .pic { margin: 0 0 10px 10px; display: inline; float: left; }
#content .pic-box .pic img { vertical-align: bottom; }

#content .article-with-siteinfo .article { width: 560px; float: left; }
#content .article-with-siteinfo .siteinfo { width: 330px; float: right; }

#content .article-with-siteinfo .siteinfo .inner { border: 1px solid #505050; }

#content .article-with-siteinfo .siteinfo .title { border-bottom: 1px solid #660000; color: #ffffff; background: #990000 url(../img/siteinfo-bar.png) repeat-x; font-size: 16px; font-weight: bold; }
#content .article-with-siteinfo .siteinfo .title a { padding: 10px 10px 10px 88px; display: block; color: #ffffff; background: url(../img/siteinfo-button.png) 8px center no-repeat; text-decoration: none; }

#content .article-with-siteinfo .siteinfo .pic { padding: 10px; background: url(../img/siteinfo-grad.png) repeat-x; text-align: center; }
#content .article-with-siteinfo .siteinfo .methods { margin: 0; width: 328px; }
#content .article-with-siteinfo .siteinfo .methods .spec { width: 258px; }

#content .article-with-siteinfo .article .pic-box { margin-left: -10px; }

#content .inapp-wrap { margin: 30px 0; }
#content .inapp-heading { padding: 5px 10px; color: #ffffff; background-color: #505050; line-height: 1.25; font-size: 14px; }