@charset "utf-8";

/* トグルUI */
.toggle-box { display: none; }
.toggle-btn{
  display:inline-block;
  padding:8px 12px;
  margin:10px 0;
  background:#4d71b1;
  color:#fff;
  border-radius:6px;
  cursor:pointer;
  font-size: 2rem;
}
.addParts01 .scrollArea .flame iframe {
    width: 100%;
}
iframe {
    margin: 0 auto;
    display: block;
    max-width: 100%;
}
/* ここがポイント：max-heightを使わずgridで開閉 */
.toggle-content{
  display:grid;                 /* 中身を0→1frでスライド展開 */
  grid-template-rows:0fr;       /* 閉：高さゼロ */
  transition:grid-template-rows .3s ease;
  /* アニメの見栄え用の余白 */
  margin-top:0;
}
.toggle-inner{
  overflow:hidden;              /* 閉時に中身をクリップ */
}

/* 開いたら中身分だけ自動で伸びるので“切れない” */
.toggle-box:checked ~ .toggle-content{
  grid-template-rows:1fr;       /* 開：高さ自動（切れない） */
  margin-top:12px;
}

/* 既存カードのレイアウト */
.two-col-cards{ display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:640px){ .two-col-cards{ grid-template-columns:repeat(2,1fr); } }
.card{
  padding:20px; border:1px solid #e5e7eb; border-radius:12px; background:#fff;
}

/* 余白の食い合いで下が欠ける場合の保険 */
.toggle-inner > :last-child{ margin-bottom:0; }

/* デフォルトは「開く」 */
.toggle-btn::after {
  content: "【⊕開く】その他の議事録作成に関する情報";
  cursor: pointer;
}

/* input の"直後の div" の中の label に当てる */
#toggle1:checked + div > .toggle-btn::after {
  content: "【⊖閉じる】その他の議事録作成に関する情報";
}

/* 開閉コンテンツの表示切替 */
.toggle-content { display: none; }
#toggle1:checked ~ .toggle-content { display: block; }




/*///２つ並びBOX///*/
.two-col-cards{
  --bg:#fff;
  --border:#e5e7eb;      /* = gray-200 */
  --text:#111827;        /* = gray-900 */
  --muted:#6b7280;       /* = gray-500 */
  --accent:#2563eb;      /* = blue-600 */
  --accent-hover:#1d4ed8;/* = blue-700 */

  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin:24px 0;
}

@media (min-width: 640px){           /* 横2列（タブレット〜） */
  .two-col-cards{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:20px;
  }
}

.card{
  display:flex;
  flex-direction:column;
  justify-content:space-between;      /* ボタンを下に寄せやすく */
  gap:12px;
  padding:20px;
  border:1px solid var(--border);
  border-radius:9px;
  background:#f1fdff;
  color:var(--text);
  box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  min-height: 180px;                  /* お好みで調整 */
	    border: solid 2px;
}

.card__title{
    font-size: 2.5rem;
    line-height: 1.4;
    margin: 0;
    background: #6f84a9;
    padding: 1.2rem;
    border-radius: 1rem;
    color: #fff;
}

.card__text{
  color:var(--muted);
  margin:0;
  line-height:1.8;
  flex:1;                             /* 本文が伸びてもボタン位置を維持 */
}

.card__link{
  align-self:flex-start;
  display:inline-flex;
  gap:.5em;
  text-decoration:none;
  font-weight:600;
  color:var(--accent);
  padding:10px 14px;
  border:1px solid var(--accent);
  border-radius:9999px;
  transition:background-color .2s, color .2s, border-color .2s;
}

.card__link::after{
  content:"→";
  transform:translateX(0);
  transition:transform .2s;
}

.card__link:hover{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent-hover);
}

.card__link:hover::after{
  transform:translateX(2px);
}




#contents .addParts05 .item_body p {
    height: unset !important;
    margin-bottom: 2rem;
}
.addParts05 .item_body table {
    height: unset !important;
    margin-bottom: 2rem;
}
.addParts05 .item_body {
    height: unset !important;
}
#contents .addParts05 .item .btn-link {
    position: unset;
}
.addParts02 .caption {
    text-align: center;
}

