@charset "UTF-8";
/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
html {
  color: #000;
  width: 100%;
  background: #FFF; }

body {
  width: 100%; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
  border: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
  color: #303233; }

th, td {
  color: #303233; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  font-variant: normal; }

sup {
  vertical-align: text-top; }

sub {
  vertical-align: text-bottom; }

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  *font-size: 100%; }

legend {
  color: #000; }

#yui3-css-stamp.cssreset {
  display: none; }

/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
body {
  font: 13px/1.231 arial,helvetica,clean,sans-serif;
  *font-size: small;
  *font: x-small; }

select, input, button, textarea {
  font: 99% arial,helvetica,clean,sans-serif; }

table {
  font-size: inherit;
  font: 100%; }

pre, code, kbd, samp, tt {
  font-family: monospace;
  *font-size: 108%;
  line-height: 100%; }

#yui3-css-stamp.cssfonts {
  display: none; }

html {
  background-color: transparent;
  background-image: none; }

body {
  width: 100%;
  font-kerning: auto;
  letter-spacing: -0.01em;
  color: #161616;
  min-width: 1280px;
  min-height: 800px;
  position: static;
  -webkit-font-smoothing: antialiased; }

#container {
  min-width: 1280px; }

html, body {
  height: 100%; }

body *,
body *::before,
body *::after {
  transition-timing-function: cubic-bezier(0, 1, 0.74, 1);
  transition-delay: 0s; }

a {
  text-decoration: none;
  transition: opacity 0.1s;
  -webkit-font-smoothing: antialiased;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  opacity: 1; }

a:hover {
  opacity: 0.7; }

p {
  color: #303233; }

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

.clearfix {
  display: inline-table; }

* html .clearfix {
  height: 1%; }

.clearfix {
  display: block; }

#container {
  -webkit-text-size-adjust: 100%; }

h1,
h2,
h3,
h4,
a,
span,
div,
ul,
dl,
ol,
p {
  max-height: 999999px; }

p,
td,
dd {
  background: url(../../img/common/blank.gif); }

body, input, textarea, select {
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",Lucida Grande,"メイリオ", Meiryo, Tahoma, Verdana, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

#un_support_dialog {
  padding: 20px;
  background: #f1edee;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  z-index: 9000; }
  #un_support_dialog p {
    font-size: 15px;
    margin-right: 35px; }
  #un_support_dialog a {
    width: 11px;
    height: 11px;
    display: block;
    background: url(../../img/common/Android_alart_close.svg) no-repeat;
    position: absolute;
    top: 50%;
    margin-top: -5px;
    right: 27px;
    cursor: pointer;
    z-index: 10; }

#main {
  line-height: 1.8; }

a:link,
a:visited,
a:active,
a:hover {
  outline: none; }

header {
  z-index: 9000; }

header a,
header a:hover {
  opacity: 1;
  color: inherit; }

header > div {
  width: 100%; }

#container {
  box-sizing: border-box; }

header {
  display: flex;
  flex-flow: row nowrap;
  position: absolute;
  width: 100%;
  height: 72px;
  transform-style: preserve-3d;
  box-sizing: border-box;
  top: 0;
  min-width: 1280px; }

@supports (-ms-accelerator: true) {
  header {
    transform-style: flat; } }
header * {
  box-sizing: border-box; }

header a {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none; }

header h1 a {
  text-indent: -9999px;
  overflow: hidden;
  margin-left: 120px;
  width: 50px; }

/*  Header  */
header h1 {
  position: absolute;
  width: 180px;
  height: 72px;
  left: 0px;
  background: url(../../img/common/header/header-logo.svg) no-repeat right/71px 72px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  z-index: 9000; }

header nav {
  position: relative;
  width: 100%;
  z-index: 1000; }

/*  Header - Nav  */
header nav ul {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-content: flex-start;
  align-items: center;
  position: relative;
  width: 100%;
  height: 72px;
  margin: auto;
  background: black; }

header nav ul:last-of-type {
  margin-top: -72px; }

/*  Header - Nav - Items  */
header nav li {
  height: 58px;
  border-bottom: solid 1px rgba(255, 255, 255, 0.34);
  color: rgba(255, 255, 255, 0.92);
  font-size: 15px; }

header nav li a {
  padding: 0px 25px; }

header nav li.select,
header nav li:hover {
  border-bottom: solid 1px white;
  color: white; }

header nav li.secondary {
  border-style: dotted;
  color: rgba(255, 255, 255, 0.74);
  font-size: 14px; }

header nav li.secondary.select,
header nav li.secondary:hover {
  border-style: dotted;
  color: rgba(255, 255, 255, 0.82); }

