@charset "utf-8";

/*------------------------------------------------------------------------------

  DAITOMO - 2025 -

------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------

  common

------------------------------------------------------------------------------*/
html,
body {
  color: #333;
}

html {
  min-height: 100%;
  position: relative;
  box-sizing: border-box;
}

/* body {
  min-width: 752px;
} */

*,
*:before,
*:after {
  box-sizing: inherit;
}

.container {
  /* max-width: 1024px; */
  margin: 0 auto;
}

.container:last-of-type {
  padding-bottom: 5rem;
}



/* ---- link ---------------------------------------- */
a {
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

a:hover {
  opacity: 0.5;
}



/*------------------------------------------------------------------------------

  header

------------------------------------------------------------------------------*/
header {
  padding: 20px 0 28px;
}

#header-wrap {
  position: relative;
  max-width: 1024px;
  margin: 0 auto;
}

#logo h1 {
  max-width: 236px;
  line-height: 1;
  margin: 0 auto;
}

#logo h1 a {
  display: block;
}

#logo h1 img {
  display: block;
  width: 100%;
}

.current {
  font-size: 32px;
}

/* .header-flex {
  display: flex;
  align-items: center;
} */




/*------------------------------------------------------------------------------

  footer

------------------------------------------------------------------------------*/
footer {
  margin-bottom: 2rem;
}

.footer-nav {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  padding: 0;
  margin-bottom: 1rem;
  border-top: solid 1px #ec7aac;
  border-bottom: solid 1px #ec7aac;
}

.footer-nav li {
  width: 50%;
  text-align: center;
  font-size: 0.875rem;
  padding: 0.5rem;
}

.footer-nav li a {
  display: block
}

.footer-nav li:nth-child(odd) {
  border-top: solid 1px #ec7aac;
  border-bottom: solid 1px #ec7aac;
  border-right: solid 1px #ec7aac;
}

.footer-nav li:nth-child(even) {
  border-top: solid 1px #ec7aac;
  border-bottom: solid 1px #ec7aac;
  border-left: solid 1px #ec7aac;
}

@media (min-width: 768px) {
  .footer-nav {
    max-width: 960px;
    flex-wrap: nowrap;
    border-top: none;
    border-bottom: none;
    border-left: solid 1px #ec7aac;
    margin: 0 auto 1rem;
  }

  .footer-nav li:nth-child(odd),
  .footer-nav li:nth-child(even) {
    border-top: none;
    border-bottom: none;
    border-left: none;
    border-right: solid 1px #ec7aac;
  }
}





/*------------------------------------------------------------------------------

  nav

------------------------------------------------------------------------------*/
/*========= ナビゲーションのためのCSS ===============*/

#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position:fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: 0;
  left: -120%;
  width: 300px;
  height: 100vh;/*ナビの高さ*/
  height: 100dvh;/*ナビの高さ*/
  background: #616161;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive{
  left: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999; 
  width: 300px;
  height: 100vh;/*表示する高さ*/
  height: 100dvh;/*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

#g-nav h2 {
  width: 128px;
  margin: 40px auto 0;
}

#g-nav h2 img {
  width: 128px;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  /* position: absolute;
  z-index: 999;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%); */
  width: 100%;
  font-size: 0.75rem;
  padding: 1rem;
}

/* メニュー2階層目のpaddingを0に */
#g-nav-list > ul > li > ul {
  padding: 0;
}

/* メニュー2階層目のliを1rem段落ち */
#g-nav-list > ul > li > ul > li {
  padding-left: 1rem;
}

/* メニュー2階層目のulにmargin-bottom: 1rem */
#g-nav-list > ul > li > ul {
  margin-bottom: 1rem;
}

/* 仕切り線 hr */
#g-nav-list > hr {
  margin: 0 0 1.5rem;
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  padding: 0.5rem 0;
  border-bottom: solid 1px #ec7aac;
}

#g-nav li:first-child {
  border-top: solid 1px #ec7aac;
}

#g-nav li a {
  color: #fff;
  text-decoration: none;
  padding: 8px;
  display: block;
  text-transform: uppercase;
  font-weight: bold;
  background: transparent url(../images/arrow.svg) 250px center no-repeat;
  background-size: auto 18px;
}

