@charset "UTF-8";
/* CSS Document */
/*-------------------------------*/
/*会社概要　販売店の皆様へ*/
/*個人情報保護など*/
/*-------------------------------*/
.profile {
  margin: 0 0 0.5em 0;
  padding: 25px;
  background: #FFF;
  border: 1px solid #CCC; }
  .profile dt {
    background: #DDD; }
  .profile dd {
    margin: 0 0 1em 1em; }
  .profile ul {
    list-style: circle; }
  .profile ul.note {
    list-style: none; }

.profile .language ul {
  list-style: none; }

.profile .language + p {
  margin-top: 1.5em; }

dl.company {
  margin: 5px 0 0 0;
  padding: 0; }
  dl.company dt {
    background: #EEE;
    margin: 0;
    padding: 0 5px;
    font-weight: normal; }
  dl.company dd {
    margin: 5px 1em 2em 1em; }
  dl.company ul {
    margin: 5px 1em 0.5em 2em; }
  dl.company li {
    margin: 0 0 0.2em 0; }

@media (max-width: 1024px) {
  dl.company {
    width: 100%; }
    dl.company dd {
      margin: 5px 0 2em 1em; } }
.Newsinner {
  padding: 25px;
  margin: 0 0 10px 0;
  background: #FFF;
  border: 1px solid #CCC; }
  .Newsinner h4 {
    margin-bottom: 10px; }
  .Newsinner img {
    max-width: 100%;
    width: auto; }

/*-------------------------------*/
/*更新履歴*/
/*-------------------------------*/
/*年度ごとのリンク*/
.yearlink {
  text-align: center;
  margin: 0 0 5px 0;
  padding: 5px 0 0 0;
  font-size: 90%;
  border-top: 1px solid #CCC; }
  .yearlink ul {
    list-style: none;
    margin: 0;
    padding: 0; }
    .yearlink ul li {
      display: inline-block;
      margin: 0;
      padding: 1px 2px; }
      .yearlink ul li a {
        display: inline-block;
        text-decoration: none;
        padding: 3px 10px;
        margin: 0;
        border-radius: 10px;
        background: #CCC;
        color: #666; }
      .yearlink ul li a:hover {
        background: #174E9D;
        color: #FFF; }

/*---------------------*/
/*更新履歴　div.profile内*/
ul.whatnew {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 120%;
  border-top: 1px solid #CCC; }
  ul.whatnew h4, ul.whatnew h3, ul.whatnew p {
    margin: 0;
    padding: 0;
    font-size: 100%;
    border: none; }
  ul.whatnew h4 {
    background-color: transparent;
    font-weight: normal; }
  ul.whatnew li {
    display: flex;
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #CCC; }
    ul.whatnew li div.iconimage {
      width: 70px; }
      ul.whatnew li div.iconimage img {
        margin: 0 10px 0 0; }
      ul.whatnew li div.iconimage a img {
        width: 58px;
        border: 1px solid #CCC;
        display: block; }

/*更新履歴2009 01～2010 07 */
ul.whatnew + ul.noicon {
  border-top: none; }

ul.noicon li {
  display: block; }

/*過去の更新履歴old 2002~2008 日付とタイトルのみ div.profile内 */
ul.whatnew_o {
  margin: 0;
  padding: 10px 0 0 0;
  list-style: none;
  line-height: 120%;
  border-top: 1px solid #CCC; }
  ul.whatnew_o li {
    margin: 0 0 10px  0;
    padding: 0 0 10px 0;
    border-bottom: 1px solid #CCC; }
    ul.whatnew_o li span {
      font-size: 11px;
      padding: 2px 10px;
      margin: 0;
      border: 1px solid #CCC;
      border-radius: 4px; }

/*--------------------------------------
pdf lists
----------------------------------------*/
ul.pdf_list li div {
  background: url("/assets/images/icon/icon_pdf_b.svg");
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 40px;
  padding-left: 40px;
  min-height: 40px; }

/*news Release ニュースリリースpdf ul.newsRelease.pdf_list */
ul.newsRelease {
  list-style: none;
  margin: 0 0 1.5em 0;
  padding: 0;
  border-bottom: 1px solid #CCC; }
  ul.newsRelease li {
    margin: 0;
    padding: 10px 0;
    border-top: 1px solid #CCC; }
    ul.newsRelease li p {
      margin: 0; }
    ul.newsRelease li p:first-of-type {
      font-weight: bold; }
    ul.newsRelease li h4 {
      margin: 0;
      padding: 0;
      font-size: 100%;
      border: none;
      background-color: transparent;
      font-weight: normal; }

/*対応状況リストpdf div.Taiou_lists ul.pdf_list*/
.Taiou_lists {
  margin: 10px 0 40px 0; }
  .Taiou_lists h4 {
    margin: 10px 0 0 0;
    padding: 3px; }
  .Taiou_lists ul {
    list-style: none;
    margin: 0 0 1.5em 0; }
  .Taiou_lists li {
    margin: 0;
    border-bottom: 1px solid #CCC;
    padding: 10px 10px 10px 0; }
    .Taiou_lists li p {
      margin: 0; }
    .Taiou_lists li p:first-child {
      margin-bottom: 5px; }

/*アクロバット告知*/
.readerKokuti {
  margin: 0;
  padding: 10px;
  border: 1px solid #CCC;
  border-radius: 5px; }
  .readerKokuti p {
    margin: 0;
    padding: 0;
    font-size: 80%;
    text-align: center; }
  .readerKokuti img {
    vertical-align: middle;
    padding: 0 10px 0 10px; }

.readerKokuti + h3,
.upgreadInfo + h3 {
  margin-top: 3em; }

/*------------------------------------------
その他table
--------------------------------------------*/
#aboutBox table {
  border-color: #666;
  border-style: solid;
  border-width: 1px 0 0 1px;
  margin: 1em 0 2em 0;
  line-height: 110%; }

#aboutBox th,
#aboutBox td {
  border-color: #666;
  border-style: solid;
  border-width: 0 1px 1px 0;
  padding: 5px; }

#aboutBox th {
  background: #999;
  color: #FFF; }

#aboutBox col.col_aten {
  background: #FBD5D8; }

/*------------------------------------------
年末年始　夏休み　GW　休業のお知らせtable
--------------------------------------------*/
#aboutBox table.businessday {
  border-color: #CCC;
  border-width: 1px 0 0 0; }

#aboutBox .businessday td,
#aboutBox .businessday th {
  border-color: #CCC;
  text-align: center;
  vertical-align: middle;
  font-weight: normal;
  padding: 3px 8px; }

#aboutBox .businessday thead th {
  background: #EEE;
  color: #000; }

#aboutBox .businessday thead tr.head1 th {
  background: #999;
  color: #FFF; }

#aboutBox .businessday tbody tr th {
  background: #77A5D2;
  color: #FFF;
  border-left: 1px solid #CCC; }

#aboutBox .businessday tbody tr.off th {
  background: #0060A0;
  color: #FFF;
  border-left: 1px solid #CCC; }

#aboutBox .businessday tbody tr.off td {
  background: #EEF9FC; }

#aboutBox .businessday tbody th {
  padding: 5px; }

#aboutBox .businessday tfoot td {
  background: #FFF;
  text-align: left;
  padding: 5px 0;
  border-width: 0 0 0 0; }

/*その他ページのイベント告知*/
div.present01 {
  margin: 2em 0;
  padding: 3em;
  border-radius: 15px;
  border: 5px dotted #7197F4; }

@media (max-width: 640px) {
  div.present01 {
    padding: 1.5em; } }
/*ツイート表示最低の高さ確保*/
.t-space {
  min-height: 280px; }

/*フォローボタン*/
.present01 .tw_f {
  margin: 5px 0 1.5em 0;
  padding: 0; }

.present01 .tw_f a {
  display: block;
  width: 300px;
  padding: 15px;
  border-radius: 5px;
  background: #09F;
  color: #FFF;
  font-weight: bold;
  text-align: center; }

.present01 .tw_f a:hover {
  background: #00CCFF; }

/*--------------------------------------
Campaign.css　キャンペーン　イベント
----------------------------------------*/
/*イベントリストnew*/
.Newsinner h1 {
  font-size: 2rem;
  font-weight: 800;
  margin: 1.5em 0 0.5em 0; }

/*イベントリストページ*/
.profile ul.eventLists {
  list-style: none; }

.eventLists {
  list-style: none;
  margin: 0 0 2em 0;
  padding: 0; }
  .eventLists li {
    margin: 0;
    padding: 10px 0;
    border-bottom: 3px dotted #DDD; }
    .eventLists li img {
      float: left;
      padding: 0;
      margin: 0 10px 0 0;
      width: 50%; }
  .eventLists li:after {
    content: "";
    display: block;
    clear: both; }

.film li img {
  float: none;
  width: 500px; }

.event {
  margin: 20px 80px; }

.eventLists + h4 {
  margin-top: 3em; }

/*キャンペーン終了告知*/
.end_info {
  border: 1px solid #C00;
  color: #C00;
  margin: 0;
  padding: 3px;
  text-align: center;
  font-weight: bold;
  background: #EEE; }

@media (max-width: 640px) {
  .eventLists li img {
    float: none;
    width: 100%;
    margin: 0 0 10px 0; }
  .eventLists li p {
    margin-bottom: 0.5em; } }
/*--------------------------
greeting ご挨拶
jQuery lightBox plugin v0.5
#gallery ulリスト
---------------------------*/
.greetingimage {
  margin: 20px -10px;
  text-align: center; }
  .greetingimage img {
    display: block;
    margin: 10px auto;
    max-width: 100%;
    width: auto;
    height: auto; }

/*--------------------------
ジャンプくんギャラリー
jQuery lightBox plugin v0.5
#gallery ulリスト
---------------------------*/
.gallerylist ul {
  list-style: none;
  margin: 0 0 5px 0; }

.gallerylist ul li {
  display: inline;
  margin: 0 4px 0 0;
  padding: 4px 0 0 0; }

.gallerylist ul img {
  border: 2px solid #DDD; }

.gallerylist ul li a {
  padding: 0;
  margin: 0; }

.gallerylist ul li a:hover img {
  border: 2px solid #0066CC;
  color: #fff;
  margin: 0;
  padding: 0; }

.gallerylist ul li a:hover {
  color: #fff; }

.seasonJunp img {
  width: 198px; }

.seasonJunp + h4 {
  margin-top: 25px; }

/*--------------------------
ジャンプくん動画
jQuery lightcase-2.5.0
ul.yt リスト
---------------------------*/
ul.yt {
  list-style: none;
  margin: 1em; }
  ul.yt > li {
    display: flex;
    align-items: center;
    margin: 0 0 2% 0;
    border: 1px solid #DDD;
    background-image: linear-gradient(to bottom, #F0F9FF 0%, #FFF 50%, #F0F9FF 100%); }
    ul.yt > li .movie {
      width: 30%;
      position: relative; }
      ul.yt > li .movie a img {
        display: block; }
      ul.yt > li .movie a:hover img {
        opacity: 0.8; }
    ul.yt > li .text {
      width: 70%; }

.yt li ul {
  margin: 1em 1em 1em 2em; }

.yt li li {
  margin: 0 0 0.3em 0; }

/*classがfabのアイコンに対して 再生マーク*/
.yt .movie a .fab {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  /*余計な隙間を除く*/
  padding: 0;
  /*余計な隙間を除く*/
  color: #FFF;
  /*アイコン色*/
  font-size: 60px;
  /*サイズ*/
  opacity: 0.7; }

.yt .movie a:hover .fab {
  color: #F00;
  /*アイコン色*/ }

/*テキストリンクリストマーク　青■＞*/
.yt li li {
  position: relative; }

.yt li li::after,
.yt li li::before {
  display: block;
  content: '';
  position: absolute; }

.yt li li::after {
  top: .2em;
  left: -1em;
  width: .8em;
  height: .8em;
  background-color: #039;
  border-radius: 10%; }

.yt li li::before {
  z-index: 2;
  top: .4em;
  left: -.8em;
  width: .2em;
  height: .2em;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg); }

@media (max-width: 640px) {
  .yt li {
    display: block;
    align-items: left; }

  .yt .movie,
  .yt .text {
    width: 100%; } }
/*--------------------------*/
/*3DScoordinate*/
/*--------------------------*/
.coordinate {
  margin: 0;
  padding: 0; }

.coordinate img {
  margin: 0;
  padding: 0 0 50px 0;
  border: 1px solid #CCC;
  background: #FFF;
  display: block; }

/*--------------------------*/
/*カタログダウンロード*/
/*--------------------------*/
.catalogItemBox {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  margin: 0 -5px 1.5em 0; }

.catalogItemBox li {
  width: calc(33.33% - 37px);
  margin: 0;
  margin: 0 5px 5px 0;
  padding: 15px;
  border: 1px solid #DDD;
  border-radius: 5px; }

@media (max-width: 1024px) {
  .catalogItemBox li {
    width: calc(50% - 37px); } }
@media (max-width: 640px) {
  .catalogItemBox {
    display: block;
    margin: 0 0 1.5em 0; }

  .catalogItemBox li {
    width: calc(100% - 32px);
    margin: 0 0 5px 0; } }
.catalogItemBox h3 {
  margin: 0 0 10px 0;
  font-size: 100%;
  line-height: 110%; }

.catalogItemBox p {
  text-align: center;
  font-size: 80%;
  margin: 0 0 5px 0; }

.catalogItemBox p img {
  border: 1px solid #CCC; }

/*--------------------------*/
/*製品おまけのプレゼントコード*/
/*ログイン*/
.PresentCode fieldset {
  padding: 10px 20px;
  border: none; }

.PresentCode label {
  display: block;
  padding: 5px; }

.PresentCode form input.button {
  border: 2px solid #CCC;
  background: #EEE;
  color: #333;
  padding: 0px 30px;
  margin: 5px 0;
  text-align: center;
  border-radius: 10px; }

/*ログイン中*/
.LoginInside {
  padding: 0 0 0 0;
  margin: 0 0 1.5em 0;
  border-radius: 5px;
  border: 2px solid #EFEFEF;
  background-image: linear-gradient(to bottom, #EEE 0%, FFF 100%); }

.LoginInside h4 {
  background: #DDD;
  margin-top: 10px; }

/*プレゼントコードテーブル*/
.codetable td {
  font-family: "ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace; }

/*イベント販売などリンク*/
.eventlink {
  margin: 15px auto; }

.eventlink a {
  display: block;
  padding: 15px 10px;
  text-decoration: none;
  border-radius: 15px;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 400;
  color: #FFF;
  background: linear-gradient(to bottom, #9CF, #039);
  box-shadow: #666 0px 2px 3px; }

.eventlink a:hover {
  background: linear-gradient(to bottom, #003, #9CF); }