@charset "UTF-8";
@media screen and (max-width: 1024px) {

    /*works*/
    .webgene-pagination :is(.prev, .next),
    .webgene-pagination ul .number.selected,
    .webgene-pagination ul .number {
        width: 2em;
        height: 2em;
        margin: 0;
    }
    .webgene-pagination ul {
        width: 100%;
        justify-content: space-between;
    }
    .webgene-pagination .prev {
        margin: 0;
    }
    .webgene-pagination .next {
        margin: 0;
    }





    /*contact*/
    .privacyformError {
        margin-top: -36.5px !important;
    }




    /*index*/
    .index .mainimg {
        height: 44rem;
    }
    .index .maintitle * {
        text-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.7)
    }
    .index .mainimg .pic {
        height: 44rem;
    }
    .index .maintitle {
        bottom: initial;
        top: 50%;
    }
    .index .maintitle p {
        font-size: 1.4rem;
    }
    .index .maintitle h2 {
        font-size: 1.8rem;
    }
    .index .mainimg .webgene-blog {
        right: 5%;
        bottom: 2rem;
        width: 90%;
        min-width: 0;
    }
    .index .mainimg .webgene-blog .webgene-item * {
        text-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.7)
    }
    .index_cnt1 {
        padding: 8rem 0;
    }
    .index_cnt1 .inner .col2,
    .index_cnt1 .inner .col2b {
        margin: 0 auto 6rem;
    }
    .index_cnt1 .inner>.col2 .left {
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .index_cnt1 .inner .set {
        display: block;
        margin: 0 auto 6rem;
    }
    .index_cnt1 .inner .set [class^="pic"] {
        width: 100%;
        margin: 0 auto 2rem;
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .index_cnt1 .inner .col2b .left {
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .index_cnt2 .inner {
        padding: 8rem 0;
    }
    .index_cnt2 .grid {
        width: 90%;
        grid-template-columns: 1fr;
    }
    .index_cnt2 .grid .set .dt {
        font-size: 2.2rem;
    }
    .index_cnt2 .inner .banner {
        width: 90%;
    }
    .index_cnt2 .inner .banner .col2 .left .badge {
        width: 18vw;
    }
    .index_cnt3 {
        padding: 8rem 0;
    }
    .index_cnt3 .inner .col2 {
        margin: 0 0 5rem;
        display: grid !important;
    }
    .index_cnt3 .inner .col2 .right {
        grid-row: 1;
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .index_cnt4 {
        padding: 8rem 0;
    }
    .index_cnt4 .inner .col2::before {
        display: none;
    }
    .index_cnt4 .inner .col2 :is(.left, .right) {
        aspect-ratio: initial;
    }
    .index_cnt5 {
        padding: 8rem 0;
    }
    .index_cnt5 .inner .webgene-blog {
        display: block;
    }
    .index_cnt5 .inner .webgene-blog .webgene-item:not(:last-of-type) {
        margin: 0 0 3rem;
    }




    /*about*/
    .about_cnt1 {
        padding: 8rem 0 0;
    }
    .about_cnt1 .inner .col2 {
        padding: 6rem 0;
    }
    .about_cnt1 .inner .col2::before {
        display: none;
    }
    .about_cnt1 .inner .col2 .left {
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .about_cnt2 {
        padding: 8rem 0;
    }
    .about_cnt2 .inner [class^="pic"] {
        position: static;
        width: 100%;
        margin: 3rem auto 0;
    }
    .about_cnt3 {
        padding: 8rem 0 0;
    }
    .about_cnt3 .window {
        /*height: 36rem;*/
    }
    .about_cnt3 .window .inner h4 {
        font-size: 2.2rem;
    }
    .about_cnt4 {
        padding: 8rem 0;
    }
    .about_cnt4 .inner .col2::before {
        display: none;
    }
    .about_cnt4 .inner .col2 :is(.left, .right) {
        aspect-ratio: initial;
    }



    /*menu*/
    .menu_cnt1 {
        padding: 8rem 0;
    }
    .menu_cnt1 .inner .set .col2 {
        margin: 0 auto 5rem;
    }
    .menu_cnt1 .inner .set .col2 .left h4 {}
    .menu_cnt1 .inner .set .window .strong {
        font-size: 2.4rem;
    }
    .menu_cnt1 .inner .set#sec6 .col2 .left .strong {
        font-size: 2.4rem;
    }
    .menu_cnt1 .inner .set .col2b .left .strong {
        font-size: 2.4rem;
    }
    .menu_cnt1 .inner .set .col2b .right .dt {
        font-size: 1.4rem;
    }
    .menu_cnt1 .inner .set .col2b .right .age {
        font-size: 2.4rem;
    }
    .menu_cnt1 .inner .set:not(:last-of-type) {
        margin: 0 0 6rem;
    }
    .menu_cnt2 {
        padding: 8rem 0 10rem;
    }
    .menu_cnt2 .inner .grid {
        grid-template-columns: 1fr;
        gap: 5rem;
    }




    /*beginner*/
    .beginner_cnt1 {
        padding: 8rem 0 10rem;
    }
    .beginner_cnt1 .inner .dl {
        display: block;
    }
    .beginner_cnt1 .inner .dt {
        margin: 0 0 1rem;
    }
    .beginner_cnt1 .inner .dd {
        width: 100%;
    }
    .beginner_cnt1 .inner .banner {
        margin: 8rem auto 0;
    }
    .beginner_cnt1 .inner .banner .col2 .right h4 {
        font-size: 2.2rem;
    }
    .beginner_cnt2 {
        padding: 8rem 0 10rem;
    }
    .beginner_cnt2 .inner .dl {
        padding: 0 0 8rem 15%;
    }
    .beginner_cnt2 .inner .dt {
        font-size: 2.4rem;
    }
    .beginner_cnt2 .inner .dl::before {
        font-size: 2.4rem;
    }
    .beginner_cnt2 .inner .flex {
        display: block;
    }
    .beginner_cnt2 .inner .pic {
        margin: 0 0 3rem;
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }




    /*faq*/
    .faq_cnt1 {
        padding: 8rem 0;
    }
    .faq_cnt1 .inner .flex {
        flex-wrap: wrap;
    }
    [class^="faq_cnt"]:not(.faq_cnt1) {
        padding: 5rem 0 6rem;
    }
    [class^="faq_cnt"]:not(.faq_cnt1) .dt,
    [class^="faq_cnt"]:not(.faq_cnt1) .dd {}
    [class^="faq_cnt"]:not(.faq_cnt1) .dt::before,
    [class^="faq_cnt"]:not(.faq_cnt1) .dd::before {
        left: 0.8em;
    }




    /*recruit*/
    .recruit_cnt1 {
        padding: 8rem 0 10rem;
    }
    .recruit_cnt1 .inner .col2 .left {
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .recruit_cnt2 {
        padding: 8rem 0 15rem;
    }
    .recruit_cnt2::after {
        font-size: 6rem;
    }
    .recruit_cnt2 .inner .col2 {
        padding: 5rem 0;
    }
    .recruit_cnt2 .inner .col2 .left {
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .recruit_cnt2 .inner .col2 .right h4::before {
        font-size: 2.4rem;
    }
    .recruit_cnt3 {
        padding: 8rem 0;
    }
    .recruit_cnt3 .inner .ul {
        grid-template-columns: 1fr;
    }
    .recruit_cnt3 .inner .li:nth-of-type(2),
    .recruit_cnt3 .inner .li:nth-of-type(3) {
        background: #fff;
    }
    .recruit_cnt4 {
        padding: 8rem 0;
    }
    .recruit_cnt4 .inner>.dl {
        grid-template-columns: 1fr;
        margin: 0 auto 5rem;
    }
    .recruit_cnt4 .inner>.dl>.pic {
        grid-row: auto;
        grid-column: 1;
        margin: 0 0 2rem;
    }
    .recruit_cnt4 .inner>.dl>.dd:not(.cmt, .pic) {
        display: block;
    }
    .recruit_cnt4 .inner>.dl>.dd:not(.cmt, .pic)>.dl:not(:last-of-type) {
        margin: 0 0 3rem;
    }
    .recruit_cnt5 {
        padding: 8rem 0 10rem;
    }
    .recruit_cnt5 .inner .grid {
        grid-template-columns: 1fr;
    }
    .recruit_cnt6 {
        padding: 8rem 0;
    }




    /*academy*/
    .academy_cnt2 {
        padding: 8rem 0;
    }
    .academy_cnt2 .inner .grid {
        grid-template-columns: 1fr;
    }
    .academy_cnt3 {
        padding: 8rem 0;
    }
    .academy_cnt3 .inner .col2 .left {
        margin: 0 0 3rem;
    }
    .academy_cnt3 .inner .dl {
        display: block;
    }
    .academy_cnt3 .inner .dt,
    .academy_cnt3 .inner .dd {
        width: 100%;
    }
    .academy_cnt4 {
        padding: 8rem 0;
    }
    .academy_cnt4 .inner .col2 .left .badge {
        max-width: 10rem;
    }
    .academy_cnt4 .inner .col2 .right .read {
        white-space: normal;
        font-size: 1.9rem;
    }
    .academy_cnt4 .inner .col2 .right .cap {
        font-size: initial;
    }
    .academy_cnt5 {
        padding: 8rem 0;
    }
    .academy_cnt5 .inner .col2 .left {
        padding: 0;
        margin: 0 auto 3rem;
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }




    /*access*/
    .access_cnt1 {
        padding: 8rem 0 10rem;
    }
    .access_cnt1 .inner .col2 {
        margin: 0 auto 8rem;
    }
    .access_cnt1 .inner .col2 .left {
        margin: 0 0 3rem;
        border: 1rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .access_cnt1 .inner .col2 .right .flex {
        display: block;
    }
    .access_cnt1 .inner .col2 .right .dl {
        display: block;
    }
    .access_cnt1 .inner .col2 .right .dt {
        width: 100%;
    }
    .access_cnt1 .inner .col2 .right .dd {
        width: 100%;
        text-align: center;
    }
    .access_cnt2 {
        margin: 0 auto 10rem;
    }
    .access_cnt2 .grid {
        grid-template-columns: 1fr;
    }




    /*blog*/
    :is(.blog_cnt1, .blogdetail_cnt1) .inner {
        display: block;
    }
    :is(.blog_cnt1, .blogdetail_cnt1) .inner .webgene-blog {
        width: 100%;
        flex-wrap: wrap;
    }
    :is(.blog_cnt1, .blogdetail_cnt1) .inner .webgene-blog .webgene-item {
        width: 100%;
    }
    .blog_cnt2 .inner .webgene-blog {
        grid-template-columns: repeat(2, 1fr);
    }
    .blogdetail_cnt2 .inner .webgene-blog .webgene-item .cate {
        margin: 0;
    }
    .blog_cnt2 .inner .webgene-blog {
        display: block;
    }
    .blog_cnt2 .inner .webgene-blog .webgene-item {
        margin: 0 0 3rem;
    }



    /*contact*/
    .contact_cnt1 {
        padding: 8rem 5%;
    }
    .contact_cnt1 .inner .col2 {
        height: initial;
    }
    .contact_cnt1 .inner .col2 .left {
        margin: 0;
        padding: 1rem;
    }
    .contact_cnt1 .inner .col2 .right {
        margin: 0;
        padding: 1rem;
    }
    .contact_cnt1 h3 {
        font-size: 2.8rem;
    }
    form .dl {
        display: block;
    }
    form .dl .dt,
    form .dl .dd {
        width: 100%;
    }
    form .terms {
        height: 30rem;
    }
    form .col label {
        font-size: 1rem;
    }



    /*横並びが狭すぎて改行が崩れる箇所を縦並びに*/
    .index_cnt3 .inner .dl {
        display: block;
    }
    .index_cnt3 .inner .ruby {
        margin: 0 0 1rem;
    }
    .index_cnt3 .inner .cmt {
        margin: 2rem 0 0;
    }
    .index_cnt2 .inner .banner .col2 .right .flex,
    .beginner_cnt1 .inner .banner .col2 .right .flex {
        flex-wrap: wrap;
    }
    .menu_cnt1 .inner>.ul {
        flex-wrap: wrap;
    }
    .menu_cnt1 .inner .set .col2b .left .ul {
        flex-wrap: wrap;
    }
    .recruit_cnt2 .inner .col2 .right h4 {
        flex-wrap: wrap;
    }
    .recruit_cnt4 .inner>.dl>.dt {
        flex-wrap: wrap;
        font-size: 2.2rem;
    }
    .recruit_cnt4 .inner>.dl>.dt::before {
        font-size: 2.2rem;
    }
}

/*----------------*/
/* スマホ */
@media screen and (max-width: 767px) {
  .inner {width: 90%;}
  h4 {font-size: 2rem !important;}
.index .mainimg .webgene-blog{display:none;}
 .index .maintitle h2 {font-size: 2.2rem;}
.index_cnt2 .grid .set h4 {
  justify-content: start;
  gap: 1rem;
}
  .index_cnt2 .grid .set h4::before {
    width: 6.7rem;
    min-width: 6.7rem;
  }
  .index_cnt2 .grid .set .dt a::after {align-self: center;}
  .index_cnt2 .grid .set .dt a {display: flex;}
      .index_cnt2 .inner {width: 90%;}
  .index_cnt2 .inner .banner,.about_cnt3 .window .inner{width:100%;}
  .index_cnt4 .inner .col2 :is(.left, .right),.index_cnt3 .inner .dl,.about_cnt4 .inner .col2 :is(.left, .right){padding: 2rem 0rem 2rem 0rem;}
  .header .nav .ul {align-items: start;}
  .about_cnt2 .inner [class^="pic"] {border: 1rem solid #fff;}
  .about_cnt3 .window:nth-of-type(2) {background: url(/system_panel/uploads/images/about_cnt3_1.jpg) no-repeat 65% center;}
  .menu_cnt1 .inner .set .col2b .left .li,.menu_cnt1 .inner .set .col2 .left .li {margin: 0 0 1rem;}
  .menu_cnt1 .inner .set .col2b .left .ul {display: block;}
.recruit_cnt4 .inner>.dl>.dt {font-size: 2.1rem;}
  .recruit_cnt4 .inner>.dl>.dt,.recruit_cnt4 .inner>.dl>.dd:not(.cmt, .pic)>.dl { gap: 1rem;}
  .recruit_cnt4 .inner>.dl>.dd:not(.cmt, .pic)>.dl:not(:last-of-type) {margin: 0 0 5rem;}
  .recruit_cnt6 .inner .catch {font-size: 2.8rem;}
  [class^="button"] :is(a, span) {padding: 0 1em;}
  .recruit_cnt3 .inner .li {font-size: 2rem;}
  .recruit_cnt5 .inner .grid .dd {padding: 0;}
  .blogdetail_cnt2 .inner .webgene-blog .webgene-item .cate {margin: 0 0 0 8em;}
  .blogdetail_cnt2 .inner .webgene-blog .webgene-item .dt {font-size: 2.2rem;}
  form .col label {font-size: 1.5rem;}
}
/* タブレット */
@media (min-width:767px) and (max-width:1024px){
    .index .mainimg .webgene-blog {width: 45%;}
  .header .nav .ul {max-width: 50rem;}
  .menu_cnt2 .inner .grid {grid-template-columns: repeat(3, 1fr);}
  .recruit_cnt6 .inner .catch {font-size: 2.7rem;}
  .academy_cnt1 .inner .col2 .left {aspect-ratio: 6.6 / 5.6;}
  .academy_cnt1 .inner .col2 {display: flex !important;}
  .academy_cnt2 .inner .grid {grid-template-columns: 1fr 1fr;}
  .academy_cnt3 .inner .dl {
    display: flex;}
}
/* PC（1025px以上） */
@media screen and (min-width: 1025px) {
  .spbr br,.index .maintitle h2 br:nth-child(1){
    display:none;
  }
  .menu .mainimg .pic img {
        object-position: center 70%;
}
  .menu_cnt1 .inner .set .col2 .right {
    width: 55%;
  }
    .header .nav .ul .li:nth-of-type(1), .header .nav .ul .li:nth-of-type(2), .header .nav .ul .li:nth-of-type(3), .header .nav .ul .li:nth-of-type(4), .header .nav .ul .li:nth-of-type(5) {
    margin-left: 15rem;
    }
}
@media screen and (min-width: 1800px) {
   .mainimg .slidepic02 img,
.mainimg .slidepic03 img {
    transform: translateY(-250px); 
}
.mainimg .slidepic02,
.mainimg .slidepic03 {
    overflow: hidden;
}
  .index .mainimg .webgene-blog {
    width: 20.28vw;
  }
}