:root {
    --editor-color-01: #e8f7f0;
    --editor-color-02: #d6aa00;
    --editor-color-03: #fff5ce;
    --editor-color-04: #007F41;
    --editor-color-05: #d97772;
    --editor-color-06: #eaeaea;
    --editor-color-07: #000000;
    --editor-color-08: #ffffff;
    --editor-color-09: #545454;
}

/* 親カスタム */
#actual-object-form label[for="actual_object_parent_actual_object_id"]::before {
        content: "↓　親特集ページ著者からこの記事を執筆した著者を選択してください。選択しない場合は著者が非表示になります。";
    display: block;
    margin: 1em 0;
    background-color: #606060;
    color: #fff;
    border-radius: 50px;
    width: fit-content;
    padding: 8px 10px;
}

/* チェックボックス */
#actual-object-form label.sig span:before {
    width: 2.2em;
}

/* ##### 擬似要素 ##### */
#actual-object-form div.uk-panel-box {
    position: relative;
    background-color: #fff;
}

#actual-object-form div.uk-panel-box::before {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: auto;
    display: inline-block;
    display: none;
    counter-increment: number;
    padding: 0.2em 0.5em 0.2em 0.5em;
    font-size: 12px;
    color: white;
    line-height: 1.2;
    text-align: center;
    background: var(--editor-color-02);
    position: absolute;
    top: 0;
    left: 0;
}

#actual-object-form div.uk-panel-box:last-of-type:before {
    display: none;
}

/* 必須項目 */
#actual-object-form .uk-form-row .actual-object-label.required {
    font-weight: bold;
    color: #000;
}

#actual-object-form .uk-form-row label.required:after {
    content: "※";
    margin-left: 1em;
    font-size: 1em;
    line-height: 0;
    position: absolute;
    top: 1.1em;
    color: #ee5240;
    scale: 1.2;
    transform: translate(-5px, 0px);
}

/* セクション１ */
#actual-object-form div.uk-panel-box:nth-of-type(5),#actual-object-form div.uk-panel-box:nth-of-type(6) {
    padding-top: 30px;
    background-color: var(--editor-color-01);
}

#actual-object-form div.uk-panel-box:nth-of-type(5)::before,#actual-object-form div.uk-panel-box:nth-of-type(6)::before {
    content: "セクション１";
    display: inline-block;
    background-color: var(--editor-color-04);
}

/* セクション２ */
#actual-object-form div.uk-panel-box:nth-of-type(7),#actual-object-form div.uk-panel-box:nth-of-type(8) {
    padding-top: 30px;
    background-color: var(--editor-color-03);
}

#actual-object-form div.uk-panel-box:nth-of-type(7)::before,#actual-object-form div.uk-panel-box:nth-of-type(8)::before {
    content: "セクション２";
    display: inline-block;
    background-color: var(--editor-color-02);
}

/* セクション３ */
#actual-object-form div.uk-panel-box:nth-of-type(9),#actual-object-form div.uk-panel-box:nth-of-type(10) {
    padding-top: 30px;
    background-color: var(--editor-color-01);
}

#actual-object-form div.uk-panel-box:nth-of-type(9)::before,#actual-object-form div.uk-panel-box:nth-of-type(10)::before{
    content: "セクション３";
    display: inline-block;
    background-color: var(--editor-color-04);
}

/* セクション４ */
#actual-object-form div.uk-panel-box:nth-of-type(11),#actual-object-form div.uk-panel-box:nth-of-type(12) {
    padding-top: 30px;
    background-color: var(--editor-color-03); 
}

#actual-object-form div.uk-panel-box:nth-of-type(11)::before,#actual-object-form div.uk-panel-box:nth-of-type(12)::before{
    content: "セクション４";
    display: inline-block;
    background-color: var(--editor-color-02);
}

/* セクション５ */
#actual-object-form div.uk-panel-box:nth-of-type(13),#actual-object-form div.uk-panel-box:nth-of-type(14) {
    padding-top: 30px;
    background-color: var(--editor-color-01);
}

#actual-object-form div.uk-panel-box:nth-of-type(13)::before,#actual-object-form div.uk-panel-box:nth-of-type(14)::before{
    content: "セクション５";
    display: inline-block;
    background-color: var(--editor-color-04);
}

/* 商品１ */
#actual-object-form div.uk-panel-box:nth-of-type(-n+19):not(:nth-of-type(-n+14)) {
    padding-top: 30px;
    background-color: var(--editor-color-06);
}

#actual-object-form div.uk-panel-box:nth-of-type(-n+19):not(:nth-of-type(-n+14))::before {
    content: "商品１";
    display: inline-block;
    background-color: var(--editor-color-07);
}

/* 商品２ */
#actual-object-form div.uk-panel-box:nth-of-type(-n+24):not(:nth-of-type(-n+19)) {
    padding-top: 30px;
    background-color: var(--editor-color-08);
}

#actual-object-form div.uk-panel-box:nth-of-type(-n+24):not(:nth-of-type(-n+19))::before {
    content: "商品２";
    display: inline-block;
    background-color: var(--editor-color-09);
}

/* 商品３ */
#actual-object-form div.uk-panel-box:nth-of-type(-n+29):not(:nth-of-type(-n+24)) {
    padding-top: 30px;
    background-color: var(--editor-color-06);
}

#actual-object-form div.uk-panel-box:nth-of-type(-n+29):not(:nth-of-type(-n+24))::before {
    content: "商品３";
    display: inline-block;
    background-color: var(--editor-color-07);
}

/* 商品４ */
#actual-object-form div.uk-panel-box:nth-of-type(-n+34):not(:nth-of-type(-n+29)) {
    padding-top: 30px;
    background-color: var(--editor-color-08);
}

#actual-object-form div.uk-panel-box:nth-of-type(-n+34):not(:nth-of-type(-n+29))::before {
    content: "商品４";
    display: inline-block;
    background-color: var(--editor-color-09);
}
