@charset "UTF-8";

/* -------------------------初期設定------------------------- */
* {
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
}

body {
    font: 17px/1.5 "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif !important;
    background: #fff;
}

img {
    display: block;
    width: 100%;
    object-fit: contain;
}

.wrapper {
    width: 100%;
}
section {
    padding: 0;
}

/* 注釈(共通) */
p.Fss{
    font-weight: 500;
    font-size: 0.8em;
    text-align: center;
}


/* レスポンシブ設定 */
.pc {
    display: block;
}
.sp {
    display: none;
}
@media screen and (max-width:699px) {
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    .wrapper {
        display: block;
        position: relative;
        max-width: 700px;
        margin-right: auto;
        margin-left: auto;
        background-color: #fff;
        overflow: hidden;
    }
}


/* -------------------------ヘッダー------------------------- */
@media screen and (min-width:700px) {
    header div.header-----in{
        background-color: #fff;
        box-shadow: 5px 5px 10px rgba(46, 46, 46, 0.1);
        display: flex;
        justify-content: space-between;
        z-index: 999;
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        max-width: 100vw;
        box-sizing: border-box;
    }
    header a.h_logo img{
        margin-top: 3%;
    }
}
@media screen and (max-width:800px) and (min-width:700px) {
    header p.Fss {
        font-weight: 500;
        font-size: 0.55em;
        text-align: center;
    }
}
@media screen and (max-width:699px) {
    header{
        position: fixed; 
        top: 0;
        right: 0;
        left: 0;
        max-width: 100vw;
        box-sizing: border-box;
        box-shadow: 5px 5px 10px rgba(46, 46, 46, 0.1);
        background-color: #fff;
        z-index: 999;
    }
    header div.header-----in{
        display: flex;
        justify-content: space-between;
    }
    header .logo_area{
        width: 81%;
    }
    header a.h_logo img {
        width: 100%;
        margin: 0 auto;
    }
    p.Fss {
        font-weight: 500;
        font-size: 0.55em;
        text-align: center;
    }
}

header .btn_flx {
    display: flex;
}
header .btn_flx a {
    display: flex;
}
header .btn_flx img {
    vertical-align: bottom;
}


/* -------------------------FV------------------------- */

section.FV {
    position: relative;
    padding: 0;
}
section.FV h1 img{
    max-width: 1800px;
    width: 90%;
    margin: 9% auto;
}

@media screen and (min-width:1601px){
    section.FV h1 img{
        margin: 7% auto;
    }

}
@media screen and (min-width:700px){
    div.mvin-ctaarea {
        position: absolute;
        bottom: 6%;
        left: 11%;
        width: 32%;
        margin: 0 auto;
    }
    div.mvin-ctaarea img.top_text{
        margin: 0 auto 2%;
        width: 64%;
    }
    section.FV p.Fss{
        color: #fff;
    }
}
@media screen and (max-width:1600px) and (min-width:700px){
    section.FV h1 img {
        width: 96%;
    }
    section.FV p.Fss {
        font-size: 0.6em;
    }
    div.mvin-ctaarea {
        width: 28%;
    }
    div.mvin-ctaarea img.top_text{
        width: 53%;
    }
}
@media screen and (max-width:699px){
    section.FV h1 img {
        max-width: 1800px;
        width: 90%;
        margin: 19% auto 3%;
    }
    div.mvin-ctaarea{
        width: 95%;
        margin: 0 auto 10%;
    }
    div.mvin-ctaarea img.top_text{
        margin: 6% auto 2%;
        width: 64%;
    }
    section.FV p.Fss {
        font-size: 0.7em;
    }
}