.addParts02 .box .caption {
    text-align: left;
}
#g-nav ul li a .fuki{
        display: block;
        background: #4d729f;
        position: absolute;
        padding: 2rem 1rem;
        font-weight: bold;
        border-radius: 6rem;
        font-size: 13px;
        top: -9rem;
        left: -2rem;
        color: #fff;
    }

    #g-nav ul li a .fuki:after {
        display: block;
        content: "";
        position: absolute;
        right: 1rem;
        bottom: -0.3rem;
        border-top: 1rem solid transparent;
        border-bottom: 1rem solid transparent;
        border-left: 2rem solid #4d729f;
        transform: rotate(52deg);
    }



.main .responsive-table table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    margin: 20px 0;
}

.main .responsive-table th,
.main .responsive-table td {
    padding: 10px;
    border: 1px solid #333;
    text-align: center;
    vertical-align: middle;
}

.main .responsive-table th {
    background: #c1e3f5;
    font-weight: bold;
    white-space: normal; /* ヘッダーの折り返しを防ぐ */
}

.main .responsive-table tbody th {
    background: #eaf6ff;
    font-weight: bold;
    white-space: normal; /* ヘッダーの折り返しを防ぐ */
}

.blue-circle{
    color: #497fa1;
    font-size: 2.4rem;
    font-weight: bold;
}

.gray-circle{
    color: #858f8e;
    font-size: 2.4rem;
    font-weight: bold;
}
	.sp-txt{
		display:none;
		text-align:center;
	}

.addParts05-ttl {
    font-size: 2.4rem;
    font-weight: bold;
    margin: 2rem 0;
    color: #103472;
    background: #d4f1f7;
    width: 50%;
    text-align: center;
}

.addParts05-txt{
	padding: 2.5rem 1rem 1.5rem 1rem;
}

#index .addh2 h2 {
    font-size: 3rem;
    text-align: center;
    margin: 4rem 0 2rem;
}

#index .addh2 {
    width: 800px;
    margin: 0 auto;
    max-width: 100%;
}


.bnr {
	display:block;
	width:100%;
	margin-bottom:2rem;
}

/*----------------------------------------------------
    PCサイトcss
----------------------------------------------------*/
@media screen and (min-width: 600px) {
/*/////////////PC用のCSSをここに作成してください。/////////////*/



.addParts02 .block .inner iframe {
    width: 830px;
    height: 500px;
}
.addParts01 .companyName_wrap ul.hgt {
    min-height: 26rem;
}

.addParts01 .companyName_wrap ul {
    min-height: 6rem;
}

.responsive-table .btn-web {
    margin: 0 0 2rem;
}

.responsive-table .btn-web a {
    width: auto;
    padding: 1rem 4rem 1rem 3rem;
}

.addParts01.low-page.single {
    margin: 3rem 0;
}

.main.bottom-table {
    width: 1100px;
    margin: auto;
}

}/*////////////////////PC用CSSここまで///////////////////*/



/*----------------------------------------------------
    SPサイトcss
----------------------------------------------------*/
@media screen and (max-width: 599px) {
/*/////////////SP用のCSSをここに作成してください。/////////////*/
/*/////////////必ず中括弧の中に作成してください。/////////////*/
	.main .responsive-table{
		width:95%;
		margin:auto;
		overflow-y: scroll;
	}

	.main .responsive-table table{
		width:1500px;
	}

	.sp-txt{
		display:block;
		text-align:center;
	}

.addParts05-ttl {
    font-size: 2.4rem;
    font-weight: bold;
    margin: 2rem 0;
    color: #103472;
    background: #d4f1f7;
    width: 100%;
    text-align: center;
}

#index .addh2 h2 {
    font-size: 2.6rem;
}

.btn-web, p.btn-web {
    margin: 1rem auto;
}

.responsive-table p.btn-web a {
    width: auto;
    padding: 1rem 4rem 1rem 3rem;
}

.addParts01.low-page.single {
    margin: 3rem 0;
}

.main.bottom-table {
    margin: auto;
}

#index h3:not([class])::before, #category h2:not([class])::before, #page h2:not([class])::before {
    right: 0;
}

.bnr {
	display:none;
}
#page-top {
        bottom: 10%;
}

.responsive-table .sticky {
    position: sticky;
    z-index: 2;
    left: 0;
	width:130px;
}
	
	
	
	
	
	
	
	

}