@charset "utf-8";  
/*------------------------------------------------------------ 
    CONTACT css
------------------------------------------------------------*/  

#ft-Contact{ display: none;}

#inq-Form{
    width:100%;
    max-width:905px;
    margin:80px 0 0 auto;
}

.text-gray{ color:#838383;}
    
.form-input{
    width:100%;
    height: 100%;
    padding:0 2em;
    font-size: 1.4rem;
    background-color: #fff;
    border:none;
    outline: none;
    border-radius:0;
    box-sizing: border-box;
}

.form-input::-webkit-input-placeholder{ color:#838383; opacity:1;}  /* WebKit, Blink, Edge */
.form-input:-ms-input-placeholder{ color:#838383; opacity:1;} /* Internet Explorer 10-11 */
.form-input::placeholder{ color:#838383; opacity:1;}

#inq-Filelabel{
    background: url(../img/icon-file.svg) no-repeat right 22px top 50%;
    background-size:22px auto;
}

.form-textarea{
    width:100%;
    height: 250px;
    padding:24px 30px;
    font-size: 1.4rem;
    background-color: #fff;
    outline: none;
    box-sizing: border-box;
    border-radius:0;
}

.inq-Submit{
    width:100%;
    height:75px;
    margin:50px auto 0;
}

.inq-Submit a{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    height:100%;
    color:#333;
    font-size:2.2rem;
    font-weight: 500;
    font-family: var(--din);
    letter-spacing: .05em;
    border-radius: 5px;
    overflow: hidden;
    background-color: var(--accent);
}

.inq-Submit a::after{
    content:"";
    width:12px;
    height:22px;
    position:absolute;
    right:34px;
    top:50%;
    transform:translateY(-50%);
    background: url(../img/icon-submit.svg) no-repeat;
    background-size:cover;
    transition:filter .2s ease-out;
    z-index: 10;
}

.inq-Submit a:hover::after{ filter:invert(1);}

.grecaptcha-badge {
    width: 70px !important;
    right: auto !important;
    left: 0;
  }

/*------------------------------------------------------------ 
    MediaQuery 
------------------------------------------------------------*/  

/* PC */
@media screen and (max-width: 1800px) and (min-width: 1081px){


}


@media screen and (max-width: 1350px){
   

}


@media screen and (min-width: 835px){

    .inq-FormItem{
        display: flex;
        width:100%;
        border:1px solid #242424;
        box-sizing: border-box;
        position: relative;
        border-radius:5px;
        overflow: hidden;
    }

    .inq-FormItem.--top{
        border-radius: 5px 5px 0 0;
    }
    
    .inq-FormItem:not(.is-half){ margin-top:50px;}
    .inq-FormItem.is-half{ width:calc(100% * (435/905));}
    
    .inq-FormItem.is-error::before {
        content:"";
        width: 14px;
        height: 14px;
        position: absolute;
        left: -54px;
        top: 18px;
        border-radius: 50%;
        background-color: var(--accent);
    }
    
    .inq-FormItem dt{
        display: flex;
        justify-content: center;
        align-items: center;
        width:240px;
        height: 50px;
        text-align: center;
        font-family: var(--en);
        font-size:1.8rem;
        background-color: var(--accent);
    }
    
    .inq-FormItem dd{
        width:calc(100% - 240px);
        box-sizing: border-box;
        position: relative;
    }
    
    .inq-FormItem__placeholder{
        display: flex;
        align-items: center;
        font-size:1.4rem;
        align-self: center;
        padding:0 2em;
    }
    
    
    #inq-FormItem__policy{
        padding:24px 30px;
        height:140px;
        border:1px solid #242424;
        border-top:none;
        overflow: auto;
        box-sizing: border-box;
    }
    
    .inq-FormItem__policy--text{
        font-size:1.4rem;
        line-height:1.6;
    }
    
    .inq-FormItem__policy--text + .inq-FormItem__policy--text{ margin-top:1.5em;}

    .form-textarea{
        border:1px solid #242424;
        border-top:none;
        border-radius:0 0 5px 5px;
    }
}

/* TABLET */
@media screen and (max-width: 834px){

    #inq-Form{ margin-top:40px;}

    .inq-FormItem{
        width:100%;
        position: relative;
    }

    .inq-FormItem.is-error::before {
        content:"";
        width: 12px;
        height: 12px;
        position: absolute;
        right: 21px;
        bottom: 14px;
        border-radius: 50%;
        background-color: var(--accent);
    }

    .form-textarea + .inq-FormItem,
    .inq-FormItem + .inq-FormItem{ margin-top:26px;}
    .inq-FormItem.is-half + .inq-FormItem.is-half{ margin-bottom:26px;}

    .inq-FormItem dt{
        font-size:1.8rem;
        font-weight: 500;
        letter-spacing: 0.04em;
        font-family: var(--en);
        margin-bottom: 5px;
    }
    
    .form-input{
        padding:0;
        height:41px;
        font-size:1.6rem;
        letter-spacing: 0.04em;
        border-bottom: 1px solid #242424000;
    }

    .form-textarea{
        padding:10px 0;
        height:41px;
        line-height: 20px;
        font-size:1.6rem;
        letter-spacing: 0.04em;
        border:none;
        resize: none;
        border-bottom: 1px solid #242424000;
    }

    .inq-FormItem__placeholder{
        line-height: 40px;
        font-size:1.6rem;
        letter-spacing: 0.04em;
        color:#838383;
        border-bottom: 1px solid #242424000;
        position: relative;
    }

    #policyTb-btn{
        position:absolute;
        right:18px;
        top:11px;
        width:18px;
        height:18px;
    }

    #policyTb-btn::before,
    #policyTb-btn::after{
        content:"";
        background-color: #242424;
        position:absolute;
    }

    #policyTb-btn::before{
        width:100%;
        height:1px;
        top:calc(50% - 1px);
        left:0%;
    }

    #policyTb-btn::after{
        width:1px;
        height:100%;
        top:0%;
        left:50%;
        transition:opacity .2s ease-out;
    }

    #policyTb-btn.selected::after{ opacity:0;}

    #inq-FormItem__policy{
        display: none;
        width:100%;
        padding:16px 0;
        border-bottom: 1px solid #242424;
        border-radius:0 0 5px 5px;
    }

    .inq-FormItem__policy--text{
        font-size:1.4rem;
        line-height:1.6;
    }

    .inq-FormItem__policy--text + .inq-FormItem__policy--text{ margin-top:1em;}
    
    .inq-Submit{ height:60px;}
    .inq-Submit a{ font-size:1.7rem;}

    .inq-Submit a::after{
        width:calc(12px*.75);
        height:calc(22px*.75);
        right:28px;
    }

}


/* SP */
@media screen and (max-width: 480px){

    .com-Detail__head{
        padding-bottom: 0;
        border-bottom: none;
    }

    #inq-Form{ margin-top: 18px;}

    .inq-FormItem dt {
		font-size: 1.8rem;
        margin-bottom: .02em;
    }

    .form-input{
        height:36px;
        font-size: 1.4rem;
    }

    .form-textarea {
        padding: 8px 0;
        height:36px;
        font-size:1.4rem;
    }

    .inq-FormItem__placeholder {
        line-height: 36px;
        font-size: 1.4rem;
    }

    .inq-FormItem__policy--text{
        font-size: 1.4rem;  
    }
    
    .inq-Submit{
        height: 60px;
        margin-top:25px;
    }

    .inq-Submit a{
        font-size:1.7rem;
    }

    .form-textarea + .inq-FormItem,
    .inq-FormItem + .inq-FormItem{ margin-top:30px;}
    .inq-FormItem.is-half + .inq-FormItem.is-half{ margin-bottom:30px;}

}