/* メニュー1階層目のリンクカラー */
#g-nav-list > ul > li > a {
  color: #fff;
}

/* メニュー1階層目の選択中リンクカラー */
#g-nav-list > ul > li > a.current-menu,
li.has-child > a.current-menu::before {
  color: #ec7aac;
}

li.has-child > a.current-menu::before {
  border-top: 2px solid #ec7aac;
  border-right: 2px solid #ec7aac;
}


/*========= ボタンのためのCSS ===============*/
.openbtn{
  position:fixed;
  z-index: 9999;/*ボタンを最前面に*/
  top:0;
  left:0;
  cursor: pointer;
  width: 52px;
  height:52px;
  background-color: #ec7aac;
  border: solid 1px #fff;
}

/*×に変化*/	
.openbtn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #fff;
  width: 45%;
}

.openbtn span:nth-of-type(1) {
  top:16px;	
}

.openbtn span:nth-of-type(2) {
  top:24px;
}

.openbtn span:nth-of-type(3) {
  top:32px;
}

.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn.active span:nth-of-type(3){
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}






/*------------------------------------------------------------------------------

  object - project

------------------------------------------------------------------------------*/
/* ---- common ---------------------------------------- */
/* heading */
.heading {
  text-align: center;
  color: #e50065;
  margin-bottom: 2rem;
}

.subheading {
  padding: 0.25rem 0.5rem;
  margin-bottom: 1rem;
  border-bottom: solid 1px #cfcfcf;
}

.title {
  padding: 0.25rem 0.5rem;
  margin-bottom: 0.5rem;
}

/* wrapper */
.wrapper {
  max-width: 960px;
  padding: 0 1.5rem 2rem;
  margin: 0 auto;
}


/* ---- アプリダウンロードボタン ---------------------------------------- */
.app-download {
  text-align: center;
  padding: 1.5rem 1rem;
}

.app-download img {
  height: 42px;
  margin: 0 4px;
}

@media (min-width: 375px) {
  .app-download img {
    height: 50px;
  }
}



/* ---- 対応機種一覧 ---------------------------------------- */
.models-list {
  list-style-type: none;
  padding: 0;
  margin-bottom: 1rem;
}

.models-list li {
  padding: 0.5rem 0;
}

.models-list a {
  display: block;
  color: #333;
  text-decoration: underline;
}

/* copyright */
.copyright-list {
  font-size: 0.75rem;
  list-style-type: none;
  padding: 0;
  margin-bottom: 1rem;
}



/* ---- 遊び方タブ ---------------------------------------- */
.tab-container {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ec7aac;
  padding: 0 0.5rem;
  margin-bottom: 2rem;
}

.tab-container p {
  width: 50%;
  text-align: center;
  font-weight: bold;
  background-color: #fff;
  padding: 0.5rem 1rem;
  margin: 0.75rem 0.5rem;
  border-radius: 4px;  
}

.tab-on {
  color: #ec7aac;
}

.tab-off {
  position: relative;
}

.tab-off span {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  color: #fff;
  background-color: rgba(153, 153, 153, 0.9);
  padding: 0.5rem 1rem;
  border-radius: 4px; 
}

@media (min-width: 768px) {
  .tab-container p {
    max-width: 320px;
  }
}




/* ---- 各種ブロック ---------------------------------------- */
.gray-block {
  background-color: #efefef;
  padding: 2rem 1rem;
}

.white-block {
  position: relative;
  max-width: 960px;
  background-color: #fff;
  padding: 3rem 1rem 1rem;
  margin: 0 auto;
  border: solid 2px #cfcfcf;
  border-radius: 4px;
}

.num {
  position: absolute;
  top: 0;
  left: 0;
  font-weight: bold;
  padding: 8px 16px;
  background-color: #cfcfcf;
  border-radius: 2px 0 4px 0;
}

.caution-block {
  max-width: 960px;
  background-color: #fff;
  color: #e50065;
  padding: 1rem;
  margin: 0 auto;
  border: solid 2px #e50065;
  border-radius: 4px;
}






/*------------------------------------------------------------------------------

  object - utility

------------------------------------------------------------------------------*/
/* ---- image frame ---------------------------------------- */
.gray-frame img {
  border: solid 1px #cfcfcf;
}