header nav li.button {
  height: 32px;
  border-bottom: none;
  margin: 13px 18px;
  background: rgba(255, 255, 255, 0.74);
  border-radius: 3px;
  color: rgba(0, 0, 0, 0.92);
  font-size: 13px; }

header nav li.button a {
  padding: 0px 12px; }

header nav li.button.select,
header nav li.button:hover {
  background-color: rgba(255, 255, 255, 0.92);
  color: black; }

header nav h2,
header nav li {
  transition-duration: 0.22s; }

header nav h2:hover,
header nav li:hover {
  transition-duration: 0s; }

/*  Header - Glance  */
header nav h2 {
  position: absolute;
  width: 160px;
  height: 58px;
  margin: 7px 0px;
  top: 0px;
  right: 0px;
  border-radius: 3px 0px 0px 3px;
  background: 80px center / 72px 72px no-repeat;
  background-image: url(../../img/common/header/header-control-glance.svg);
  background-color: #7c7c7c;
  color: rgba(255, 255, 255, 0.74);
  font-size: 13px;
  line-height: 1.25;
  z-index: 8000; }

header nav h2 a {
  padding: 0px 9px; }

header nav h2:hover {
  background: right center / 72px 72px no-repeat;
  background-image: url(../../img/common/header/header-control-glance-hover.svg);
  background-color: #6c6c6c;
  color: white; }

#corporate header nav h2 {
  background-color: #383838; }

#corporate header nav h2:hover {
  background-color: #484848; }

header nav h2:first-of-type {
  display: none; }

/*  Themes - White  */
#corporate header h1 {
  background: url(../../img/common/header/header-logo-reversal.svg) no-repeat right/71px 72px; }

#corporate header nav ul:first-of-type,
#products header nav ul:last-of-type {
  background-color: white; }

#corporate header nav ul:first-of-type li,
#products header nav ul:last-of-type li {
  border-bottom: solid 1px rgba(0, 0, 0, 0.26);
  color: rgba(0, 0, 0, 0.92); }

#corporate header nav ul:first-of-type li.select,
#products header nav ul:last-of-type li.select,
#corporate header nav ul:first-of-type li:hover,
#products header nav ul:last-of-type li:hover {
  border-bottom: solid 1px black;
  color: black; }

#corporate header nav ul:first-of-type li.secondary,
#products header nav ul:last-of-type li.secondary {
  border-style: dotted;
  color: rgba(0, 0, 0, 0.74); }

#corporate header nav ul:first-of-type li.secondary.select,
#products header nav ul:last-of-type li.secondary.select,
#corporate header nav ul:first-of-type li.secondary:hover,
#products header nav ul:last-of-type li.secondary:hover {
  color: rgba(0, 0, 0, 0.82); }

#corporate header nav ul:first-of-type li.button,
#products header nav ul:last-of-type li.button {
  border-bottom: none;
  background: rgba(0, 0, 0, 0.64);
  color: rgba(255, 255, 255, 0.92); }

#corporate header nav ul:first-of-type li.button:hover,
#products header nav ul:last-of-type li.button:hover,
#corporate header nav ul:first-of-type li.button.select,
#products header nav ul:last-of-type li.button.select {
  background-color: rgba(0, 0, 0, 0.72);
  color: white; }

/*  Themes - Transparent  */
#corporate header.transparent h1 {
  background: url(../../img/common/header/header-logo.svg) no-repeat right/71px 72px; }

#corporate header.transparent nav ul:first-of-type {
  background-color: rgba(128, 128, 128, 0); }

#corporate header.transparent nav ul:first-of-type li {
  border-bottom: solid 1px rgba(255, 255, 255, 0.34);
  color: rgba(255, 255, 255, 0.92); }

#corporate header.transparent nav ul:first-of-type li.select,
#corporate header.transparent nav ul:first-of-type li:hover {
  border-bottom: solid 1px white;
  color: white; }

#corporate header.transparent nav ul:first-of-type li.secondary {
  border-style: dotted;
  color: rgba(255, 255, 255, 0.74); }

#corporate header.transparent nav ul:first-of-type li.select,
#corporate header.transparent nav ul:first-of-type li.secondary:hover {
  color: rgba(255, 255, 255, 0.82); }

#corporate header.transparent nav ul:first-of-type li.button {
  border-bottom: none;
  background: rgba(255, 255, 255, 0.74);
  color: rgba(0, 0, 0, 0.92); }

