@charset "UTF-8";
/******** タブレット *********/
@media screen and (min-width: 641px) and (max-width: 1300px) {

}
/******** タブレット *********/
@media screen and (min-width: 769px) and (max-width: 1024px) {

}

@media screen and (max-width: 1024px) {
    .news .group {grid-template-columns: 1fr;padding: 0 50px;}
    .news .group dl dt {font-size: 24px;}
    .news .group dl dd.list {grid-template-columns: auto 1fr;grid-template-rows: auto auto;column-gap: 10px;}
    .news .group dl dd.list > .txt {margin-top: 5px;grid-column: 1 / -1;}
    .news .group li {padding: 0;}
    .news .group li:first-child {border-right: unset;}
    .news .group li:last-child {margin: 60px 0 0 0;}
    .news .group li:last-child dl dt {margin: 0 0 40px 0;}
    .news .group dl dd .cat {max-width: 100px;justify-self: start;font-size: 12.8px;padding: 0;}
    .news .group dl dd:not(:last-child) {margin: 0 0 10px 0;padding: 0 0 10px 0;}
    .news .group dl dd .txt {line-height: 1.25em;}
    .news .group dl dd .txt span {font-size: 12.8px;line-height: 1.1em;margin: 5px 0 0 0;}
}

@media screen and (max-width: 768px) {
    .pad {display: none;}
    .introduction ul {grid-template-columns: 1fr;}
    .wpcf7 .box.box1 {grid-template-columns: 1fr;grid-template-rows: repeat(4, 1fr);}
    .wpcf7 .box.box1 .red {display: block}
    
}

