@charset "utf-8";
#contact{
    width: 100%;
    height: auto;
}
    .contact__inner{
        width: 90%;
        height: auto;
        margin: 0 auto;
        max-width: 800px;
        padding-bottom: 59px;
    }
        .contact__detail__text{
            width: 100%;
            height: auto;
        }
            .contact__required{
                width: 100%;
                height: auto;
                font-size: 16px;
            }
        .contact__wrap{
            width: 100%;
            height: auto;
        }
            #form{
                width: 100%;
                height: auto;
            }
                .form__list-container{
                    width: 100%;
                    height: auto;
                }
                    .form__wrap{
                        width: 100%;
                        height: auto;
                    }
                        .form__list{
                            width: 100%;
                            height: auto;
                        }
                            .form__item{
                                width: 100%;
                                height: auto;
                            }
                                .form__item_heading{
                                    font-size: 16px;
                                    padding: 30px 0 14px 0;
                                }
                                .form__item:first-of-type .form__item_heading{
                                    padding: 0 0 14px 0;
                                }
                                    .mandatory{
                                        font-size: 12px;
                                        color: var(--color--white);
                                        font-weight: 700;
                                        padding: 6px;
                                        background-color: var(--color--blue);
                                        border-radius: 5px;
                                        margin-right: 12px;
                                    }
                                .form__item_inputbox{
                                    width: 100%;
                                    height: auto;
                                    border-radius: 5px;
                                    overflow: hidden;
                                }
                                    .form__item_inputbox input{
                                        width: 100%;
                                        height: auto;
                                        font-size: 14px;
                                        font-weight: 700;
                                        background-color: var(--color--gray);
                                        padding: 14px 22px;
                                    }
                                    .form__item_inputbox input::placeholder{
                                        color: rgba(25, 25, 25, 0.25);
                                    }
                                .form__item_inputbox__text{
                                    width: 100%;
                                    height: auto;
                                }
                                    .form__item_inputbox__text{
                                        width: 100%;
                                        height: auto;
                                        background-color: var(--color--gray);
                                    }
                                    textarea{
                                        width: 100%;
                                        height: auto;
                                        min-height: 295px;
                                        padding: 14px 22px;
                                    }
                        .pp__area{
                            width: 100%;
                            height: auto;
                            padding: 34px 40px;
                            border: var(--color--gray) 1px solid;
                            border-radius: 5px;
                            margin: 46px 0 25px 0;
                        }
                            .pp__area__inner{
                                width: 100%;
                                height: auto;
                                max-height: 220px;
                                overflow-y: scroll;
                            }
                                .pp__contents{
                                    width: 100%;
                                    height: auto;
                                }
                                    .pp__contents p{
                                        font-size: 14px;
                                        line-height: 2;
                                        font-weight: 500;
                                    }
                                        .pp__contents strong{
                                            font-size: 16px;
                                            font-weight: 700;
                                        }
                                .add__pp{
                                    width: fit-content;
                                    height: auto;
                                    margin: 0 auto;
                                }
                                    .add__pp__inner{
                                        width: 100%;
                                        height: auto;
                                        padding: 25px 0 37px 0;
                                        display: flex;
                                        align-items: center;
                                        justify-content: center;
                                        column-gap: 10px;
                                        cursor: pointer;
                                    }
                                        .add__pp__inner input{
                                            width: 20px;
                                            height: 20px;
                                            border-radius: 4px;
                                            background-color: var(--color--gray);
                                            pointer-events: auto;
                                            cursor: pointer;
                                            margin: 0;
                                            overflow: hidden;
                                            position: relative;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            transition: 0.3s;
                                        }
                                            .add__pp__inner input::before{
                                                content: "";
                                                display: block;
                                                width: 90%;
                                                height: 90%;
                                                margin: 2px auto 0 auto;
                                                background-image: url('../image/check_mark.png');
                                                background-size: 100% auto;
                                                background-repeat: no-repeat;
                                                background-position: top center;
                                                opacity: 0;
                                                transition: 0.3s;
                                            }
                                            .active input::before{
                                                opacity: 1;
                                            }
                                        .add__pp__txt{
                                            font-size: 16px;
                                            font-weight: 700;
                                            letter-spacing: 0.03em;
                                        }
                            .form__list-container .link__btn__contents{
                                margin: 0 auto;
                                pointer-events: none;
                            }
                            .form__list-container .link__btn__contents.on{
                                pointer-events: auto;
                            }
                                .form__list-container .link__btn{
                                    position: relative;
                                    pointer-events: none;
                                    background-color: var(--color-dark-gray);
                                    cursor: pointer;
                                }
                                .form__list-container .on .link__btn{
                                    pointer-events: auto;
                                    background-color: var(--color--blue);
                                }
                                    .arrow__item{
                                        position: absolute;
                                        top: 50%;
                                        right: 19px;
                                        transform: translate(0%, -50%);
                                    }
/* サンキュー画面 */
#other__area {
    width: 100%;
    height: auto;
}
    .other__area__inner {
        width: 90%;
        height: auto;
        margin: 0 auto;
    }
    #other__area .link__btn__contents{
        width: 289px;
        margin: 0 auto 94px auto;
    }
        #other__area .link__btn{
            position: relative;
            margin: 0 auto;
        }
        #other__area .arrow__item{
                position: absolute;
                top: 50%;
                left: 19px;
                transform: translate(0%, -50%) rotate(180deg);
            }
            .other_title{
                width: 100%;
                height: auto;
                text-align: center;
                color: var(--color--blue);
                font-size: 26px;
                letter-spacing: 0.05em;
                font-weight: 700;
                padding: 75px 0 22px 0;
            }
            .other__sub__title{
                width: 100%;
                height: auto;
                text-align: center;
                font-size: 16px;
                letter-spacing: 0.03em;
                line-height: 2;
                font-weight: 500;
                padding-bottom: 33px;
            }
            .other__contents{
                width: 100%;
                height: auto;
                margin: 0 auto;
                max-width: 700px;
                background-color: var(--color--gray);
                border-radius: 10px;
                margin-bottom: 30px;
            }
                .other__contents__inner{
                    width: 86%;
                    height: auto;
                    margin: 0 auto;
                    padding: 35px 0 32px 0;
                }
                    .other__contents__inner p{
                        font-size: 14px;
                        line-height: 2;
                        letter-spacing: 0.03em;
                        font-weight: 500;
                    }
                    .other__mail{
                        display: block;
                        width: 100%;
                        height: auto;
                        text-align: center;
                        padding-top: 12px;
                        font-size: 20px;
                        color: var(--color--blue);
                        font-weight: 500;
                        letter-spacing: 0.03em;
                    }
@media screen and (max-width:768px) {
    .other__contents__inner p{
        font-size: 12px;
    }
}