/* ---- button ---------------------------------------- */
/* button 基本構成 */
.btn {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 1rem auto;
  border: none;
  color: #fff;
  font-weight: bold;
  transition: all .3s;
  background: transparent url(../images/arrow.svg) 220px center no-repeat;
  background-size: auto 18px;
}

/* button hover */
.btn:hover {
  opacity: 0.65;
  /* background-color: #1579c0; */
}

/* button 形状 */
.btn-square {
  border-radius: 5px;
}

.btn-round {
  border-radius: 100px;
}

/* button bg-color */
.btn-pink {
  background-color: #ec7aac;
}

/* button サイズ */
.btn-small {
  width: 120px;
  padding: .4rem 1rem;
  font-size: 0.75rem;
}

.btn-medium {
  width: 180px;
  padding: .75rem 1.5rem;
  font-size: 0.875rem;
}

.btn-large {
  width: 240px;
  padding: .9rem 2rem;
  font-size: 1rem;
}




/* ---- border ---------------------------------------- */
.gray-border-top {
  border-top: solid 1px #cfcfcf;
}

.gray-border-bottom {
  border-bottom: solid 1px #cfcfcf;
}






/* ---- accordion ---------------------------------------- */
.accordion {
  max-width: 768px;
  min-width: 640px;
  background-color: #f0f5f9;
}

.accordion:not([open]) {
  margin-bottom: 7px;
}

.accordion summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 1em 2em;
  border-radius: 5px;
  background-color: #2589d0;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}

.accordion summary::-webkit-details-marker {
  display: none;
}

.accordion summary::before,
.accordion summary::after {
  width: 3px;
  height: .9em;
  border-radius: 5px;
  background-color: #fff;
  content: '';
}

.accordion summary::before {
  position: absolute;
  right: 2em;
  rotate: 90deg;
}

.accordion summary::after {
  transition: rotate .3s;
}

.accordion[open] summary::after {
  rotate: 90deg;
}

.accordion .accordion-contents {
  transform: translateY(-10px);
  opacity: 0;
  margin: 0;
  padding: 1em 2em 2em 2em;
  color: #333333;
  transition: all 0.5s ease;
}

.accordion[open] .accordion-contents {
  transform: none;
  opacity: 1;
}

/* アコーディオンの中textbox, selectbox のレイアウト */
.accordion-contents .textbox-label {
  display: inline-block;
  width: 7.5rem;
}

.accordion-contents select {
  width: 60%;
}

.accordion-contents .textbox {
  min-width: 20%;
}





/* ---- margin ---------------------------------------- */
.mb08 {
  margin-bottom: 8px;
}

.mb16 {
  margin-bottom: 16px;
}

.mb24 {
  margin-bottom: 24px;
}

.mb32 {
  margin-bottom: 32px;
}

.mb48 {
  margin-bottom: 48px;
}

.mb64 {
  margin-bottom: 64px;
}

.mb80 {
  margin-bottom: 80px;
}

.mr08 {
  margin-right: 8px;
}

.mr16 {
  margin-right: 16px;
}

.mr24 {
  margin-right: 24px;
}

.mr32 {
  margin-right: 32px;
}

.margin-auto {
  margin: 0 auto;
}

.ml-auto {
  margin-left: auto;
}

.ml08 {
  margin-left: 8px;
}

.ml16 {
  margin-left: 16px;
}

.ml24 {
  margin-left: 24px;
}

.ml32 {
  margin-left: 32px;
}

.ml48 {
  margin-left: 48px;
}

.ml120 {
  margin-left: 120px;
}

.mlr08 {
  margin-left: 8px;
}



/* ---- padding ---------------------------------------- */
.pd08 {
  padding: 8px;
}

.pd16 {
  padding: 16px;
}

.pd24 {
  padding: 24px;
}

.pd32 {
  padding: 32px;
}

.pt32 {
  padding-top: 32px;
}


/* ---- on / off ---------------------------------------- */
.on {
  display: none;
}

.off {
  display: block;
}

@media (min-width: 768px) {

  .on {
    display: block;
  }

  .off {
    display: none;
  }

}



/* ---- text ---------------------------------------- */
.sub {
  font-size: 18px;
  margin-bottom: 16px;
}