#corporate header.transparent nav ul:first-of-type li.button.select,
#corporate header.transparent nav ul:first-of-type li.button:hover {
  background-color: rgba(255, 255, 255, 0.92);
  color: black; }

/*  Effects - Rolling Navs  */
header nav ul {
  transform-origin: center center -36px;
  transition-duration: 0.38s;
  transition-delay: 0s;
  transition-property: transform; }

.ready.rolled header nav ul {
  transition-delay: 0s; }

header nav ul:first-of-type {
  transform: rotateX(0deg);
  z-index: 100; }

header nav ul:last-of-type {
  transform: rotateX(90deg);
  z-index: 99; }

.ready.rolled header nav ul:first-of-type {
  transform: rotateX(-90deg); }

.ready.rolled header nav ul:last-of-type {
  transform: rotateX(0deg); }

header nav h2 {
  transform: translateZ(100px);
  transition-duration: 0.28s; }

header nav h2.hoverable:hover {
  transition-duration: 0.28s; }

/*  Effects - Rolling Logo  */
header h1 {
  transform: translateZ(100px);
  transition-property: background; }

.ready.rolled header h1 {
  background: url(../../img/common/header/header-logo-reversal.svg) no-repeat right/71px 72px;
  transition-delay: 0s; }

#corporate.ready.rolled header h1,
.ready.rolled header nav.transparent h1 {
  background: url(../../img/common/header/header-logo.svg) no-repeat right/71px 72px; }

/*  Effects - Disable  */
.covered header {
  height: 72px; }

.navi {
  width: 974px;
  margin: 0 auto 90px;
  position: relative;
  padding-top: 102px; }

.navi li {
  display: inline-block;
  font-size: 12px;
  color: #A0A2A2; }

#corporate .navi li,
#corporate .navi li a {
  color: #A0A2A2; }

.navi li:after {
  content: ">";
  margin: 0 0px 0 5px;
  text-decoration: none; }

.navi li:last-child:after {
  content: ""; }

.navi li a,
.navi li a:hover {
  text-decoration: underline;
  color: #A0A2A2;
  display: inline-block; }

footer {
  z-index: 1000; }

footer a,
footer a:hover {
  opacity: 1; }

footer * {
  box-sizing: border-box; }

footer section,
footer section ul,
footer nav ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }

footer {
  width: 100%;
  padding: 0px 14px;
  margin: 80px auto 0;
  color: rgba(0, 0, 0, 0.4);
  box-sizing: border-box; }

/*  Footer  */
footer section {
  justify-content: flex-end;
  margin: 0 auto;
  height: 44px;
  border-bottom: solid 1px rgba(0, 0, 0, 0.4);
  max-width: 828px; }

footer p {
  padding: 18px 0px 34px;
  font-size: 11px;
  text-align: center;
  color: inherit; }

footer a,
footer a:link,
footer a:active,
footer a:visited {
  color: inherit; }

/*  Footer - Sharings  */
footer section h2 {
  font-size: 11px;
  color: inherit; }

footer section h2::after {
  content: '：'; }

footer section li {
  width: 32px;
  height: 32px;
  margin: auto;
  background: center / contain no-repeat;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  opacity: 0.74;
  transition-duration: 0.54s; }

footer section li:hover {
  transform: scale(1.14);
  opacity: 1;
  transition-duration: 0s; }

footer section li a {
  display: block;
  width: 32px;
  height: 32px; }

footer section li.twitter {
  background-image: url(../../img/common/footer/footer-sharing-twitter.svg); }

footer section li.facebook {
  background-image: url(../../img/common/footer/footer-sharing-facebook.svg); }

footer section li.google {
  background-image: url(../../img/common/footer/footer-sharing-google.svg); }

/*  Footer - Navigation  */
footer nav ul {
  margin-top: 6px; }

footer nav li {
  display: flex;
  position: relative;
  border-bottom: solid 1px transparent;
  margin: 12px 10px;
  font-size: 13px;
  font-weight: bold;
  transition-duration: 0.22s;
  text-decoration: none; }

footer nav li:hover {
  border-bottom: solid 1px rgba(0, 0, 0, 0.28);
  color: rgba(0, 0, 0, 0.54);
  transition-duration: 0s; }

footer nav li a {
  display: block;
  text-decoration: none; }

footer nav li a:hover {
  text-decoration: none; }

footer nav li.external {
  margin-right: 28px; }

footer nav li.external::after {
  content: '';
  display: block;
  position: absolute;
  width: 17px;
  height: 17px;
  top: 0px;
  right: -20px;
  background: center / contain no-repeat;
  background-image: url(../../img/common/footer/footer-external.svg);
  pointer-events: none; }