/******** スマホ *********/
@media screen and (max-width: 640px) {

    /* ----------------------------- 全体 */
    .pc {
        display: none;
    }
    .sp {
        display: block;
    }

    /* ----------------------------- レイアウト */
    .l-cont {
        width: 100%;
        min-width: inherit;
    }

    /* ----------------------------- ユーティリティ */
    .u-mt {
        margin: 60px 0 0 0;
    }

    /* ----------------------------- コンポーネント */


    /* ----------------------------- ヘッダー*/
    .mv {

    }

    /* ----------------------------- info */
    .info {
        padding: 60px 0;
    }
    .info h2 {
        font-size: 26px;
        height: 55px;
    }
    /* ----------------------------- navi */
    .navi ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: 90px;
    }
    .navi ul:not(:first-child) {
        margin: 10px 0 0 0;
    }
    .navi ul li a {
        font-size: 28px;
        display: flex;
        align-items: center;
    }
    .navi ul li a span.over {
        /* padding-left: 7vw; */
    }
    .navi ul li a .little {
        font-size: 24px;
    }
    .navi ul li a:hover {
        display: flex;
        font-size: 28px;
    }


    /* ----------------------------- introduction */
    .introduction ul {
        grid-template-columns: 1fr;
    }
    .introduction h2 {
        font-size: 26px;
    }
    .introduction p {
        padding: 0 15px 10px;
    }
    /* ----------------------------- */
    header h1 .hero-title.top{width:65vw;}
    header h1 .hero-title.saitama{width:min(100vw,630px);}
    header h1 .hero-title{width:65vw;}
    header .caution{width:100%;text-align: center;bottom:6px;font-size: 12px;}

    .top_open h3{font-size: 22px;line-height: 1.5em;}
    .top_open .grid {grid-template-columns: 1fr;row-gap: 40px;}
    .top_open .dialine{font-size: 17px;margin:0 0 20px 0;}
    .top_state .onicon{font-size: 24px;}
    .top_state .onicon::after{width: 310px;}
    .top_state .youtube ul {grid-template-columns: 1fr;row-gap: 15px;}
    .top_window .onicon {font-size: 24px;}
    .top_window .onicon::after{width: 270px;}
    .top_window .grid{grid-template-columns: 1fr;row-gap: 30px;}
    .top_window .grid li:first-child{order:2;}
    .top_window .grid li img{width: 100%;}
    .top_window .grid .txt{font-size: 20px;}
    .concept .sideline{grid-template-columns: 5% 90% 5%;margin: min(13.5vw,60px) auto 0;}
    /* ----------------------------- line */
    .line {
        padding: 60px 0;
    }
    .line ul {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }
    .line ul li:first-child {
        font-size: 24px;
    }
    .line ul li:first-child span {
        font-size: 32px;
    }
    .line ul li:last-child a img {
        width: 100%;
    }
    .line ul li:last-child {
        transition: .3s;
    }
    .line ul li:last-child:hover {
        opacity: .7;
    }
    

    /* ----------------------------- concept */
    .concept {

    }
    .concept-inner {
        height: unset;
        padding: 45px 0;
    }
    .concept .l-grid {
        grid-template-columns: 1fr;
        margin: 0;
        row-gap: 15px;
    }
    .concept ul {
        /* grid-template-columns: repeat(4, 1fr); */
    }


    /* ----------------------------- top_information */
    .top_information dl dd.list {
        grid-template-columns: 1fr;
    }
    
    .top_information.schedule dl dd.list {
        grid-template-columns: 1fr;
        row-gap: 15px;
    }
    .top_information.schedule dl dd p.txt{
        line-height: 1em;
    }

    .top_information2 dl dd.list {
        grid-template-columns: 1fr;
    }
    

    /* ----------------------------- news */
    .news {
        padding: 60px 0;
    }
    .news .group {
        grid-template-columns: 1fr;
        padding: 0 15px;
    }
    .news .group dl dt {
        font-size: 24px;
    }
    .news .group dl dd.list {
        grid-template-columns: auto 1fr; /* 1行に2列を表示 */
        grid-template-rows: auto auto; /* 3つ目のアイテムを次の行に移動 */
        column-gap: 10px;
        /* border-bottom: 1px dotted #888; */
    }
    .news .group dl dd.list > .txt {
        margin-top: 5px;
        grid-column: 1 / -1; /* 3つ目のアイテムを1列目から最後の列まで拡大 */
    }
    .news .group li {
        padding: 0;
    }
    .news .group li:first-child {
        border-right: unset;
    }
    .news .group li:last-child {
        margin: 60px 0 0 0;
    }
    .news .group li:last-child dl dt {
        margin: 0 0 40px 0;
    }
    .news .group dl dd .cat {
        max-width: 100px;
        justify-self: start;
        font-size: 12.8px;
        padding: 0;
    }
    .news .group dl dd:not(:last-child) {
        margin: 0 0 10px 0;
        padding: 0 0 10px 0;
    }
    .news .group dl dd .txt {
        line-height: 1.25em;
    }
    .news .group dl dd .txt span {
        font-size: 12.8px;
        line-height: 1.1em;
        margin: 5px 0 0 0;
    }
    .news .youtube ul {
        grid-template-columns: 1fr;
        row-gap: 15px;
    }
    .news .group dl dd.sarani {
        margin: 10px 0 0 0;
    }

    

    /* ----------------------------- overview */
    .overview .group {
        /* flex-direction: column; */
        column-gap: 15px;
    }
    .overview h2 {
        font-size: 26px;
        height: 55px;
    }
    .overview .group li {
        /* height: 174px; */
        height: clamp(100px,44vw,258px);
    }
    .overview .group li a {
        font-size: 22px;
        padding: 60px 0;
    }
    .overview .group li a span {
        font-size: 18px;
        display: inline-block;
        margin-top: 10px;
    }
    .overview .arch-flag img {
        width: ;
    }
    
    /*------------------------------ fix-button */
    #fixed-button {
        font-size: 16px;
        top: unset;
        right: unset;
        bottom: 0;
        width: 100%;
        border-radius: 0;
    }
    #fixed-button a {
        text-align: center;
    }
    #fixed-button span {
        display: inline-block;
        margin: 0 0 0 5px;
    }
    #fixed-button span img {
        vertical-align: text-top;
    }
    .fixed-button {
        display: none;
    }

    /* ----------------------------- form */
    .form {
        padding: 60px 0;
    }
    .form h3 {
        font-size: 26px;
    }
    .form .group {
        margin: 20px 0 20px 0;
    }
    .form .group h4 {
        font-size: 22px;
    }
    .form .group p {
        font-size: 18px;
    }
    .wpcf7 .box {
        display: block;
    }
    .wpcf7 .box.box1 {
        grid-template-columns: 1fr;
        grid-template-rows: unset;
        grid-auto-flow: unset;
    }
    .wpcf7 .box.box2 li:first-child {
        padding: 12px 0 0 0;
    }
    .wpcf7 .box.box2.denki {
        display: block;
    }
    .wpcf7 .box.box2.denki li:nth-of-type(3) {
        margin-top: 5px;
    }
    .wpcf7 table th,
    .wpcf7 table td {
        width: 100%;
        display: block;
    }
    .wpcf7 table td {
        padding: 0 0 25px 0 ;
    }
    .wpcf7 table td input {
        width: 100%;
    }
    .wpcf7 .box.box2.denki li:first-child {
        padding: 12px 0 0 0;
    }

    /* ----------------------------- footer */
    footer ul {
        margin: 30px 0 0 0;
    }
    footer .footer-inner .box {
        flex-direction: column;
    }
    footer .footer-inner .box .img-txt {
        flex-direction: column;
        row-gap: 10px;
    }
    footer .footer-inner .box ul {
        justify-content: center;
    }
    footer small {
        margin: 40px 0 0 0;
    }





    /* ----------------------------- prefecture */
    .prefecture ul {
        grid-template-columns: repeat(2, 1fr);
    }
    .prefecture ul li {
        padding: 5px;
    }
    .prefecture ul li:nth-of-type(2n) {
        border-right: unset;
    }
    .prefecture ul li:nth-of-type(3) {
        border-right: 2px dotted #333;
    }
    .prefecture ul li:nth-of-type(3n) {
        border-right: 2px dotted #333;
    }
    .prefecture ul li:nth-of-type(n+20) {
        border-bottom: 2px dotted #333;
    }
    .prefecture ul li a span.txt1 {
        font-size: 20px;
    }
    .prefecture ul li a span.txt2 {
        font-size: 18px;
    }
    .prefecture ul li a {
        line-height: 1em;
    }



    /* ----------------------------- フッター */
    footer h4 {
        font-size: 18px;
    }
    footer .l-grid {
        grid-template-columns: 1fr;
        row-gap: 40px;
    }



    /* ----------------------------- 会社概要 */
    .company_block1 {
        margin: 100px 0 100px 0;
    }
    .company_block1 .group ul {
        grid-template-columns: 1fr;
        row-gap: 10px;
    }
    .company_block1 .group ul:not(:first-child) {
        margin: 60px 0 0 0;
    }
    .company_block1 .group ul li:first-child {
        /* order: 2; */
    }
    .company_block1 .group ul li:last-child {
        /* order: 1; */
    }
    .company_block1 .group ul li dl {
        display: flex;
        align-items: center;
        column-gap: 15px;
    }
    .company_block1 .group ul li dl dt {
        width: 30%;
        margin: 10px 0 0 0;
        order: 2;
    }
    .company_block1 .group ul li dl dd {
        order: 1;
    }
    .company_block1 .group ul li dl dt img {
        width: 100%;
    }
    .company_block1 .group ul li dl dd .box .tit {
        font-size: 20px;
    }
    .company_block1 .group ul li dl dd .box .tit span {
        font-size: 12px;
    }
    .company_block1 .group ul li dl dd .box .num {
        width: 30px;
    }
    .company_block2 .l-grid {
        grid-template-columns: 1fr;
        margin: 0;
        row-gap: 15px;
    }
    .company_block2-inner {
        height: unset;
        padding: 45px 0;
    }
    .company_block3 h2 {
        font-size: 30px;
    }
    .company_block3 table th {
        display: block;
        width: 100%;
        border-bottom: unset;
        padding: 10px 0 5px 0;
    }
    .company_block3 table td {
        display: block;
        padding: 5px 0 10px 0;
    }
    .company_block4 h2 {
        font-size: 30px;
    }


}