@media (min-width: 768px) {
  .sub {
    font-size: 24px;
    padding: 0 24px;
    margin-bottom: 0;
  }
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: end;
}

.fs14 {
  font-size: 0.875rem;
}

.fs24 {
  font-size: 24px;
}

.fc-white {
  color: #fff;
}

.fc-pachi {
  color: #c00;
}

.fc-slot {
  color: #0e5487;
}

.fc-blue {
  color: #2589d0;
}

.fc-red {
  color: #D8455C;
}




/* ---- background color P/S ---------------------------------------- */
.bg-pachi {
  background-color: #ffd6d6 !important;
}

.bg-slot {
  background-color: #acd2ed !important;
}





/* ---- border ---------------------------------------- */
.bb {
  border-bottom: solid 1px #cfcfcf;
}



/* ---- page top ---------------------------------------- */
#pagetop {
  position: fixed;
  bottom: 1.5em;
  right: 1.5em;
  width: 64px;
  height: 64px;
  z-index: 20;
}


/* ---- google map responsive ---------------------------------------- */
.g-map {
  position: relative;
  padding-top: 56.25%;
  /* or 75%;(4:3) */
  height: 0;
  overflow: hidden;
}

.g-map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ---- youtube responsive ---------------------------------------- */
.video {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.video iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}





/*------------------------------------------------------------------------------

  layout

------------------------------------------------------------------------------*/
/* ---- grid ---------------------------------------- */
.grid-1col {
  display: grid;
  grid-template-rows: 560px;
  grid-template-columns: 1fr;
}

.grid-2col {
  display: grid;
  grid-template-rows: 560px;
  grid-template-columns: 1fr 240px;
}


/* ---- flex ---------------------------------------- */
.flex {
  display: flex;
}

.flex-between {
  display: flex;
  justify-content: space-between;
}

.flex-center {
  display: flex;
  justify-content: center;
}

.flex-wrap {
  flex-wrap: wrap;
}

.align-item-end {
  align-items: end;
}

/* ---- position ---------------------------------------- */
.position-relative {
  position: relative;
}

.position-right {
  position: absolute;
  right: 0;
  top: 0;
}

.position-right-detail {
  position: absolute;
  right: 7px;
  top: 7px;
}



/*------------------------------------------------------------------------------

  MarketLive管理画面

------------------------------------------------------------------------------*/
/* アカウント一覧 table */
#admin {
  min-width: 705px;
}

