@charset "utf-8";


/* Base layout
======================================================================= */
html { height: 100%; }
body { color: #000000; background-color: #ffffff; height: 100%; text-align: center; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; }

/* #wrapper
----------------------------------------------------------------------- */
#wrapper { margin: 0 auto 20px; width: 960px; color: #333 !important; text-align: left; font-size: 1.3rem; font-size: 13px; }
#wrapper a:link { color: #36c; outline: none; }
#wrapper img { vertical-align: bottom; }

/* #topicpath
----------------------------------------------------------------------- */
#topicpath { margin: 7px; line-height: 1.25; font-size: 1rem; font-size: 10px; }
#topicpath span { margin: 0 5px; }
#topicpath a { text-decoration: none; }
#topicpath a:hover { text-decoration: underline; }
#topicpath em { font-style: normal; }

/* #wrapper .header
----------------------------------------------------------------------- */
#wrapper .header { margin: 16px 0 0; position: relative; width: 960px; height: 88px; background-color: #e3e3e3; border-radius: 6px 6px 0 0; }
#wrapper .header .header-title { padding: 16px; position: relative; width: 176px; background-color: #ff449c; border-radius: 6px 0 0 0; text-align: center; }
#wrapper .header .header-title h1 a { display: block; width: 144px; height: 56px; background: url(../img/header-name.png) no-repeat; }
#wrapper .header .header-menu { position: absolute; top: 12px; right: 16px; bottom: 12px; height: 64px; font-size: 0; }
#wrapper .header .header-menu dl { display: inline-table; height: 64px; }
#wrapper .header .header-menu dt { padding: 0 6px 0 16px; display: table-cell; height: 64px; vertical-align: middle; text-align: right; font-size: 11rem; font-size: 11px; }
#wrapper .header .header-menu dd { margin: 0 0 0 16px; display: inline-table; height: 64px; vertical-align: middle; font-size: 13rem; font-size: 13px; }
#wrapper .header .header-menu dt + dd { margin-left: 0; }
#wrapper .header .header-menu dd a { border-width: 2px 0 2px 1px; border-style: solid; border-color: #ccc; display: table-cell; vertical-align: middle; text-align: center; box-sizing: border-box; width: 96px; height: 64px; color: #666; background-color: #fff; text-decoration: none; }
#wrapper .header .header-menu dd a:first-child { border-left-width: 2px; border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
#wrapper .header .header-menu dd a:last-child { border-right-width: 2px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; }
#wrapper .header .header-menu dd a:hover { color: #ff449c !important; }
#wrapper .header .header-menu .search-all { margin: 0 0 0 16px; display: inline-table; vertical-align: middle; font-size: 13rem; font-size: 13px; }
#wrapper .header .header-menu .search-all a { display: table-cell; position: relative; color: #fff !important; background-color: #ff449c; box-sizing: border-box; width: 120px; height: 64px; vertical-align: middle; text-align: center; border-radius: 6px; text-decoration: none; }
#wrapper .header .header-menu .search-all a:before { content: ""; position: absolute; border: 1px solid #fff; top: 2px; right: 2px; bottom: 2px; left: 2px; border-radius: 4px; }
#wrapper .header .header-menu .search-all a i { display: inline-block; width: 15px; height: 16px; vertical-align: middle; background: url(../img/icon-inline-search-white.png) no-repeat; }

/* #header
----------------------------------------------------------------------- */
#header { margin-top: 13px; position: relative; width: 960px; height: 90px; background: #dc2243 url(../img/header-pane-130306.png?rel=2014-04-01) no-repeat; }
#header h1 { position: absolute; top: 15px; left: 10px; }
#header .search { position: absolute; top: 35px; right: 10px; }
#header .search a { display: block; width: 100px; height: 22px; background: url(../img/header-search-130306.png?rel=2014-04-01) no-repeat; }
#header .search a:hover { background-position: right top; }

/* #gnav
----------------------------------------------------------------------- */
#gnav { position: absolute; top: 10px; left: 202px; width: 638px; height: 68px; background: url(../img/gnav-130306.png?rel=2014-04-01) no-repeat; list-style: none; }
#gnav li { position: absolute; }
#gnav .ios     { top: 0; left:  94px; width: 104px; }
#gnav .android { top: 0; left: 198px; width: 100px; }
#gnav .other   { top: 0; left: 298px; width: 104px; }
#gnav .fp      { top: 0; left: 412px; width: 108px; }
#gnav .pc      { top: 0; left: 530px; width: 108px; }
#gnav a       { height: 68px; display: block; }
#gnav a:hover { background: url(../img/gnav-130306.png?rel=2014-04-01) no-repeat; }
#gnav .ios     a:hover { background-position:  -94px -68px; }
#gnav .android a:hover { background-position: -198px -68px; }
#gnav .other   a:hover { background-position: -298px -68px; }
#gnav .fp      a:hover { background-position: -412px -68px; }
#gnav .pc      a:hover { background-position: -530px -68px; }

/* #search-pane
----------------------------------------------------------------------- */
#search-pane { border: 4px solid #ff499c; background-color: #fff; position: relative; box-shadow: 0 -1px 0 #c36; }
#search-pane .inner { margin: 8px; position: relative; }
#search-pane .button-wrap { margin-top: -25px; position: absolute; top: 50%; left: 750px; }
#search-pane .button-wrap button { border: none; position: relative; color: #fff !important; background-color: #ff449c; box-sizing: border-box; width: 128px; height: 48px; vertical-align: middle; text-align: center; border-radius: 6px; font-size: 13rem; font-size: 13px; cursor: pointer; }
#search-pane .button-wrap button:before { content: ""; position: absolute; border: 1px solid #fff; top: 2px; right: 2px; bottom: 2px; left: 2px; border-radius: 4px; }
#search-pane .button-wrap button i { display: inline-block; width: 15px; height: 16px; vertical-align: top; background: url(../img/icon-inline-search-white.png) no-repeat; }
#search-pane table { width: 700px; }
#search-pane table th,
#search-pane table td { padding: 7px; border-top: 1px solid #ccc; line-height: 1.75; }
#search-pane table th { text-align: right; white-space: nowrap; color: #888; font-weight: normal; }
#search-pane table .first-child th,
#search-pane table .first-child td { border-top: none; }
#search-pane table .over th,
#search-pane table .over td { background-color: #f6f6f6; }
#search-pane table .tx { padding: 4px; border: 1px solid #d0d0c8; border-radius: 5px; width: 400px; font-size: 16px; }
#search-pane table .cb { margin-right: 4px; }
#search-pane table label { float: left; margin-right:1em; white-space: nowrap; }
#search-pane table select { margin: 0 4px; }

/* #content
----------------------------------------------------------------------- */
#content { margin: 30px 20px 0 20px; }

/* #footer
----------------------------------------------------------------------- */
#footer { margin-top: 30px; }

/* #fnav
----------------------------------------------------------------------- */
#fnav { margin: 0; padding: 0; list-style: none; text-align: center; }
#fnav li { margin: 0 8px; display: inline-block; }
#fnav .button { padding: 0 8px; border: 2px solid #ccc; display: block; height: 32px; line-height: 32px; vertical-align: middle; text-decoration: none; font-size: 1.3rem; font-size: 13px; }
#fnav .button i { display: inline-block; background-repeat: no-repeat; vertical-align: middle; }
#fnav .button:hover { opacity: .7; }
#fnav .button-trade { color: #333 !important; }
#fnav .button-trade i { width: 11px; height: 12px; background-image: url(../img/icon-inline-arrow-right-gray.png); }
#fnav .button-gotop { border-color: #ff449c; color: #fff !important; background-color: #ff449c; }
#fnav .button-gotop i { width: 13px; height: 12px; background-image: url(../img/icon-inline-arrow-up-white.png); }