@charset "UTF-8";

/*------- 全体レイアウト・共通設定 -------*/
#profile_above_pc {
    display: block;
    width: 100%;
}
#profile_above_sp {
    display: none;
    width: 100%;
}

.mission_flex {
    display: flex;
    width: 75%;
    margin: 0 auto;
}

#tripleWinImg {
    height: 300px;
    width: 300px;
    display: block;
    margin: 100px auto;
}

.mission_child {
    flex-basis: 50%;
}

#contents {
    margin-top: 70px;
}

#profile {
    font-size: 15vw;
    font-family: var(--fontAlpha);
    margin: -7vw auto;
    max-width: 80%;
}

#profile-span {
    font-size: 1.8vw;
    font-weight: bold;
}

.line {
    font-size: 1.8vw;
}

#mission h4 {
    font-size: 18px;
    font-weight: bold;
}

.mission-text p {
    line-height: 1.8;
}

#history-above {
    background-image: url(/eastool/assets/img/profile/mission/history_above_pc.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#history-above-container {
    width: 56%;
    margin: 0 auto;
}

#history-above-container h4 {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    padding: 150px 0 50px;
}

#history-above-container p {
    padding-bottom: 50px;
    line-height: 1.8;
}

.histories {
    display: flex;
}

#history-br {
    display: none;
}

#history-contents {
    margin-left: 12%;
    padding-top: 50px;
    padding-bottom: 80px;
}

.history-time {
    padding-right: 30px;
    min-width: 130px;
}

.hitstory-text {
    flex-basis: 75%;
}

#contact {
    display: none;
}

#mail-br {
    display: none;
}

.title {
    font-family: var(--fontAlpha);
    text-align: center;
    font-size: 40px;
    margin-top: 10px;/*-------20251224-----*/
}

/*------- 社長インタビュー（QAセクション） -------*/

.qa-section {
    background-color: #333333;
    color: #fff;
    padding: 40px 20px;
    display: flex;
    justify-content: center;
}

.qa-container {
    width: 100%;
}

.qa-row {
    display: flex;
    align-items: stretch;
}

.qa-label {
    flex: 0 0 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-family: 'Oswald', sans-serif;
    font-weight: bold;
}

.qa-content {
    flex: 1;
    padding: 0px 25px;
    display: flex;
    align-items: center;
}

/* --- 質問 (Q) --- */
.question-row {
    margin-bottom: 0;
}

.q-label {
    background-color: #0f1d35;
    color: #fff;
    position: relative;
}

.q-label::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    border-style: solid;
    border-width: 15px 15px 0 15px;
    border-color: #0f1d35 transparent transparent transparent;
    z-index: 10;
}

.q-content {
    background-color: #dcdcdc;
    color: #000;
}

.q-content h2 {
    font-size: 1.2rem;
    font-weight: normal;
    margin: 0;
    padding-left: 30px;
}

/* --- 回答 (A) --- */
.answer-row {
    margin-top: 0;
    padding-top: 15px;
    margin-left: 60px;
    margin-bottom: 50px;
}

.a-label {
    background-color: transparent;
    color: #fff;
    align-items: flex-start;
    margin-top: -10px;
}

.a-content {
    background-color: transparent;
    color: #fff;
    padding-top: 5px;
    padding-left: 0px;
    display: block; 
}

.a-content p {
    font-size: 1rem;
    letter-spacing: 0.05em;
    line-height: 1.5;
    margin-left: -3px;
    margin-bottom: 10px;
}

/* --- リスト (A.4用) --- */
.qa-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
}

.qa-list li {
    position: relative;
    padding-left: 1.5em;
    line-height: 1.8;
    margin-bottom: 5px;
    font-size: 1rem;
}

.qa-list li::before {
    content: "・";
    position: absolute;
    left: 0;
    font-weight: bold;
}

/*------- レスポンシブ -------*/
@media (max-width: 992px) {
/*---    .line, #profile-span {
        display: none;
    }
----*/
    .gHeader { border-bottom: 0px solid gray; }
    #profile { padding-top: 3.5vw; padding-left: 10px; }
    #profile_above_pc { display: none; }
    #profile_above_sp { display: block; }
    .mission_flex { display: block; width: 100%; }
    #tripleWinImg { height: 250px; width: 250px; margin: 0 auto 50px; }
    .mission-text { margin-left: 20px; }
    #history-above { background-image: url(/eastool/assets/img/profile/mission/history_above_sp.webp); }
    #history-above-container { width: 95%; }
    #history-contents { margin-left: 20px; padding-top: 50px; }
    #history-above-container h4 { padding: 50px 0; }
    #contact { display: block; }
    #contact p { font-size: 20px; }
    #contact-img { width: 97%; margin-left: 10px; display: block; }
    #mail, #tel, #jp-contact { display: flex; }
    #english-p { margin-left: 30px; font-size: 15px; }
    #email { padding-left: 5px; height: auto; max-width: 100%; vertical-align: middle; }
    .flex-left { min-width: 250px; padding-left: 20px; }
    .flex-right { margin-left: 12vw; }
    hr { margin: 30px 10px; }
    .side { height: 15px; }
}

@media (max-width: 780px) {
    .flex-right { margin-left: 3vw; }
    #contact p { font-size: 2.5vw; }
    .qa-label { flex: 0 0 60px; font-size: 1.5rem; }
    .qa-label { flex: 0 0 40px; font-size: 1.2rem; }/*--20251218yokota--*/
    .qa-content { padding: 0 10px 0 0; }
    .q-content h2 { font-size: 1rem; padding-left: 5px; line-height: 1.3; }
    .qa-section { padding: 0px; }
    .answer-row { margin-left: 0px; margin-bottom: 20px; }
    .a-content p, .qa-list li { font-size: 0.9rem; line-height: 1.8; }
}

@media (max-width: 676px) {
    #mail-br { display: block; }
    .flex-left { min-width: 27vw; }
    #contact p { font-size: 3vw; }
    #grop { width: 15vw; }
}

@media (max-width: 600px) {
    #profile { padding-top: 8vw; }
    #history-br { display: block; }
    #history-above-container h4 { line-height: 1.2; }
    .hitstory-text { flex-basis: fit-content; }
    .gHeader { border-bottom: 1px solid gray; }
}

@media (max-width: 400px) {
    #profile { padding-top: 15vw; }
}