/* 文字コード設定
   TearaPad UTF-8N 改行LF */
@charset "utf-8";

/* CSS Reset p108*/
*,
::before,
::after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

/* ベースカラー設定 */
body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.5;
  background: radial-gradient(ellipse at bottom, #295380 80%, #06106a 100%);
}


/* ヘッダー */
/*.header {*/
  /*background: #06106a;}*/


.header-inner {
  /*background: linear-gradient(90deg, #acca49 0%, #06106a 100%);*/
  /*background-color: #89b9ec;*/

  background-image: url("../img/night_back_light.png");
  background-size: cover;      /* 画像をヘッダー全体に拡大縮小 */
  background-position: center; /* 中央寄せ */
  background-repeat: no-repeat; /* 繰り返しなし */

  max-width: 800px;
  /*height: 90px;*/
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.header_logo img {
  width: 80px;
  height: auto;
  border-radius: 50%;
  margin-left: 15px;
  box-shadow: 0 2px 8px rgba(180, 138, 0, 0.08);
}

header h1 {
  margin: 10px 0 0 0;
  font-size: 1.5em;
  color: #ffffff;
  letter-spacing: 0em;
  font-weight: bold;
  white-space: nowrap; /* ← 追加 */
}

.header-intro{
  display: flex;
  flex-direction: column;
  font-size: 1.2em;
  margin: 0.5em 0em 0.5em 2em;
}


header p {
  font-size: 0.9em;
  color: #b48a00;
  font-weight: bold;
  text-shadow:
  -1px -1px 0 #fff,
    1px -1px 0 #fff,
  -1px  1px 0 #fff,
    1px  1px 0 #fff;
}

.user-menu a {
  color: #b48a00;
  text-decoration: none;
  margin: 0px 8px;
  font-weight: bold;
}
.user-menu a:hover {
  text-decoration: underline;
}

/*シェア　index.php用　x,lne*/
#sns-box {
  display: flex;
  justify-content: center;
}

/* X（旧Twitter）アイコン用：黒い丸背景 */
.sns-box-x {
  position: relative;
  display: inline-block;
  width: 32px;
  height: 32px;
  margin: 0 10px;
  border-radius: 50%;
  background: #000;
  overflow: hidden;
  vertical-align: middle;
}

.sns-box-x img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  transform: translate(-50%, -50%);
  z-index: 1;
}

/* Instagramアイコン用：背景なし */
.sns-box-ig {
  position: relative;
  display: inline-block;
  width: 32px;
  height: 32px;
  margin: 0 10px;
  overflow: hidden;
  vertical-align: middle;
}

.sns-box-ig img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 32px;
  height: 32px;
  transform: translate(-50%, -50%);
  z-index: 1;
}


/*シェア　diagnose.php用　x,lne*/

/*シェア　x,lne*/
#sns-share {
display: flex;
/*align-items: center;*/
justify-content: center; /* 中央寄せ*/
/*gap: 3em;*/
margin: 2em 0.5em 1.0em 0.5em;      
}

#share-box {
display: flex;
flex-wrap:wrap;
gap:1em;
align-items: center;
box-sizing: border-box;
color: white;
font-size: 0.8rem;
text-align: center;
text-decoration: none;
transition: 0.3s;
}

/* 各シェアボタンのaタグを正方形・中央寄せ */
#share-box a {
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  padding: 0;
}

#share-x {
background-color: #111319;
}

#share-line {
background-color: #5DB40F;
}

.share-btn {
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  padding: 0;
  background: #fffbe6;
}

.share-btn svg {
  width: 18px;
  height: 18px;
  display: block;
}

.share-btn svg path {
  fill: #fff; /* 白色にしたい場合 */
}



/* プライバシーに関するダイアログ */

/* モーダルダイアログ */

.modal_prv {
  display: none;
  position: fixed;
  z-index: 9999;
/*  left: 0;*/
  left: 50%;
  transform: translateX(-50%);
/*  width: 100vw;*/
/*  max-width: 100vw;*/
  bottom: 20px; /* ← ここを調整 */
/*  width: 100vw;*/
  height: auto;
  background: transparent;
  justify-content: center;
  align-items: flex-end;
  pointer-events: none;
}

.modal_prv.show {
  display: flex;
}

.modal-content_prv {
  background: #fff;
/*  border-radius: 10px 10px 0 0;*/
  padding: 0.6em 0.6em 0.6em 0.6em;
  max-width: 500px;
  min-width: 300px;
  box-shadow: 0 -2px 16px rgba(0,0,0,0.15);
  text-align: center;
  margin-bottom: 200px;
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.modal-content_prv p, .modal-content_prv button {
  text-align: left;
  font-size: 0.7em;
  color: #333;
}

.modal-content_prv button {
  margin: 0.5em 0.5em 0.5em 0.5em; 
  padding: 0.4em 0.6em;
  font-size: 0.7em;
  border: none;
  border-radius: 5px;
  background: #295380;
  color: #fff;
  cursor: pointer;
}

.modal-content_prv button:hover {
  background: #18304b;
}




/* フッター */
footer.footer {
  /*height: 90px;*/
  background: #06106a;
  color: #ffffff;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  /*display: flex;*/
  /*border-top: 2px solid #ffe082;*/
  font-size: 0.95em;
}

.footer-inner {
  background-image: url("../img/night_back_light.png");
  /*background-size: cover;*/      /* 画像をヘッダー全体に拡大縮小 */
  background-position: center; /* 中央寄せ */
  background-repeat: no-repeat; /* 繰り返しなし */

  max-width: 800px;
  /*height: 110px;*/
  margin-left: auto;
  margin-right: auto;
  /*display: flex;*/
  align-items: center;
  justify-content: space-between; /* 必要に応じて調整 */
  background-color: #89b9ec;
}

.footer-menu {
  margin: 0;
  padding: 10px ;
  display: flex;
  justify-content: center; /* 必要に応じて調整 */
  /*background: #4754c4;*/
  gap: 1.5em;                /* リンク同士の間隔 */
  background-color: rgba(255,255,255,0.2); /* 0.7は透明度。0=完全透明, 1=不透明 */
}

.footer-links {
  display: flex;
  font-size: 0.7em;
  color: #ffffff;
  padding: 5px 0;
  justify-content: center; /* 中央寄せ */
  gap: 1.5em;                /* リンク同士の間隔 */
}

.footer-links a{
  color: #ffffff;

}

.footer-corp{
  /*flex: 1;  フッター内の要素を均等に配置 */
  font-size: 0.8em;
  color: #ffffff;
  flex: none;
  width: auto;
  padding: 0px 10px; /* 必要なら余白を追加 */
  text-align: center; /* 右寄せ */
}