/* -------------------------お悩み------------------------- */
section.Problem{
    background: #c9d7c6;
    padding: 0;
}
section.Problem h2{
    background: linear-gradient(to bottom, #fff 35%, #c9d7c6 35%);
    padding: 1% 0 2%;
}
section.Problem h2 img{
    max-width: 860px;
    width: 60%;
    margin: 0 auto;
}
div.problem_contents .problem_ex img{
    max-width: 1250px;
    width: 90%;
    margin: 0 auto;
}
div.problem_contents .problem_list img{
    max-width: 900px;
    width: 90%;
    margin: 0 auto;
}
@media screen and (max-width:699px){
    section.Problem h2{
        background: linear-gradient(to bottom, #fff 25%, #c9d7c6 25%);
        padding: 5% 0;
    }
    section.Problem h2 img{
        width: 90%;
    }
    div.problem_contents .problem_ex img{
        width: 100%;
    }
}


/* -------------------------解決------------------------- */
section.Solution{
    background: #fff;
    padding: 0;
}
section.Solution .solution_box{
    background: linear-gradient(to bottom, #c9d7c6 40%, #fff 40%);
}
section.Solution .solution_box img{
    max-width: 1200px;
    width: 70%;
    margin: 0 auto;
}
section.Solution h2 img{
    max-width: 1000px;
    width: 80%;
    margin: 0 auto;
}
@media screen and (min-width:700px){
    section.Solution h2{
        background-image: url("../img/explanation_bg_pc.jpg");
        background-repeat: no-repeat; /* 繰り返しなし */
        background-size: cover; /* 画面いっぱいに拡大 */
        background-position: center;
        padding: 4% 0 6%;
    }
}
@media screen and (max-width:699px){
    section.Solution .solution_box img{
        width: 100%;
    }
    section.Solution h2 img{
        width: 100%;
    }
}

/* -------------------------強み------------------------- */
section.Point{
    background: #fff;
    padding: 0 0 5%;
}
section.Point h2{
    padding: 2% 0 2.5%;
}
section.Point h2 img{
    max-width: 850px;
    width: 80%;
    margin: 0 auto;
}
div.point_contents img{
    max-width: 1380px;
    width: 90%;
    margin: 0 auto;
}
@media screen and (max-width:699px){
    section.Point{
        padding: 0 0 10%;
    }
    section.Point h2{
        padding: 15% 0 5%;
    }
    section.Point h2 img{
        width: 93%;
    }
    div.point_contents img{
        width: 93%;
    }
}

/* -------------------------実績------------------------- */
section.Achieve h2{
    padding: 0 0 3%;
}
section.Achieve h2 img{
    max-width: 800px;
    width: 80%;
    margin: 0 auto;
}
div.achieve_contents img{
    max-width: 1000px;
    width: 90%;
    margin: 0 auto;
}

/* CTA */
section.Achieve .cta_area{
    padding: 0section.Achieve .cta_area% 0 0;
}

section.Achieve .cta_area img.top_text{
    max-width: 350px;
    width: 52%;
    margin: 0 auto 1%;
}
section.Achieve .cta_area a.btn_requ img{
    max-width: 700px;
    width: 52%;
    margin: 0 auto;
}
section.Achieve p.Fss{
    color: #fff;
}

section.Achieve {
    background-image: url("../img/achieve_bg_pc.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 3% 0;
    min-height: 195px; /* ← 超重要 */
}

/* PCだけ差し替え */
@media screen and (min-width:700px) {
    section.Achieve {
        background-image: url("../img/achieve_bg_pc.jpg");
    }
}
@media screen and (max-width:699px) {
    section.Achieve {
        padding: 27px;
        position: relative;
    }
    div.achieve_contents img{
        width: 100%;
    }
    /* CTA */
    section.Achieve .cta_area{
        position: absolute;
        width: 90%;
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    section.Achieve .cta_area img.top_text{
        width: 70%;
        margin: 0 auto 4%;
    }
    section.Achieve .cta_area a.btn_requ img {
        width: 100%;
    }
}

/* -------------------------料金プラン・コース------------------------- */
@media screen and (min-width:700px){
    section.Price{
        padding: 6% 0 2%;
        background-image: url("../img/gray_bg_pc.png");
        background-repeat: no-repeat; /* 繰り返しなし */
        background-position: bottom;
    }
    section.Price h2 img{
        max-width: 850px;
        width: 80%;
        margin: 0 auto;
    }
}
section.Price h2 img{
    max-width: 850px;
    width: 93%;
    margin: 0 auto;
}
div.price_area{
    margin: 3% auto;
    max-width: 1000px;
    width: 80%;
}
.price_content {
    background: #e3fbe1;
    border-radius: 0 0 30px 30px;
    margin-top: 30px;
}
.price_content h3{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2%;
    color: #fff;
    font-size: 2em;
    letter-spacing: 0.1em;
    background: #14aa2f;
    padding: 1.5% 0;
}
.price_content h3 img{
    width: 5%;
}

/* price01 */
.price_content .price01-1 img{
    width: 90%;
    margin: 2% auto 0;
}
.price_content .price01-2{
    padding-bottom: 6%;
    margin-bottom: 3%;
}

/*-- CTA --*/
.price_content .cta_area{
    background: #fff;
    padding: 3%;
    margin: 0 5%;
}
.price_content .cta_area img.top_text{
    max-width: 350px;
    width: 80%;
    margin: 0 auto 1.5%;
}
.price_content .cta_area a.btn_mail img{
    max-width: 600px;
    width: 80%;
    margin: 0 auto;
}
.price_content .cta_area p{
    text-align: center;
    font-weight: 700;
}
/*-- CTA --*/

/* price02 */
.price_content .price02-1 .main-img img{
    width: 90%;
    margin: 2% auto 0;
}
.price02-1_graph{
    border: solid 2px #14aa2f;
    border-radius: 20px;
    width: 80%;
    margin: 3% auto 0;
    padding: 4%;
}
.price02-1_graph h4 img{
    margin: -9% 0 0 -5.8% !important;
    width: 28% !important;
}

.price02-1_graph div.anno_box{
    background: #ccf4cf;
    padding: 2% 4%;
    width: 80%;
    margin: 0 auto;
}
.price02-1_graph div.anno_box p{
    font-size: 0.8em;
}
.price_content .price02-2{
    padding-bottom: 6%;
}
@media screen and (max-width:699px) {
    section.Price{
        padding: 11% 0 8%;
        background-image: url("../img/gray_bg_sp.png");
        background-repeat: no-repeat;
        background-position: bottom;
    }
    section.Price h2 img {
        margin: 0 auto 5%;
    }
    div.price_area{
        width: 93%;
    }
    .price_content h3 img {
        width: 8%;
    }
    .price_content h3 {
        font-size: 1.28em;
        letter-spacing: 0.03em;
        padding: 3% 0;
    }
    .price_content .price01-1 img {
        width: 100%;
        margin: 0 auto;
    }

    /* cta */
    .price_content .cta_area {
        padding: 5% 3%;
        margin: 0 4%;
    }
    .price_content .cta_area img.top_text {
        margin: 0 auto 3%;
    }
    .price_content .cta_area a.btn_mail img{
        width: 100%;
    }
    .price_content .cta_area p {
        font-size: 0.7em;
    }
    .price_content .cta_area p.Fss{
        font-size: 0.55em;
    }

    .price_content .price02-1 .main-img img{
        width: 100%;
    }
    .price02-1_graph {
        width: 90%;
        border-radius: 13px;
        padding: 10% 4% 7%;
    }
    .price02-1_graph h4 img {
        margin: -18% 0 0 -5.6% !important;
        width: 39% !important;
    }
    .price02-1_graph div.anno_box{
        width: 100%;
        font-size: 0.7em;
    }
}

/*-- 金額アコーディオン start --*/
.price-accordion {
    background: #eafae8;
    width: 80%;
    margin: 3% auto 1%;
}
.price-accordion .price-table {
    width: 100%;
    border-collapse: collapse;
}
.price-accordion .price-table thead tr {
    background: #148835;
    color: #fff;
}
.price-accordion .price-table thead th {
    padding: 16px 20px;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
}
.price-accordion .price-table thead th.acc_toggle {
    width: 63px;
    text-align: center;
    padding: 0;
    position: relative;
}
/* tbody */
.price-accordion .price-table tbody tr td {
    background: #fff;
    padding: 20px;
    border-bottom: 2px solid #e3fbe1;
    font-size: 15px;
}
.price-accordion .price-table tbody tr td:nth-child(1) {
    font-weight: 600;
    text-align: center;
}
.price-accordion .price-table tbody tr td:nth-child(2) {
    color: #0bb04a;
    font-weight: 700;
    font-size: 1.1em;
    text-align: center;
}
/* === ＋／− アイコン（指定のアニメーションを適用） === */
.price-accordion .acc_toggle {
    position: relative;
    width: 48px;
    height: 48px;
    margin: 0 auto;
    color: #0e8e38;
}
/* 背景の白丸 */
.price-accordion .acc_toggle::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 28px;
    height: 28px;
    background: #fff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}
/* アイコンの線（＋の中心） */
.price-accordion .acc_toggle .bar {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%);
}
/* ＋の縦棒 */
.price-accordion .acc_toggle .bar::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 20px;
    height: 3px;
    background-color: currentColor;
    transform: rotate(90deg);
    transition: transform .3s ease-in-out;
}
/* -の横棒 */
.price-accordion .acc_toggle .bar::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 20px;
    height: 3px;
    background-color: currentColor;
    transition: opacity .2s ease-in-out;
}
/* open（マイナス状態） */
.price-accordion .acc_toggle.open .bar::before {
    transform: rotate(180deg);
}
.price-accordion .acc_toggle.open .bar::after {
    opacity: 0;  /* 横棒フェードアウト */
}

/* アコーディオンのレスポンシブ設定 */
@media screen and (max-width:950px) and (min-width:700px) {
    .price-accordion {
        width: 100%;
    }
    .price-accordion .price-table thead th {
        font-size: 16px;
    }
    .price02-1_graph div.anno_box{
        width: 100%;
    }
}
@media screen and (max-width:699px) {
    .price-accordion {
        background: #eafae8;
        width: 100%;
        margin-top: 7%;
    }
    .price-accordion .price-table thead th {
        font-size: 1em;
        padding: 2%;
    }
    .price-accordion .price-table thead th.acc_toggle {
        width: 16px;
    }
    .price-accordion .price-table tbody tr td {
        padding: 15px 0;
    }
    .price-accordion tr.acc_header th{
        line-height: 1;
        padding: 5% 0;
        width: 42%;
    }
    .price-accordion tr.acc_header th span{
        font-size: 0.7em;
    }
}
/*-- 金額アコーディオン end --*/


/* -------------------------料金プラン・コース end------------------------- */


/* -------------------------声------------------------- */
section.Voice{
    padding: 6% 0 3%;
}
div.voice01 h2 img{
    max-width: 850px;
    width: 80%;
    margin: 0 auto;
}
div.voice01 .voice01_contents img{
    max-width: 1200px;
    width: 90%;
    margin: 2% auto;
}
div.voice02{
    margin-top: 6%;
}
div.voice02 h2 img{
    max-width: 850px;
    width: 80%;
    margin: 0 auto;
}
div.voice02 .voice02_contents img{
    max-width: 1200px;
    width: 90%;
    margin: 2% auto;
}
@media screen and (max-width:699px) {
    section.Voice {
        padding: 0;
    }
    div.voice01 .voice01_contents img{
        width: 100%;
        margin: 0 auto;
    }
    div.voice02 .voice02_contents img{
        width: 100%;
        margin: 0 auto;
    }
}


/* -------------------------流れ------------------------- */
section.Flow h2 img{
    max-width: 850px;
    width: 80%;
    margin: 0 auto;
}
div.flow_contents img{
    max-width: 1150px;
    width: 80%;
    margin: 3% auto;
}

@media screen and (min-width:700px) {
    section.Flow{
        padding: 7% 0 2%;
        background-image: url("../img/flow_bg_pc.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
}
@media screen and (max-width:699px) {
    section.Flow{
        padding: 0 !important;
    }
    div.flow_contents img{
        width: 100%;
        margin: 0 auto;
    }
}

/* -------------------------講師紹介------------------------- */
section.Teacher h2 img{
    max-width: 850px;
    width: 80%;
    margin: 0 auto;
}

div.teacher_area{
    max-width: 1000px;
    width: 90%;
    margin: 0 auto;
}
div.teacher_area .teacher_contents{
    border: solid 3px #14aa2f;
    border-radius: 30px;
    height: 200px;
    position: relative;
    margin: 6% 0;
    background: #fff;
}
/* Chrome / Edge / Safari（スクロールバーを必要な時だけ表示） */
div.teacher_area .teacher_contents::-webkit-scrollbar {
    width: 8px;
    opacity: 0;/* 初期状態は非表示 */
}
div.teacher_area .teacher_contents:hover::-webkit-scrollbar,
div.teacher_area .teacher_contents:focus-within::-webkit-scrollbar {
    opacity: 1;/* ホバー or スクロール時のみ表示 */
}
div.teacher_area .teacher_contents::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.3);
    border-radius: 10px;
}

.teacher01{
    margin-top: 9% !important;
}
img.teacher_deco{
    position: absolute;
    right: 4%;
    top: -7%;
    width: 5%;
}
.teacher_contents h4 img{
    position: absolute;
    left: -3px;
    top: -29%;
    width: 55%;
}
/*-- リスト start --*/
div.teacher_contents ul.teacher_comment {
    max-height: 140px;
    overflow-y: auto;
    margin: 5% 1% 0 1%;
    padding: 0 3% 0 6%;
    list-style: none;
    padding-left: 1.2em;
}
/* Chrome / Edge / Safari */
ul.teacher_comment::-webkit-scrollbar {
    width: 6px;
    opacity: 0;
    transition: opacity 0.2s;
}
ul.teacher_comment::-webkit-scrollbar-track {
    background: transparent;
}
ul.teacher_comment::-webkit-scrollbar-thumb {
    background: #aaa;
    border-radius: 6px;
}
ul.teacher_comment::-webkit-scrollbar-button {
    display: none;
}
/* ホバー or スクロール時のみ表示 */
ul.teacher_comment:hover::-webkit-scrollbar,
ul.teacher_comment:active::-webkit-scrollbar {
    opacity: 1;
}
/*  Firefox */
ul.teacher_comment {
    scrollbar-width: thin;
    scrollbar-color: #aaa transparent;
}
/*-- リスト end --*/

/* ドットデザイン */
div.teacher_contents ul.teacher_comment li {
    position: relative;
    margin-bottom: 0.6em;
    padding-left: 1em;
}

div.teacher_contents ul.teacher_comment li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 0.6em;
    height: 0.6em;
    background-color: #14aa2f;
    border-radius: 50%;
}

@media screen and (min-width:700px) {
    section.Teacher{
        padding: 6% 0 1%;
        background-image: url("../img/gray_bg_pc.png");
        background-repeat: no-repeat; /* 繰り返しなし */
        background-position: bottom;
    }
}
@media screen and (max-width:699px) {
    section.Teacher{
        padding: 11% 0 6%;
        background-image: url("../img/gray_bg_sp.png");
        background-repeat: no-repeat;
        background-position: bottom;
        background-size: 100%;
    }
    section.Teacher h2 img{
        width: 93%;
    }
    div.teacher_area {
        font-size: 0.8em;
        width: 93%;
        margin: 15% auto 0;
    }
    div.teacher_area .teacher_contents {
        border: solid 3px #14aa2f;
        border-radius: 10px;
    }
    cher_contents h4 img {
        position: absolute;
        left: -3px;
        top: -12%;
        width: 64%;
    }
    div.teacher_contents ul.teacher_comment {
        max-height: 120px;
        margin: 10% 1% 0 1%;
    }
    div.teacher_area .teacher_contents {
        height: 170px;
        margin: 10% 0;
    }
    .teacher_contents h4 img {
        position: absolute;
        left: -3px;
        top: -19%;
        width: 81%;
    }
    .teacher_contents h4 img.tname {
        width: 88%;
    }
    img.teacher_deco {
        width: 8%;
    }
}


/* -------------------------フォーム 選択時の設定------------------------- */
.cta:hover{
    opacity: 0.6;
}

@media screen and (min-width:700px) {
    section.form{
        padding: 7% 0 10%;
        background-image: url("../img/form_bg_pc.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
}

section.form h2 img{
    max-width: 850px;
    width: 80%;
    margin: 0 auto 1%;
}


.tab-2 {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin: 3vh auto;
    width: 95%;
    max-width: 1300px;
}
.tab-2 > label {
    flex: 1 1;
    order: -1;
    opacity: .5;
    min-width: 70px;
    padding: 1%;
    border-radius: 15px 15px 0 0;
    background-color: #ffe035;
    color: #000;
    font-size: 1.2em;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    display: flex;
    gap: 1%;
    justify-content: center;
    align-items: center;
}
.tab-2 > label:nth-of-type(2) {
    background-color: #f07d00;
    color: #fff;
}
.tab-2 > label img {
    width: 3%;
    min-width: 10px;
    margin-right: 5px;
}
.tab-2 > label img {
    width: 3%;
    min-width: 10px;
    margin-right: 5px;
}
/* #input_b のラベル内の画像だけサイズ変更 */
label[for="input_b"] img {
    width: 4%;
    min-width: 10px;
    margin-right: 5px;
}
.tab-2 > label:hover {
    opacity: .8;
}
.tab-2 > input {
    display: none;
}
.tab-2 > div {
    display: none;
    width: 100%;
    padding: 0;
    background-color: #fff;
    border-radius: 0 0 15px 15px;
}
.tab-2 label:has(:checked) {
    opacity: 1;
}
.tab-2 label:has(:checked) + div {
    display: block;
}

.tab-2 > .form-content {
    display: none;
}

.tab-2 input:checked + img + text + .form-content {
    display: block; /* ←このCSSは消す or 機能しないので、JSで切替へ */
}

.page-download_requ-in{
    display: flex;
}
.page-contact_mail{
    display: flex;
}

.mail-img{
    width: 68%;
}

/* フォーム用css →
資料請求 header-aitokuの「pageaitoku.css」から読み込み */
.aitoku.page-download{
    padding-bottom: 0 !important;
}
.page-download{
    padding-bottom: 0 !important;
}

/* フォーム内下 資料請求詳細 atkdl */
.atkdl{
    padding: 16px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    border: 1px solid var(--Gray, #DFDFDF);
    background: #F8F9FA;
}
.atkdl > div {
    display: flex;
    align-items: center;
}


/* プライバシーポリシー start */
.form .policy {
    width: 80%;
    max-width: 960px;
    margin: auto;
    background-color: #fff;
    max-height: 200px;
    overflow-y: scroll;
    padding: 20px;
}
.form .policy h4{
    font-size: 18px;
}
.form .policy p {
    margin-bottom: 10px;
    font-size: 14px;
    width: 100%;
}
.form table {
    font-size: 14px;
    width: 100%;
    margin-bottom: 14px;
}
.form table ,.form td, .form th {
	border-collapse: collapse;
}
.form td, .form th {
    padding: 3px;
    border-bottom: 1px solid #595959;
}
.form td {
    width: 70%;
}
.form th {
    width: 30%;
    color: #19671d;
    text-align: left;
}
/* プライバシーポリシー end */


@media screen and (max-width:699px) {
    section.form{
        padding: 0;
        background-color: #fffced;
    }
    section.form h2 img {
        width: 100%;
        margin: -0.8% auto 1%;
    }
    section.form p.Fss {
        font-size: 0.7em;
        padding: 0 5% 5%;
    }
    .tab-2 > label{
        font-size: 1em;
        padding: 3% 1%;
    }
    .tab-2 > label img {
        width: 9%;
    }
    label[for="input_b"] img {
        width: 13%;
    }
    .page-download_requ-in {
        display: block;
    }
    .page-contact_mail {
        display: block;
    }
    .mail-img {
        width: 100%;
    }
    .atkdl > div {
        display: block;
    }
    .form .policy{
        max-height: 100px; 
    }
    .form .policy h4 {
        font-size: 0.8em;
    }
    .form .policy p {
        font-size: 0.8em;
    }
}



/* -------------------------会社概要------------------------- */
section.gaiyou{
    background: linear-gradient(180deg,rgba(70, 172, 72, 1) 0%, rgba(16, 134, 50, 1) 50%);
    padding: 1% 0 8%;
}
section.gaiyou h2 img{
    max-width: 800px;
    width: 50%;
    margin: 3% auto;
}

.gaiyou_flx{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 69%;
    margin: 0 auto;
}

.gaiyou_flx>img{
    width: 56%;
}

.gaiyou_flx .gaiyou_hr{
    width: 42%;
    color: #fff;
    padding: 2%;
    box-sizing: border-box;
}

@media screen and (max-width:699px){
    section.gaiyou {
        padding: 10% 0 20%;
    }
    section.gaiyou h2 img {
        width: 93%;
        margin: 3% auto 5%;
    }
    .gaiyou_flx{
        flex-direction: column;
        width: 100%;
    }
    .gaiyou_flx>img{
        width: 90%;
        margin: 0 auto;
    }
    .gaiyou_flx .gaiyou_hr{
        width: 94%;
        margin: 0 auto;
    }
}

/* HRコンサルティング事業部 */
.hr_ttl{
    font-size: 26px;
}

@media screen and (min-width:1300px) and (max-width:1600px){
    .hr_ttl{
        font-size: 24px;
    }
}

@media screen and (min-width:1000px) and (max-width:1300px){
    .hr_ttl{
        font-size: 20px;
    }
}

@media screen and (min-width:699px) and (max-width:1000px){
    .hr_ttl{
        font-size: 16px;
    }
}


@media screen and (max-width:699px){
    .hr_ttl{
        font-size: 19px;
        text-align: center;
        margin: 0 auto;
        display: block;
        padding-top: 30px;
    }
}

.acc-ttl{
    font-size: 22px;
    padding: 5% 4%;
    border-bottom: 2px solid #fff;
    font-weight: bold;
    position: relative;
    cursor: pointer;
}

.acc-content{
    font-size: 19px;
    padding: 5% 4% 3%;
    border-bottom: 1px solid #fff;
}

/* 文字サイズクエリ */
@media screen and (min-width:1450px) and (max-width:1600px){
    .acc-ttl{
        font-size: 20px;
    }
    .acc-content{
        font-size: 17px;
    }
}

@media screen and (min-width:1280px) and (max-width:1450px){
    .acc-ttl{
        font-size: 16px;
    }
    .acc-content{
        font-size: 14px;
    }
}

@media screen and (min-width:1160px) and (max-width:1280px){
    .acc-ttl{
        font-size: 14px;
    }
    .acc-content{
        font-size: 12px;
    }
}

@media screen and (min-width:699px) and (max-width:1160px){
    .acc-ttl{
        font-size: 12px;
    }
    .acc-content{
        font-size: 10px;
    }
}


@media screen and (max-width:699px){
    .acc-ttl{
        font-size: 16px;
    }
    .acc-content{
        font-size: 15px;
    }
}

/* openの場合のスタイル */
.acc-ttl.open{
    border-bottom: 2px solid #fce200;
    color: #fce200;
}

/* content中身スタイル */
.acc-content p{
    padding-left: 40px;
    position: relative;
    margin-bottom: 10px;
}

.acc-content p:before{
    content: '';
    display: block;
    width: 28px;
    height: 28px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
}

/* アイコンサイズクエリ */
@media screen and (min-width:1450px) and (max-width:1600px){
    .acc-content p{
        padding-left: 30px;
    }
    .acc-content p:before{
        width: 20px;
        height: 20px;
    }
}

@media screen and (min-width:1280px) and (max-width:1450px){
    .acc-content p{
        padding-left: 25px;
    }
    .acc-content p:before{
        width: 15px;
        height: 15px;
    }
}

@media screen and (min-width:1160px) and (max-width:1280px){
    .acc-content p{
        padding-left: 20px;
    }
    .acc-content p:before{
        width: 14px;
        height: 14px;
    }
}

@media screen and (min-width:699px) and (max-width:1160px){
    .acc-content p{
        padding-left: 18px;
    }
    .acc-content p:before{
        width: 12px;
        height: 12px;
    }
}

@media screen and (max-width:699px){
    .acc-content p{
        padding-left: 30px;
    }
    .acc-content p:before{
        width: 20px;
        height: 20px;
    }
}

.acc-content .mail:before{
    background-image: url("../img/address_icon.png");
}
.acc-content .mobile:before{
    background-image: url("../img/mobile_icon.png");
    left: 4%;
}
.acc-content .landline:before{
    background-image: url("../img/landline_icon.png");
}

.acc_flx{
    display: flex;
    gap: 25px;
}

.acc-content a{
    color: #fff;
    text-decoration: none;
}

.acc-content a:hover{
    text-decoration: underline;
}

/* アコーディオン設定 */
/* 初期状態 */
.acc-ttl+.acc-content{
    display: none;
}

.acc-ttl:first-child+.acc-content{
    display: block;
}

/* プラスマイナス */
.acc-ttl::before{
    content:'';
    position:absolute;
    top:50%;
    right:20px;
    width:20px;
    height:2px;
    background-color: #fff;
    transform:rotate(90deg);
    transition:all .3s ease-in-out;
}

.acc-ttl::after{
    content:'';
    position:absolute;
    top:50%;
    right:20px;
    width:20px;
    height:2px;
    background-color: #fff;
    transition:all .2s ease-in-out;
}

.acc-ttl.open::before{
    transform:rotate(180deg);
    background-color: #fce200;
}

.acc-ttl.open::after{
    opacity:0;
}