/*--css タブ--*/
.tabs {
  width:100%;
  max-width:800px;
  margin: 20px auto;
}

/* ラジオボタンを非表示 */
.tab-buttons input[type="radio"] {
  display: none;
}

/* タブボタンのスタイル */
.tab-buttons label {
  display: inline-block;
  padding: 10px 20px;
  background: #eee;
  cursor: pointer;
  border-radius: 4px 4px 0 0;
}

/* 選択されているタブのスタイル */
.tabs:has(#tab1:checked) label[for="tab1"],
.tabs:has(#tab2:checked) label[for="tab2"],
.tabs:has(#tab3:checked) label[for="tab3"],
.tabs:has(#tab4:checked) label[for="tab4"],
.tabs:has(#tab5:checked) label[for="tab5"] {
  background: var(--dark_orange,#f4433);
  color: white;
}

/* タブコンテンツの基本スタイル */
.tab-content {
  display: none;
  padding: 20px;
  background: white;
  border: 1px solid #ddd;
}

/* 選択されているタブのコンテンツを表示 */
.tabs:has(#tab1:checked) .tab-content[data-tab="tab1"],
.tabs:has(#tab2:checked) .tab-content[data-tab="tab2"],
.tabs:has(#tab3:checked) .tab-content[data-tab="tab3"],
.tabs:has(#tab4:checked) .tab-content[data-tab="tab4"],
.tabs:has(#tab5:checked) .tab-content[data-tab="tab5"] {
  display: block;
}

/*--common--*/
section{padding:0 1rem;margin:0 auto 1rem;width:100%;}
h3{margin:2rem auto;font-size:1.2rem;}
h3.ttl{border-bottom:1px #ccc solid;font-weight:normal;position:relative;}
h3.ttl::before{content:"";display:inline-block;width:.5rem;height:1rem;margin-right:.5rem;background:var(--base_orange,#ff7100);}

h4{border-left:.5rem var(--dark_orange,#f44336) solid;margin-bottom:1rem;padding:.5rem;font-size:1.1rem;}
h5{margin:.5rem auto;font-size:1.1rem;border-bottom:1px #000 solid;}
.bod_b{border-bottom:1px #000 solid}

:is(a[href*=".pdf"],a[href*=".doc"],a[href*=".DOC"],a[href*=".xls"])::after{display:inline-block;margin-left:.5rem;}
a[href*=".pdf"]::after{content:url(/certificate/img/icon_pdf.gif)}
a[href*=".doc"]::after,a[href*=".DOC"]::after{content:url(/certificate/img/icon_doc.gif)}
a[href*=".xls"]::after{content:url(/certificate/img/icon_xls.gif)}

/*--index--*/
#submenu.top{width:100%;max-width:980px;margin:1rem auto;
    ul{padding:1rem;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;border-radius:1rem;
        li{width:calc(100% / 5 - 1rem);margin:0;}
    }
}

@scope (.index) to (body){
.cards{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;
    dl{margin:0 auto;width:calc(100% / 3 - 1rem);padding:1rem;border:1px #999 solid;
        dt{font-size:1.1rem;margin:0 auto 1rem;padding:.5rem 1rem;font-weight:bold;color:#fff;background:var(--norm_orange,#ff9800);border-radius:.5rem;text-shadow:1px 1px 1px #666;}
        dd{margin:0 auto;padding-left:.5rem;font-size:.9rem;}
        dd:has(b){margin-top:.5rem;display:grid;grid-template-columns:auto 1fr;gap:0 .5rem;
            b{display:inline-block;padding:0 .5rem;color:#fff;background:var(--norm_orange,#ff9800);border-radius:.5rem;text-align:center;}
        }
    }
}
.payment{width:90%;margin:0 auto;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:2rem;
    ul{margin:0;padding:1rem 2rem 1rem 3rem;font-size:1.2rem;border:1px #666 solid;width:fit-content;}
    dl{width:90%;margin:0 auto;padding:1rem;
        dt{font-weight:bold;margin:0 0 1rem;padding:0;font-size:1.2rem;}
        dd{margin:0 0 0 1rem;padding:0;width:100%;
            dl{width:100%;margin:0 0 .5rem;padding:0;display:grid;grid-template-columns:repeat(4,calc(100% / 4 - 1rem));gap:1rem;border-bottom:1px #666 dashed;align-content:center;
                dt{font-weight:normal;font-size:1.1rem;margin:0;}
                dd{margin:0}
            }
        }
      }
}

}

/*--entry--*/
@scope (.entry) to (body){
    ol.step{list-style:none;padding:0;margin:0;counter-reset:step;
        > li{padding:1rem 1rem 1rem 3rem;position:relative;margin-bottom:2rem;border:1px #666 solid;border-radius:1rem 0 0 0;font-weight:bold;
            ul{margin:.5rem 0;padding-left:1rem;line-height:2rem;font-weight:normal;
                li{display:flex;
                    p{margin:0;font-size:.9rem}
                }
            }
        }
        > li::before{counter-increment:step;content: counter(step);position:absolute;left:.8rem;top:.8rem;width:1.5rem;height:1.5rem;background:var(--dark_orange,#f44336);color:#fff;text-align:center;border-radius:50%;font-weight:bold;line-height:1.5rem;}
    > li+li::after{content:"";display:block;width:2rem;height:1rem;background:#666;clip-path:polygon(0 0, 100% 0, 50% 100%);position:absolute;top:-1.5rem;left:0;right:0;margin:auto }
    }
    
    p.tri::before{content:"";width:1rem;height:1rem;display:inline-block;background:var(--dark_orange,#f44336);clip-path:polygon(0 0,100% 0,50% 100%);margin-right:.5rem;}
    p.tri:has(a){padding:.5em 1em;border:1px #999 solid;border-radius:1rem;}
    p.tri a{display:block;margin:.5rem 0 .5rem 2em;}

    dl.doc_link{margin:.5rem auto;
        dt{font-size:1.1rem;font-weight:bold;}
        dt::before{content:"";width:.8rem;height:.8rem;display:inline-block;background:#333;margin-right:.5rem;}
        dd{margin-left:2rem;margin-bottom:1rem;
            ul{padding-left:1rem;color:#f00;
                li::marker{color:#000}
                li{margin-bottom:.5rem;
                a{display:block;}
                }
               }
        
           }
         }

    ol.kakko{margin-left:2rem;}
}

@scope (.change) to (body){
    table{border-collapse:collapse;margin:1rem auto;border:1px #999 solid;
        th{background:#fffad2;}
        th[colspan="3"]{width:30%;}
        tr:nth-of-type(even) td{background:#fafafa;}
        th,td{padding:.5rem;border:1px #999 solid;}
        td{font-size:.9rem;text-align:center;
            ul{padding-left:0;margin-bottom:0;
                li{display:flex;justify-content:flex-start;align-items: center;gap:.5rem;margin-bottom:.5rem;
                    p{margin:0;}
                    P:last-child{margin:0 0 0 auto;}
                }
                li::before{content:"";display:inline-block;width:.5rem;height:.5rem;background:#666;border-radius:50%;margin-right:.5rem;}
                li:last-child{margin-bottom:0}
            }
            p.kome{font-size:.8rem;}
        }
        th:has(br){font-size:.8rem}
        td:nth-of-type(2){text-align:left}
        td span,th span{display:inline-block;font-size:.7rem}
        th:has(span){padding:.5rem 0rem;}
    }
    ul.dotline{
     li{display:flex;justify-content: space-between;position:relative;margin-bottom:.5rem;
         P{padding:0 .5rem;background:#fff;margin:0;z-index:1}
        }
        li::before{content:"";display:inline-block;width:.5rem;height:.5rem;background:#000;position: absolute;left: -.5rem;top: 25%;;}
     li::after{content:"";width:100%;height:1px;border-top:1px #999 dotted;
         position:absolute;top:50%;left;0}
    }
    p.atte{margin:2rem auto;padding:1rem;border:1px #666 solid;border-radius:1rem}
}

@scope (.retire) to (body){
       table{width:90%;border-collapse:collapse;margin:1rem auto;border:1px #999 solid;
        tr:nth-of-type(even) td{background:#fafafa;}
        th,td{padding:.5rem;border:1px #999 solid;}
        td{font-size:1rem;text-align:left;
            p{margin:0;}
                }
            p.kome{font-size:.8rem;}
            td:nth-of-type(2){text-align:center}
            td span{display:inline-block;font-size:.9rem}
           td span.star{color:var(--norm_orange,#ff9800);margin-left:.5rem;}
           h5{font-size:1rem;margin:.5rem auto;border-bottom:1px #000 solid;}
        }
}

@scope (.proof) to (body){
    h3.link{font-size:1rem;padding:.5rem;border:1px var(--norm_orange,#ff9800) solid;border-radius:.5rem;font-weight:normal;
        a{display:inline-block;margin-left:.5rem;}
    }
    dl.inq{margin:2rem auto;padding:1rem .5rem;border:1px var(--dark_orange,#f44336) solid;border-radius:1rem;
        dt{font-weight:bold;}
        dd{margin-left:1.5rem;}
        dd+dd{font-size:.9rem;}
    }
    ul{margin-left:2rem;}
}