/* base */
@media screen and (min-width: 767px) {
    .custom-main.register {
        background-color: #FFF3ED;
        padding-bottom: 306px;
    }
}
@media screen and (max-width: 767px) {
    .custom-main.register {
        background-color: #FFF3ED;
        padding-bottom: 155px;
    }
}
/* sp */
@media screen and (max-width: 767px) {
    .register .contents-wrapper {
        width: 100%;
        padding:  0 4%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
}
/* tab */
@media screen and (min-width: 767px) and (max-width: 1440px) {
    .register .contents-wrapper {
        width: 100%;
        padding:  0 16.25%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
}
/* pc */
@media screen and (min-width: 1440px) {
    .register .contents-wrapper {
        width: 100%;
        max-width: 1440px;
        padding:  0 234px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
}

/* 必須・任意マーク */
@media screen and (min-width: 767px) {
    .mark-require {
        margin: 0;
        padding: 0;
        line-height: 1.5rem;
        width: 54px;
        font-weight: bold;
    }
    .mark-require.not-require::after {
        content: "任意";
        display: inline-block;
        margin: 0.25rem 0;
        padding: 6px 14px;
        border-radius: 20px;
        background-color: #D9D9D9;
        color: white;
        font-size: 13px;
        line-height: 10px;
    }
        
    .mark-require.require::after{
        content: "必須";
        display: inline-block;
        margin: 0.25rem 0;
        padding: 6px 14px;
        border-radius: 20px;
        background-color: #44CDFF;
        color: white;
        font-size: 13px;
        line-height: 10px;
    }
}
@media screen and (max-width: 767px) {
    .mark-require {
        margin: 0;
        padding: 0;
        line-height: 1.5rem;
        width: 54px;
        font-weight: bold;
    }
    .mark-require.not-require::after {
        content: "任意";
        display: inline-block;
        margin: 0.25rem 0;
        padding: 6px 14px;
        border-radius: 20px;
        background-color: #D9D9D9;
        color: white;
        font-size: 13px;
        line-height: 10px;
    }
        
    .mark-require.require::after{
        content: "必須";
        display: inline-block;
        margin: 0.25rem 0;
        padding: 6px 14px;
        border-radius: 20px;
        background-color: #44CDFF;
        color: white;
        font-size: 13px;
        line-height: 10px;
    }
}

/**
 * title
 */
 @media screen and (min-width: 767px) {
     .register .title-area {
         display: flex;
         flex-direction: column;
         align-items: center;
         width: 100%;
         height: 260px;
         padding: 119px 0 0 0;
     }
     .title-area-main {
         width: 196px;
         height: 54px;
     }
     .title-area-main img {
         width: 100%;
         height: 100%;
     }
     
     .title-area-sub h2 {
         font-weight: 700;
         font-size: 1.375rem;
         line-height: 1.25rem;
     }
 }
 @media screen and (max-width: 767px) {
    .register .title-area {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        height: 146px;
        padding: 53px 0 0 0;
    }
    .title-area-main {
        width: 152px;
        height: 42px;
    }
    .title-area-main img {
        width: 100%;
        height: 100%;
    }
    
    .title-area-sub h2 {
        font-weight: 700;
        font-size: 1rem;
        line-height: 1.25rem;
    }
 }
/**
 * main
 */
@media screen and (min-width: 767px) {
    .main-area {
        width: 100%;
        padding: 107px 8.3% 74px;
        background-color: white;
        border-radius: 15px;
    }
}
@media screen and (max-width: 767px) {
    .main-area {
        width: 100%;
        padding: 37px 7.24% 30px;
        background-color: white;
        border-radius: 7px;
    }
}
/**
 * ステップ画像エリア
 */
/* tab over */
@media screen and (min-width: 767px) {
    .main-area-step {
        display: flex;
        align-content: flex-start;
        width: 100%;
        padding: 0 11.23%;
        justify-content: space-between;
    }
    .main-area-step-list {
        position: relative;
        max-width: 168px;
        width: 26.75%;
    }
    .main-area-step-list:not(:last-of-type)::before {
        position: absolute;
        top: 50%;
        right: calc(-7.14% - min(2.708vw, 39px));
        content: "";
        display: flex;
        align-content: flex-start;
        border-bottom: 5px solid #ECECEC;
        width: min(2.708vw, 39px);
    }
}
/* sp */
@media screen and (max-width: 767px) {
    .main-area-step {
        display: flex;
        align-content: flex-start;
        width: 100%;
        padding: 0 0;
        justify-content: space-between;
    }
    .main-area-step-list {
        position: relative;
        max-width: 168px;
        width: 26.75%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .main-area-step-list:not(:last-of-type)::before {
        position: absolute;
        top: 50%;
        right: calc(-11.14% - min(2.708vw, 39px));
        content: "";
        display: flex;
        align-content: flex-start;
        border-bottom: 5px solid #ECECEC;
        width: min(2.708vw, 39px);
    }
    .main-area-step-list img {
        width: 100%;
    }
    /* sp サブタイトル 後から追加 */
    .main-area-step-sub {
        display: flex;
        align-content: flex-start;
        width: 100%;
        padding: 0 0;
        justify-content: space-between;
        margin: 7px 0 0 0;
    }
    .main-area-step-sub-title {
        position: relative;
        max-width: 168px;
        width: 26.75%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .main-area-step-sub p {
        margin: 0;
        padding: 0;
        align-content: center;
    }
    .main-area-step-sub-title {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .main-area-step-sub-title.orange p {
        color: #FF5701;
    }
    .main-area-step-sub-title.black p {
        color: black;
    }
    .main-area-step-sub-title-step {
        font-style: normal;
        font-weight: 500;
        /* font-size: 11px; */
        /* line-height: 13px; */
        text-align: center;
        letter-spacing: 0.05em;
        font-size: min(2.93vw, 0.6875rem);
    }
    .main-area-step-sub-title-text {
        font-weight: 700;
        /* font-size: 14px; */
        /* line-height: 20px; */
        letter-spacing: 0.03em;
        font-size: min(3.73vw, 0.875rem);
    }
}

@media screen and (min-width: 767px) {
    /* formコンテンツ */
    .main-area-form {
        display: block;
        width: 100%;
        margin: 90px 0 0 0;
    }
    /* 通常の下線あり */
    .main-area-form-content {
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid #BCBCBC;
    }
    .main-area-form-content-wrap {
        display: flex;
        height: 76px;
    }
    /* 下線無しパターン */
    .main-area-form-content.no-border {
        border-bottom: 1px solid #BCBCBC;
        border: none;
        margin-bottom: -20px;
    }

    /* 各コンテンツ・文字設定 */
    .main-area-form-content p {
        margin: 0;
        padding: 0;
        font-weight: 700;
        font-size: 0.9375rem;
        line-height: 1.875rem;
    }
    .main-area-form-content-title {
        display: flex;
        align-items: center;
        flex-basis: 331px;
    }
    .main-area-form-content-title p {
        flex-basis: 277px;
        color: #FF5701;
    }
    .main-area-form-content-title-mark {
        display: flex;
        align-items: center;
        flex-basis: 54px;
    }
    .main-area-form-content-item {
        display: flex;
        align-items: center;
        height: 100%;
        width: 100%;
        padding: 0 0 0 3.3%;
    }
    
    /* バリデーション */
    .main-area-form-content-error {
        display: flex;
        align-items: center;
    }
    .main-area-form-content-error-space {
        flex-basis: 331px;
    }
    .main-area-form-content-error ul {
        list-style:none;
        padding-left:0;
    }
    .main-area-form-content-error li {
        margin: 0;
    }
    .main-area-form-content-error .alert {
        width: 100%;
        margin: 0 0 20px calc(3.3% + 22px);
    }

    /* デフォルト */
    .main-area-form-content-item-input-default {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-input-default input {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        margin: 0 6px;
        width: 100%;
    }
    .input-default {
        min-width: min(0.9375vw, 13.5px);
        border-bottom: 2px solid #BCBCBC;
        margin: 0 6px;
    }

    .main-area-form-content-item-input-postcode {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        flex-basis: calc(67% - min(0.9375vw, 13.5px));
    }

    .main-area-form-content-item-input-postcode input {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        margin: 0 6px;
        width: 100%;
    }

    /* input二つのパターン */
    .main-area-form-content-item-input-double {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-input-double input {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        margin: 0 6px;
        width: 100%;
    }

    /* 生年月日とかセレクト系 */
    .main-area-form-content-item-select {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-select-detail {
        width: 33%;
        padding: 0 0 0 6px;
        height: 100%;
        display: flex;
        align-items: center;   
    }
    .main-area-form-content-item-select-detail select {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        width: 100%;
    }

    /* 性別 */
    .main-area-form-content-item-radio-triple {
        width: 100%;
        padding: 0 0 0 6px;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-radio-triple-label {
        flex-basis: 80px;
        margin: 0;
        font-weight: normal;
    }
    /*  ラジオボタン編集 */
    .main-area-form-content-item-radio-triple input[type="radio"] {
        appearance: none;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        border: 1px solid #BCBCBC;
        vertical-align: -5px;
        outline: none;
        margin: 0 7px 0 0;
    }
    .main-area-form-content-item-radio-triple input[type="radio"]::before {
        display: block;
        content: "";
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: #44CDFF;
        transform: translate(4px, 4px) scale(0);
        transform-origin: center;
        transition: all 0.3s cubic-bezier(0.25, 0.25, 0.56, 2);
    }
    .main-area-form-content-item-radio-triple input[type="radio"]:checked::before {
        transform: translate(4px, 4px) scale(1);
    }

    /* 都道府県 */
    .main-area-form-content-item-select-prefectures {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-select-prefectures-detail {
        width: 33%;
        padding: 0 0 0 6px;
        height: 100%;
        display: flex;
        align-items: center;   
    }
    .main-area-form-content-item-select-prefectures-detail select {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        width: 100%;
    }

    /* 利用規約同意 */
    .main-area-form-terms {
        height: 156px;
        padding: 46px 0 42px;
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid #BCBCBC;
        align-items: center;
    }
    .main-area-form-terms p {
        margin: 0;
        padding: 0;
        font-style: normal;
        font-weight: 700;
        font-size: 0.9375rem;
        line-height: 1.875rem;
        letter-spacing: 0.03em;
    }
    .terms-content-orange {
        color: #FF5701!important;
        margin: 0;
        padding: 0;
        position: relative;
        font-style: normal;
        font-weight: 700;
        font-size: 0.9375rem;
        line-height: 1.875rem;
        letter-spacing: 0.03em;
    }
    .terms-content-orange::before {
        position: absolute;
        content: "";
        width: 100%;
        border-bottom: 2px solid #FF5701;
        bottom: 1px;
    }
    /* 入力内容確認ボタン */
    .main-area-form-submit {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 59px 14.32% 0;
        margin: 0;
    }
    .main-area-form-submit-button {
        width: 100%;
        height: 72px;
        border-radius: 100px;
        background-color: #FF5701;
        color: white;
        font-style: normal;
        font-weight: 700;
        font-size: 1.125rem;
        line-height: 2.25rem;
        letter-spacing: 0.03em;
        border: none;
        position: relative;
    }
    .main-area-form-submit-button::before {
        position: absolute;
        top: 13px;
        right: 21px;
        content: "";
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: white;
    }
    .main-area-form-submit-button::after {
        position: absolute;
        top: calc(50% - 3.5px);
        height: 7.071px;
        width: 7.071px;
        content: "";
        border-top: 2.8px solid #FF5701;
        border-right: 2.8px solid #FF5701;
        right: 39px;
        transform: rotate(45deg);
    }
    .main-area-form-submit-button:disabled {
        opacity: 0.5;
    }
    /* 修正するボタン */
    .main-area-form-fix-button {
        display: flex;
        align-items: center;
        justify-content: center;
        color: white!important;
        margin: 0 0 1rem 0;
        width: 100%;
        height: 72px;
        border-radius: 100px;
        background-color: #44CDFF;
        color: white;
        font-style: normal;
        font-weight: 700;
        font-size: 1.125rem;
        line-height: 2.25rem;
        letter-spacing: 0.03em;
        border: none;
        position: relative;
    }
    .main-area-form-fix-button::before {
        position: absolute;
        top: 13px;
        left: 21px;
        content: "";
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: white;
    }
    .main-area-form-fix-button::after {
        position: absolute;
        top: calc(50% - 3.5px);
        height: 7.071px;
        width: 7.071px;
        content: "";
        border-top: 2.8px solid #44CDFF;
        border-right: 2.8px solid #44CDFF;
        left: 39px;
        transform: rotate(225deg);
    }

    /* チェックボックスデザイン */
    .caution-checkbox-input {
        padding: 12px 8px;
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    .caution-checkbox-input-body {
        margin: 0;
        width: 0;
        opacity: 0;
    }
    .caution-checkbox-input:hover > .caution-checkbox-input-dammy{
        background: #CCCCCC;
    }
    .caution-checkbox-input-body:focus + .caution-checkbox-input-dammy{
        background: #CCCCCC;
    }
    .caution-checkbox-input-body:checked + .caution-checkbox-input-dammy {
        background: #555555;
    }
    .caution-checkbox-input-body:checked + .caution-checkbox-input-dammy::before {
        content: "";
        display: block;
        position: absolute;
        top: 29%;
        left: 65%;
        width: 35%;
        height: 2px;
        transform: translate(-5px, 6px) rotateZ(-135deg);
        transform-origin: 1px 1px;
        background: #FFFFFF;
    }
    .caution-checkbox-input-body:checked + .caution-checkbox-input-dammy::after {
        content: "";
        display: block;
        position: absolute;
        top: 32%;
        left: 67%;
        width: 59%;
        height: 2px;
        transform: translate(-5px, 6px) rotateZ(-45deg);
        transform-origin: 1px 1px;
        background: #FFFFFF;
    }
    .caution-checkbox-input-dammy {
        position: relative;
        top: 0;
        left: 0;
        display: block;
        width: 20px;
        height: 20px;
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
    }
    .caution-checkbox-input-text {
        margin-left: 12px;
        display: block;
        font-weight: bold;
        font-style: normal;
        font-weight: 700;
        font-size: 0.9375rem;
        line-height: 1.875rem;
        letter-spacing: 0.03em;
    }
}

@media screen and (max-width: 767px) {
    /* formコンテンツ */
    .main-area-form {
        display: block;
        width: 100%;
        margin: 74.8px 0 0 0;
    }
    /* 通常の下線あり */
    .main-area-form-content {
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid #BCBCBC;
    }
    .main-area-form-content-wrap {
        display: flex;
        flex-direction: column;
        height: 109px;
        padding-top: 19px;
        padding-bottom: 19px;
    }
    /* 下線無しパターン */
    .main-area-form-content.no-border {
        border-bottom: 1px solid #BCBCBC;
        border: none;
        margin-bottom: -19px;
    }

    /* 各コンテンツ・文字設定 */
    .main-area-form-content p {
        margin: 0;
        padding: 0;
        font-weight: 700;
        font-size: 0.875rem;
        line-height: 1.75rem;
    }
    .main-area-form-content-title {
        display: flex;
        align-items: center;
        width: 100%;
        justify-content: space-between;
    }
    .main-area-form-content-title p {
        flex-basis: 277px;
        color: #FF5701;
    }
    .main-area-form-content-title-mark {
        display: flex;
        align-items: center;
        flex-basis: 54px;
    }
    .main-area-form-content-item {
        display: flex;
        align-items: center;
        height: 100%;
        width: 100%;
        padding: 0;
    }

    /* バリデーション */
    .main-area-form-content-error {
        display: flex;
        align-items: center;
    }
    .main-area-form-content-error-space {
        flex-basis: 331px;
    }
    .main-area-form-content-error ul {
        list-style:none;
        padding-left:0;
    }
    .main-area-form-content-error li {
        margin: 0;
    }
    .main-area-form-content-error .alert {
        width: 100%;
        margin: 0 0 19px 0;
    }
    /* デフォルト */
    .main-area-form-content-item-input-default {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-input-default input {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        margin: 0;
        width: 100%;
    }
    .input-default {
        min-width: min(0.9375vw, 13.5px);
        border-bottom: 2px solid #BCBCBC;
        margin: 0 6px;
    }

    .main-area-form-content-item-input-postcode {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        flex-basis: calc(67% - min(0.9375vw, 13.5px));
    }

    .main-area-form-content-item-input-postcode input {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        margin: 0;
        width: 100%;
    }

    /* input二つのパターン */
    .main-area-form-content-item-input-double {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-input-double input {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        margin: 0 6px 0 0;
        width: 100%;
    }

    /* 生年月日とかセレクト系 */
    .main-area-form-content-item-select {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-select-detail {
        width: 33%;
        padding: 0 6px 0 0;
        height: 100%;
        display: flex;
        align-items: center;   
    }
    .main-area-form-content-item-select-detail select {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        width: 100%;
    }

    /* 性別 */
    .main-area-form-content-item-radio-triple {
        width: 100%;
        padding: 0 6px 0 0;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-radio-triple-label {
        flex-basis: 80px;
        margin: 0;
        font-weight: normal;
    }
    /*  ラジオボタン編集 */
    .main-area-form-content-item-radio-triple input[type="radio"] {
        appearance: none;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        border: 1px solid #BCBCBC;
        vertical-align: -5px;
        outline: none;
        margin: 0 7px 0 0;
    }
    .main-area-form-content-item-radio-triple input[type="radio"]::before {
        display: block;
        content: "";
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: #FF5701;
        transform: translate(4px, 4px) scale(0);
        transform-origin: center;
        transition: all 0.3s cubic-bezier(0.25, 0.25, 0.56, 2);
    }
    .main-area-form-content-item-radio-triple input[type="radio"]:checked::before {
        transform: translate(4px, 4px) scale(1);
    }

    /* 都道府県 */
    .main-area-form-content-item-select-prefectures {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .main-area-form-content-item-select-prefectures-detail {
        width: 33%;
        padding: 0 6px 0 0;
        height: 100%;
        display: flex;
        align-items: center;   
    }
    .main-area-form-content-item-select-prefectures-detail select {
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
        height: 36px;
        width: 100%;
    }



    /* 利用規約同意 */
    .main-area-form-terms {
        height: 132px;
        padding: 26px 0 24px;
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid #BCBCBC;
        align-items: center;
    }
    .main-area-form-terms p {
        margin: 0;
        padding: 0;
        font-style: normal;
        font-weight: 700;
        font-size: 0.875rem;
        line-height: 1.375rem;
        letter-spacing: 0.03em;
        text-align: center;
    }
    .terms-content-orange {
        color: #FF5701!important;
        margin: 0;
        padding: 0;
        position: relative;
        font-style: normal;
        font-weight: 700;
        font-size: 0.875rem;
        line-height: 1.375rem;
        letter-spacing: 0.03em;
    }
    .terms-content-orange::before {
        position: absolute;
        content: "";
        width: 100%;
        border-bottom: 2px solid #FF5701;
        bottom: 1px;
    }
    /* 入力内容確認ボタン */
    .main-area-form-submit {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 31px 0 0;
        margin: 0;
    }
    .main-area-form-submit-button {
        width: 100%;
        height: 72px;
        border-radius: 100px;
        background-color: #FF5701;
        color: white;
        font-style: normal;
        font-weight: 700;
        font-size: 1.125rem;
        line-height: 2.25rem;
        letter-spacing: 0.03em;
        border: none;
        position: relative;
    }
    .main-area-form-submit-button::before {
        position: absolute;
        top: 14px;
        right: 16px;
        content: "";
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: white;
    }
    .main-area-form-submit-button::after {
        position: absolute;
        top: calc(50% - 3.5px);
        right: 34.5px;
        height: 7.071px;
        width: 7.071px;
        content: "";
        border-top: 2.8px solid #FF5701;
        border-right: 2.8px solid #FF5701;
        transform: rotate(45deg);
    }
    .main-area-form-submit-button:disabled {
        opacity: 0.5;
    }

    /* 修正するボタン */
    .main-area-form-fix-button {
        display: flex;
        align-items: center;
        justify-content: center;
        color: white!important;
        margin: 0 0 1rem 0;
        width: 100%;
        height: 72px;
        border-radius: 100px;
        background-color: #44CDFF;
        color: white;
        font-style: normal;
        font-weight: 700;
        font-size: 1.125rem;
        line-height: 2.25rem;
        letter-spacing: 0.03em;
        border: none;
        position: relative;
        padding: 0 0 0 0.5rem;
    }
    .main-area-form-fix-button::before {
        position: absolute;
        top: 14px;
        left: 16px;
        content: "";
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: white;
    }
    .main-area-form-fix-button::after {
        position: absolute;
        top: calc(50% - 3.5px);
        left: 34.5px;
        height: 7.071px;
        width: 7.071px;
        content: "";
        border-top: 2.8px solid #44CDFF;
        border-right: 2.8px solid #44CDFF;
        transform: rotate(225deg);
    }

    /* チェックボックスデザイン */
    .caution-checkbox-input {
        padding: 12px 8px;
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    .caution-checkbox-input-body {
        margin: 0;
        width: 0;
        opacity: 0;
    }
    .caution-checkbox-input:hover > .caution-checkbox-input-dammy{
        background: #CCCCCC;
    }
    .caution-checkbox-input-body:focus + .caution-checkbox-input-dammy{
        background: #CCCCCC;
    }
    .caution-checkbox-input-body:checked + .caution-checkbox-input-dammy {
        background: #555555;
    }
    .caution-checkbox-input-body:checked + .caution-checkbox-input-dammy::before {
        content: "";
        display: block;
        position: absolute;
        top: 29%;
        left: 65%;
        width: 35%;
        height: 2px;
        transform: translate(-5px, 6px) rotateZ(-135deg);
        transform-origin: 1px 1px;
        background: #FFFFFF;
    }
    .caution-checkbox-input-body:checked + .caution-checkbox-input-dammy::after {
        content: "";
        display: block;
        position: absolute;
        top: 32%;
        left: 67%;
        width: 59%;
        height: 2px;
        transform: translate(-5px, 6px) rotateZ(-45deg);
        transform-origin: 1px 1px;
        background: #FFFFFF;
    }
    .caution-checkbox-input-dammy {
        position: relative;
        top: 0;
        left: 0;
        display: block;
        width: 20px;
        height: 20px;
        background: #F0F4F5;
        border: 1px solid #BCBCBC;
        border-radius: 2px;
    }
    .caution-checkbox-input-text {
        margin-left: 12px;
        display: block;
        font-weight: bold;
        font-style: normal;
        font-weight: 700;
        font-size: 0.9375rem;
        line-height: 1.875rem;
        letter-spacing: 0.03em;
    }
}





