/*-- お問い合わせトップ --*/
.contact_container {
    width: 75%;
    min-width: 700px;
    margin: 7vw auto;
}
.contact_subcontainer {
    padding: 4vw;
    padding-top: 2vw;
    background: #f6f6f6;
    margin-bottom: 50px;
}
.contact_subcontainer h2 {
    display: inline-block;
    /* border-bottom: solid; */
    color: #B28247;
    font-size: 1.8em;
    margin-bottom: 25px;
    padding-left: 10px;
    border-left: solid 7px #B28247;
}
.contact_subcontainer .btn a {
    /* border: 2px solid #095133; */
    /* background: #f6f6f6; */
    background: #095133;
    color: white;
    position: relative;
}
#contact.page_top {
    background-image: url(../images/company/company_header_bg.jpg);
    background-position: top right;
}
.contact_head .top_link {
    padding: 30px;
    text-align: center;
}
.contact_head .top_link a {
    padding: 20px;
    width: 280px;
    margin: 7px;
    font-weight: bold;
    color: white;
    text-align: center;
    position: relative;
}
.contact_head .top_link a span {
    font-size: 18px;
}
.contact_head .top_link a::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 95%;
    height: 80%;
    border: solid 1px rgba(255,255,255, .7);
}
.contact_head .top_link a::before {
    content: "";
    width: 7px;
    height: 7px;
    border: 0px;
    border-bottom: solid 2px white;
    border-right: solid 2px white;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 7%;
    margin-top: -6px;
    transition: .3s;
}

/* .contact_head .top_link a::before {
    content: "";
    width: 8px;
    height: 8px;
    border: 0px;
    border-bottom: solid 3px white;
    border-right: solid 3px white;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 15%;
    margin-top: -8px;
    transition: .3s;
}
.contact_head .top_link a:hover::before {
    margin-top: -4px;
} */


#btn_product {
    background: #55c486;
}
#btn_others {
    background: #eda400;
}


.contact_subcontainer .btn a::before {
    content: "";
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px white;
    border-right: solid 2px white;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 12%;
    margin-top: -4px;
}

.contact_subcontainer .qa_box {
    margin-bottom: 15px;
}
.contact_subcontainer .q_label {
    font-size: 18px;
    padding: 15px 30px;
    padding-right: 8vw;
}
#qa_product .q_label {
    border-bottom: solid 7px #3b845b;
}
#qa_others .q_label {
    border-bottom: solid 7px #ae7902;
}
#qa_product .q_label:hover,
#qa_others .q_label:hover {
    border-bottom: solid 7px #f6f6f6;
}
#qa_product .q_check:checked + .q_label,
#qa_others .q_check:checked + .q_label {
    border-bottom: solid 7px #f6f6f6;
}
.contact_subcontainer .answer_content {
    background: beige;
    font-size: 15px;
}
.contact_subcontainer .answer_content .btn_wrap .btn a {
    font-size: 16px;
    padding: 14px 60px;
}
.contact_subcontainer .answer_content .btn_wrap .btn a::before {
    /* content: "";
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px white;
    border-right: solid 2px white; */
    background: none;
    /* -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%; */
    left: initial;
    /* right: 12%;
    margin-top: -4px; */

    content: "";
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px white;
    border-right: solid 2px white;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 12%;
    margin-top: -4px;
}
#qa_product .q_label, 
#qa_product .circle_btn::before,
#qa_product .circle_btn::after {
    background: #55c486;
}
#qa_others .q_label,
#qa_others .circle_btn::before,
#qa_others .circle_btn::after {
    background: #eda400;
}
.contact_container .circle_btn {
    width: 2vw;
    height: 2vw;
}
.btn.toform {
    text-align: center;
    margin-top: 50px;
}
.btn.toform a {
    font-size: 20px;
    letter-spacing: 0.1em;
    color: white;
    background: #0D9B90;
    border: none;
    padding: 1.5vw 6.5vw;
    position: relative;
}
.btn.toform a::before {
    content: "";
    width: 8px;
    height: 8px;
    border: 0px;
    border-top: solid 2px white;
    border-right: solid 2px white;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 10%;
    margin-top: -4px;
}
.btn.toform a::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 95%;
    height: 80%;
    border: solid 1px rgba(255,255,255, .7);
}

@media screen and (max-width: 780px) {
    .contact_container {
        width: 90%;
        min-width: auto;
    }
    .contact_subcontainer h2 {
        font-size: 1.5em;
    }
    .contact_container p, li {
        font-size: 14px;
    }
    .contact_subcontainer .q_label{
        font-size: 15px;
    }
    .btn.toform a {
        font-size: 17px;
    }
    .btn.toform a::before {
        right: 17px;
    }
}
@media screen and (max-width: 480px) {
    .contact_subcontainer h2 {
        font-size: 1.3em;
    }
    .contact_head .top_link {
        padding: 10px;
    }
    .contact_head .top_link a {
        width: 100%;
        box-sizing: border-box;
        margin: 7px 0;
        font-size: 14px;
    }
    .contact_head .top_link a span {
        font-size: 16px;
    }
    .contact_subcontainer .btn a {
        padding: 10px 30px;
    }
    .contact_subcontainer .btn a::before {
        right: 13px;
    }
    .btn.toform a {
        padding: 2.3vw 7.5vw;
    }
}
@media screen and (max-width: 400px) {
    .contact_container p, li {
        font-size: 13px;
    }

    .contact_head .top_link a {
        padding: 10px;
    }
    .contact_subcontainer .q_label {
        padding: 14px 8vw 14px 18px;
    }
    h3 {
        font-size: 16px;
    }
    .btn.toform {
        margin: 35px 0;
    }
    .btn.toform a {
        font-size: 14px;
    }
}