.account-control {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.account-search {
  display: flex;
  align-items: flex-end;
}

.account-search div:first-child {
  width: 240px;
}

.num-of-accounts {
  font-size: 0.875rem;
  color: #2589d0;
}

.account-list {
  width: 100%;
  font-size: 0.75rem;
  /* table-layout: fixed; */
  border-collapse: collapse;
}

.account-list th {
  background-color: #d2d2d2;
  white-space: nowrap;
}

.account-list tr:nth-child(2n) {
  background-color: #e0f4ff;
}

.account-list th,
.account-list td {
  /* width: calc(100% / 6); */
  padding: 0.35rem;
  border: solid 1px #333;
}

.account-list td:last-child {
  white-space: nowrap;
}

/* アカウント追加/編集 */
.add-account-wrap {
  max-width: 320px;
  margin: 0 auto;
}

.update {
  background-color: #e0f4ff;
  text-align: center;
  padding: 1rem;
  border-radius: 4px;
}

/* お知らせ一覧 table */
.information-list {
  width: 100%;
  font-size: 0.75rem;
  /* table-layout: fixed; */
  border-collapse: collapse;
}

.information-list th {
  background-color: #d2d2d2;
  white-space: nowrap;
}

.information-list tr:nth-child(2n) {
  background-color: #e0f4ff;
}

.information-list th,
.information-list td {
  /* width: calc(100% / 6); */
  padding: 0.35rem;
  border: solid 1px #333;
}

.information-list td:nth-of-type(1),
.information-list td:nth-of-type(6),
.information-list td:nth-of-type(7) {
  text-align: center;
}

.information-list td:nth-of-type(3),
.information-list td:nth-of-type(5) {
  max-width: 120px;
}

.information-list td:nth-of-type(4) {
  max-width: 240px;
}

.information-list td:nth-of-type(9),
.information-list td:nth-of-type(10) {
  text-align: center;
  white-space: nowrap;
}

.information-list td:nth-of-type(9) a,
.information-list td:nth-of-type(10) a {
  display: block;
  margin: 4px 0;
}

/* いいね詳細 */
.like-list {
  width: 25%;
  font-size: 0.75rem;
  /* table-layout: fixed; */
  border-collapse: collapse;
}

.like-list th {
  background-color: #d2d2d2;
  white-space: nowrap;
}

.like-list tr:nth-child(2n) {
  background-color: #e0f4ff;
}

.like-list th,
.like-list td {
  text-align: center;
  padding: 0.35rem;
  border: solid 1px #333;
}

/* パスワード表示/非表示（目アイコン） */
.password-wrapper {
  display: flex;
  border: 1px solid #ddd;
  border-radius: 5px;
}
 
.password__input {
  flex: 1;
  outline: none;
  appearance: none;
  padding: 10px 0 10px 10px;
  border: none;
  border-radius: 5px 0 0 5px;
  font-size: 16px;
}

.password__toggle {
  width: 40px;
  border: none;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='48' width='48'><path d='M24 31.5q3.55 0 6.025-2.475Q32.5 26.55 32.5 23q0-3.55-2.475-6.025Q27.55 14.5 24 14.5q-3.55 0-6.025 2.475Q15.5 19.45 15.5 23q0 3.55 2.475 6.025Q20.45 31.5 24 31.5Zm0-2.9q-2.35 0-3.975-1.625T18.4 23q0-2.35 1.625-3.975T24 17.4q2.35 0 3.975 1.625T29.6 23q0 2.35-1.625 3.975T24 28.6Zm0 9.4q-7.3 0-13.2-4.15Q4.9 29.7 2 23q2.9-6.7 8.8-10.85Q16.7 8 24 8q7.3 0 13.2 4.15Q43.1 16.3 46 23q-2.9 6.7-8.8 10.85Q31.3 38 24 38Zm0-15Zm0 12q6.05 0 11.125-3.275T42.85 23q-2.65-5.45-7.725-8.725Q30.05 11 24 11t-11.125 3.275Q7.8 17.55 5.1 23q2.7 5.45 7.775 8.725Q17.95 35 24 35Z'/></svg>") no-repeat center center;
  background-size: 50% auto;
  cursor: pointer;
}

.password__toggle.is-visible {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='48' width='48'><path d='m31.45 27.05-2.2-2.2q1.3-3.55-1.35-5.9-2.65-2.35-5.75-1.2l-2.2-2.2q.85-.55 1.9-.8 1.05-.25 2.15-.25 3.55 0 6.025 2.475Q32.5 19.45 32.5 23q0 1.1-.275 2.175-.275 1.075-.775 1.875Zm6.45 6.45-2-2q2.45-1.8 4.275-4.025Q42 25.25 42.85 23q-2.5-5.55-7.5-8.775Q30.35 11 24.5 11q-2.1 0-4.3.4-2.2.4-3.45.95L14.45 10q1.75-.8 4.475-1.4Q21.65 8 24.25 8q7.15 0 13.075 4.075Q43.25 16.15 46 23q-1.3 3.2-3.35 5.85-2.05 2.65-4.75 4.65Zm2.9 11.3-8.4-8.25q-1.75.7-3.95 1.075T24 38q-7.3 0-13.25-4.075T2 23q1-2.6 2.775-5.075T9.1 13.2L2.8 6.9l2.1-2.15L42.75 42.6ZM11.15 15.3q-1.85 1.35-3.575 3.55Q5.85 21.05 5.1 23q2.55 5.55 7.675 8.775Q17.9 35 24.4 35q1.65 0 3.25-.2t2.4-.6l-3.2-3.2q-.55.25-1.35.375T24 31.5q-3.5 0-6-2.45T15.5 23q0-.75.125-1.5T16 20.15Zm15.25 7.1Zm-5.8 2.9Z'/></svg>");
}

@media (any-hover: hover) {
  .password__toggle:hover {
    opacity: 0.7;
  }
}


/* csv ダウンロード */
.dl-wrap {
  background-color: #efefef;
  padding: 1.5rem;
  border: solid 1px #cfcfcf;
  border-radius: 8px;
}