@charset "Shift_JIS";

#main_contents{
    width: initial;
    small{
        display: block;
        line-height: 1.2;
    }
}
.support-info-head{
    position: relative;
    margin-block: 40px 16px;
    padding: 25px 150px 20px 120px;
    /* グラデーションを下、画像を上に重ねる */
    background:
    url(/kaigai/pkg/html/royalroad/support/info/img/icon_plane.png) no-repeat center left 25px / auto,
    url(/kaigai/pkg/html/royalroad/support/info/img/bg_head.png) no-repeat center right 25px / auto,
    linear-gradient(180deg, #fffdfe, #ececec);
    border: 1px solid #c3a564;
    box-sizing: border-box;
    &::before{
        content: "";
        position: absolute;
        left: -1px;
        top: -20px;
        display: block;
        width: 100%;
        height: 20px;
        background: linear-gradient(180deg,rgba(228, 208, 83, 1) 0%, rgba(173, 148, 42, 1) 50%, rgba(228, 208, 83, 1) 100%);
        border: 1px solid #c3a465;
    }
    h1{
        color: transparent;
        font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
        font-size: 35px;
        font-weight: bold;
        line-height: 1.2;
        /* &::before{
            content: url(/kaigai/pkg/html/royalroad/support/info/img/icon_plane.png);
            width: 74px;
            height: 74px;
        } */
        span > span{
        background: linear-gradient(180deg,rgba(184, 162, 0, 1) 0%, rgba(166, 140, 1, 1) 50%, rgba(196, 176, 18, 1) 100%);


        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        }
    }
    @supports (-webkit-touch-callout: none) {
    /* macOS用フォント調整 */
        h1{
            font-weight: normal;
        }
    }
}

.tab .tab-btn{
    position: relative;
    flex: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 0px 20px;
    border: 1px solid #333333;
    text-indent: initial;
    font-size: 18px;
    font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
    font-weight: bold;
    background: #e8e8e8;
    background: linear-gradient(180deg, rgb(251 251 251) 0%, rgba(222, 222, 222, 1) 100%);
    &::after {
        content: "";
        position: absolute;
        right: 3px;
        bottom: 3px;
        display: block;
        width: 13px;
        height: 13px;
        background-color: #333333;
        clip-path: polygon(
            100% 0%,  /* 点1: 右上 */
            100% 100%, /* 点2: 右下 (ここが直角) */
            0% 100%   /* 点3: 左下 */
        );
    }
}
.tab .tab-btn.select{
    background: #f0d969;
    background: linear-gradient(180deg,#ceb42e 0%, #ecd952 100%);
}
.tab .tab-btn:hover{
    background: #f0d969;
    background: linear-gradient(180deg,#ceb42e 0%, #ecd952 100%);
}
/* タブ切り替え -----------------*/

#contentsBox{
    width: 870px;
    margin: 0 auto 20px;
}
h2{
    text-align: center;
}
h3.text{
    font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", serif;
    font-size: 27px;
    font-weight: 500;
    line-height: 1.2;
    padding-left: 1em;
    text-indent: -1em;
    &::before{
        content: url(/kaigai/pkg/html/royalroad/support/info/img/arrow_left.png);
    }
}
#contentsWrap h5 {
    position: relative;
    width: 805px;
    height: auto;
    padding: 4px 2px 2px 20px;
    background: transparent;
    background-color:#f0f2cb;
    &::before{
        content: "";
        position: absolute;
        left: 7px;
        top: 9px;
        width: 5px;
        height: 5px;
        background-color: #000000;
    }
}
dt{
    margin-bottom: 5px;
}