@media (max-width: 1200px) {
/*****************************************************

    ヘッダー

*****************************************************/
    .hd-middle .middle-tit .inn h2 {
        font-size: 110px;
    }

/*****************************************************

    トップメニュー

*****************************************************/
    #topmenu li .txt {
        font-size: 40px;
    }

/*****************************************************

    ビジネス

*****************************************************/
    .business-item .box .inn .txtbox {
        width: 700px;
    }

/*****************************************************

    リクルート

*****************************************************/
    #recruit {
        padding-left: 60px;
        padding-right: 60px;
    }

/*****************************************************

    トピックス

*****************************************************/
    #topics {
        padding-left: 60px;
        padding-right: 60px;
    }
    .topics .inn ul {
        width: 750px;
    }

/*****************************************************

    フッター

*****************************************************/
    footer .ft-menu {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 1100px) {
/*****************************************************

    ヘッダー

*****************************************************/
    .hd-middle .middle-tit .inn h2 {
        font-size: 90px;
        line-height: 1;
    }
    .hd-middle .middle-tit .inn .line {
        width: 430px;
    }
    .hd-middle .middle-tit.on .inn .line {
        top: 52%;
    }
    .hd-middle .middle-tit .inn .subtit {
        font-size: 35px;
    }
    .hd-middle .middle-tit.on .inn .subtit {
        top: 54%;
    }
    .hd-middle .middle-tit .inn .txt {
        font-size: 20px;
    }
    .hd-middle .middle-tit.on .inn .txt {
        top: 63%;
    }

/*****************************************************

    ビジネス

*****************************************************/
    .business-item .box .inn .txtbox .txtinn {
        padding: 40px;
    }

/*****************************************************

    トピックス

*****************************************************/
    .topics .inn ul {
        width: 650px;
    }

/*****************************************************

    フッター

*****************************************************/
    footer .ft-menu ul li {
        padding-right: 30px;
        margin-right: 30px;
    }
}

@media (max-width: 1000px) {
    section {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    section .subtit {
        font-size: 18px;
    }
    section h2 {
        font-size: 45px;
    }
/*****************************************************

    アバウト

*****************************************************/
    .about h3 {
        font-size: 30px;
    }
    #hoge canvas {
        height: 600px !important;
    }

/*****************************************************

    ビジネス

*****************************************************/
    .business-top {
        padding-top: 60px;
    }
    .business-item {
        padding-bottom: 60px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .right .subtit {
        font-size: 15px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .right .tit {
        font-size: 35px;
    }

/*****************************************************

    リクルート

*****************************************************/
    .recruit .inn {
        padding-top: 60px;
        padding-bottom: 60px;
    }

/*****************************************************

    トピックス

*****************************************************/
    .topics .inn ul {
        width: 600px;
    }
    .topics .inn li .right {
        width: 70%;
        box-sizing: border-box;
    }

/*****************************************************

    フッター

*****************************************************/
    footer .ft-menu {
        display: block;
    }
    footer .ft-logo {
        margin-bottom: 40px;
    }
    footer .ft-menu ul {
        justify-content: center;
    }
}

@media (max-width: 900px) {
    section h2 {
        font-size: 40px;
    }
/*****************************************************

    アバウト

*****************************************************/
    .about h3 {
        font-size: 25px;
        margin-bottom: 50px;
    }

/*****************************************************

    トップメニュー

*****************************************************/
    #topmenu li .txt {
        font-size: 30px;
    }

/*****************************************************

    ビジネス

*****************************************************/
    .business-top {
        padding-bottom: 250px;
    }
    .business-item .box .inn .txtbox {
        width: 570px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .left {
        margin-right: 30px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .right .tit {
        font-size: 30px;
    }
    .business-item .box .inn .txtbox .txtinn .txt {
        font-size: 14px;
    }

/*****************************************************

    リクルート

*****************************************************/
    .recruit .inn .txt {
        font-size: 16px;
    }

/*****************************************************

    トピックス

*****************************************************/
    .topics .inn ul {
        width: 540px;
    }
    .topics .inn li {
        padding: 20px;
    }
    .topics .inn li .left .data {
        margin-right: 20px;
    }
}

@media (max-width: 860px) {
/*****************************************************

    ヘッダー

*****************************************************/
    .menu-container .menu ul li {
        margin-right: 30px;
    }
    .menu > ul > li > ul .inn {
        padding: 20px;
    }
    .menu > ul > li > ul .inn .listtit {
        padding-right: 20px;
    }
    .menu > ul > li > ul .inn .listtit .txt {
        font-size: 14px;
    }
    .menu > ul > li > ul .inn .listtit .tit {
        font-size: 20px;
    }
    .menu-container .menu ul li ul li:first-child {
        padding-left: 0;
    }
    .menu-container .menu ul li ul li:nth-child(2) {
        padding-left: 20px;
    }
    .menu-container .menu ul li ul li {
        padding-left: 20px;
    }
    .menu-container .menu ul li ul li .txt {
        font-size: 14px;
        margin-top: 15px;
    }

/*****************************************************

    ビジネス

*****************************************************/
    .business-item .box .inn .txtbox {
        width: 490px;
    }
}

@media (max-width: 768px) {
    section {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }
    section .subtit {
        font-size: 16px;
    }
    section h2 {
        font-size: 25px;
    }
    .about h3 {
        font-size: 18px;
        margin-top: 30px;
        margin-bottom: 30px;
    }
/*****************************************************

    ヘッダー

*****************************************************/
    header .hd-top {
        display: none;
    }
    .header-sp {
        display: block;
        width: 100%;
        position: fixed;
        top: 0;
        z-index: 11111;
    }
    .header-sp .main-tit {
        height: 60px;
        display: flex;
        align-items: center;
        padding: 0 20px;
    }
    .hd_color .header-sp {
        background-color: #fff;
    }
    header nav.globalMenuSp .sample01 ul .child,
    .sample01 ul li:hover ul li:hover ul {
        display: none;
    }
    .header-sp h1 {
        background-image: url("../img/common/hd-logo.svg");
        background-repeat: no-repeat;
        width: 128px;
        height: 30px;
        display: block;
    }
	.header-sp h1 a {
		height: 100%;
		display: block;
	}
    .hd_color .header-sp h1 {
        background-image: url("../img/common/hd-logo-active.svg");
    }
	.hd_color .header-sp h1 a {
		height: 100%;
		display: block;
	}
    .hd-middle {
        padding-top: 60px;
    }
    .hd-middle .middle-tit .inn h2 {
        font-size: 55px;
        line-height: 1;
    }
    .hd-middle .middle-tit.on .inn .line {
        width: 280px;
        top: 45%;
    }
    .hd-middle .middle-tit .inn .subtit {
        font-size: 22px;
        margin-bottom: 15px;
    }
    .hd-middle .middle-tit.on .inn .subtit {
        top: 48%;
        margin-bottom: 0;
    }
    .hd-middle .middle-tit .inn .txt {
        font-size: 14px;
    }
    .hd-middle .middle-tit.on .inn .txt {
        top: 54%;
    }

/*****************************************************

    ナビゲーション

*****************************************************/
    header nav.globalMenuSp {
        position: absolute;
        /*z-index: -1;*/
        top: 0;
        left: 0;
        background: #102c54;
        transform: translateY(-200%);
        transition: all 0.6s;
        width: 100%;
        height: 100vh;
        padding: 15px 0 30px;
        overflow: scroll;
    }
    header nav.globalMenuSp .logo {
        padding-left: 20px;
        padding-bottom: 50px;
    }
    header nav.globalMenuSp .logo a {
        display: block;
    }
    header nav.globalMenuSp a {
        color: #fff;
    }
    header nav.globalMenuSp ul {
        padding: 0 20px;
    }
    header nav.globalMenuSp ul li {
        color: #fff;
        border-bottom: 1px solid #3c5374;
    }
    header nav.globalMenuSp ul li a {
        height: 40px;
        display: flex;
        align-items: center;
        padding: 10px 20px;
        position: relative;
        font-size: 18px;
        font-family: 'Poppins', sans-serif;
    }
    header nav.globalMenuSp ul li ul.child {
        padding-bottom: 30px;
    }
    header nav.globalMenuSp ul li ul.child li {
        border-bottom: none;
    }
    header nav.globalMenuSp ul li ul.child li a {
        font-size: 14px;
        font-family: 'Noto Sans JP', sans-serif;
        height: 30px;
    }
    header nav.globalMenuSp ul li ul.child li a i {
        margin-right: 20px;
    }
    .navToggle {
        display: block;
        position: absolute;
        right: 20px;
        top: 14px;
        width: 42px;
        height: 42px;
        cursor: pointer;
        z-index: 3;
        text-align: center;
    }
    .navToggle span {
        display: block;
        position: absolute;
        width: 35px;
        border-bottom: solid 2px #fff;
        -webkit-transition: .35s ease-in-out;
        -moz-transition: .35s ease-in-out;
        transition: .35s ease-in-out;
        left: 6px;
    }
    .hd_color .navToggle span {
        border-bottom: solid 2px #0e2b55;
    }
    .hd_color .navToggle.active span {
        border-bottom: solid 2px #fff;
    }
    .navToggle span:nth-child(1) {
        top: 9px;
    }
    .navToggle.active span:nth-child(1) {
        top: 18px;
        left: 6px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    .navToggle span:nth-child(2) {
        top: 18px;
    }
    .navToggle.active span:nth-child(2),
    .navToggle.active span:nth-child(3) {
        top: 18px;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .navToggle span:nth-child(3) {
        top: 27px;
    }
    nav.globalMenuSp.active {
        transform: translateY(0%);
    }
    nav.globalMenuSp ul li a span:after {
        content: "";
        background-image: url("../img/nav/icon_plus.svg");
        background-repeat: no-repeat;
        background-size: cover;
        width: 18px;
        height: 18px;
        display: block;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%) translateX(0);
        -webkit- transform: translateY(-50%) translateX(0);
    }
    nav.globalMenuSp ul li a.active span:after {
        background-image: url("../img/nav/icon_minus.svg");
    }
    header nav.globalMenuSp .closebtn {
        width: 70%;
        margin: 40px auto 0;
        border: solid 1px #fff;
    }
    header nav.globalMenuSp .closebtn a {
        font-size: 18px;
        font-family: 'Poppins', sans-serif;
        line-height: 1;
        text-align: center;
        padding: 15px 0;
        display: block;
    }

/*****************************************************

    アバウト

*****************************************************/
    .about {
        width: 90%;
    }
    .about .txt {
        font-size: 14px;
    }
    #hoge canvas {
        height: 500px !important;
    }

/*****************************************************

    トップメニュー

*****************************************************/
    #topmenu {
        background-color: #fff;
    }
    #topmenu ul {
        display: block;
    }
    #topmenu li .photo {
        display: none;
    }
    #topmenu li .photo-sp {
        display: block;
    }
    #topmenu li .txtbox {
        left: 20px;
        bottom: 20px;
    }
    #topmenu li .category {
        font-size: 16px;
        margin-bottom: 10px;
    }
    #topmenu li .category:after {
        margin-top: 10px;
    }
    #topmenu li .company {
        width: 70px;
    }
    #topmenu li .ceo {
        width: 125px;
    }
    #topmenu li .corporate {
        width: 70px;
    }
    #topmenu li .txt {
        font-size: 25px;
    }

/*****************************************************

    ビジネス

*****************************************************/
    #business {
        padding-left: 0;
        padding-right: 0;
    }
    .business-item {
        padding-bottom: 40px;
    }
    .business-top {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .business-item .box-top {
        top: 0;
        padding-left: 0;
    }
    .business-item .box-top {
        margin-bottom: 40px;
    }
    .business-item .box-top2 {
        margin-top: 40px;
    }
    .business-item .box .inn .photo {
        width: 100%;
    }
    .business-item .box .inn .photo img {
        max-width: 100%;
    }
    .business-item .box .inn .photo {
        display: none;
    }
    .business-item .box .inn .photo-sp {
        display: block;
    }
    .business-item .box .inn .txtbox {
        width: auto;
        position: relative;
        top: 0;
        right: 0;
        transform: translateY(0) translateX(0);
        -webkit- transform: translateY(0) translateX(0);
        margin: 0 20px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .left {
        margin-right: 20px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .right .subtit {
        font-size: 14px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .right .tit {
        font-size: 25px;
    }
    .business-item .box .inn .txtbox .txtinn {
        padding: 30px;
        margin-top: -60px;
    }
    .business-item .box .inn .txtbox .txtinn .txt {
        margin-top: 30px;
    }
    .business-item .box .inn .txtbox .txtinn .btn span {
        color: #fff;
        background: #102c54;
        border: 1px solid #fff;
    }
    .business-item .box .inn .txtbox .txtinn .btn span:before,
    .business-item .box .inn .txtbox .txtinn .btn span:after {
        content: none;
    }
    .a-scrolldown:after,
    .a-scrolldown:before {
        width: 45px;
    }
    .business-item .box-bottom {
        padding-right: 0;
    }
    .business-item .box .inn .txtbox .txtinn .btn {
        max-width: none;
    }

/*****************************************************

    リクルート

*****************************************************/
    #recruit {
        padding-left: 20px;
        padding-right: 20px;
        background-image: none;
        z-index: -3;
    }
    #recruit:after {
        content: "";
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100%;
        background: url(../img/top/img_recruit-bg.jpg) center no-repeat;
    }
    .recruit .inn {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }
    .recruit .inn .txt {
        font-size: 14px;
    }
    .recruit .btn a {
    }

/*****************************************************

    トピックス

*****************************************************/
    #topics {
        padding-left: 20px;
        padding-right: 20px;
        background-color: #fff;
    }
    .topics .inn {
        display: block;
    }
    .topics .inn .titbox {
        text-align: center;
    }
    .topics .inn .titbox .line {
        margin-left: auto;
    }
    .topics .inn ul {
        width: auto;
    }
    .topics .inn li {
        display: block;
        padding: 20px;
    }
    .topics .inn li .left {
        width: auto;
    }
    .topics .inn li .left .data {
        font-size: 14px;
    }
    .topics .inn li .right {
        width: auto;
        margin-top: 10px;
    }
    .topics .inn li .right .txt,
    .topics .inn li .right .txt a {
        font-size: 14px;
    }

/*****************************************************

    フッター

*****************************************************/
    footer .ft-menu {
        display: none;
    }
    footer .ft-menu-sp {
        display: block;
    }
    footer .ft-menu-sp a {
        color: #fff;
    }
    footer .ft-logo {
        padding-top: 40px;
        padding-bottom: 40px;
        margin-bottom: 0;
    }
    footer .ft-logo .txt {
        display: none;
    }
    footer .ft-logo .txt-sp {
        display: block;
        font-size: 16px;
        margin-bottom: 20px;
    }
    footer .ft-menu-sp ul {
        padding: 0 20px;
    }
    footer .ft-menu-sp ul li {
        color: #fff;
        border-bottom: 1px solid #3c5374;
    }
    footer .ft-menu-sp ul li.list01 {
        border-top: solid 1px #3c5374;
    }
    footer .ft-menu-sp ul li a {
        height: 40px;
        display: flex;
        align-items: center;
        padding: 10px 20px;
        position: relative;
        font-size: 18px;
        font-family: 'Poppins', sans-serif;
    }
    footer .ft-menu-sp ul li a span:after {
        content: "";
        background-image: url(../img/nav/icon_plus.svg);
        background-repeat: no-repeat;
        background-size: cover;
        width: 18px;
        height: 18px;
        display: block;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%) translateX(0);
        -webkit- transform: translateY(-50%) translateX(0);
    }
    footer .ft-menu-sp ul li a.active span:after {
        background-image: url(../img/nav/icon_minus.svg);
    }
    footer .ft-menu-sp ul li ul {
        display: none;
        padding-bottom: 30px;
    }
    footer .ft-menu-sp ul li ul li {
        border-bottom: none;
    }
    footer .ft-menu-sp ul li ul li a {
        font-size: 14px;
        font-family: 'Noto Sans JP', sans-serif;
        height: 30px;
    }
    footer .ft-menu-sp ul li ul li a i {
        margin-right: 20px;
    }
    .progress-wrap {
        right: 15px;
        bottom: 15px;
    }
}

@media (max-width: 480px) {
    br.sp {
        display: block;
    }
/*****************************************************

    ビジネス

*****************************************************/
    .business-item .box .inn .txtbox .txtinn {
        padding: 20px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .left img {
        width: 50px;
        height: 50px;
    }
    .business-item .box .inn .txtbox .txtinn .titbox .right .tit {
        font-size: 22px;
    }
    .business-item .box .inn .txtbox .txtinn .txt {
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

@media (max-width: 380px) {
/*****************************************************

    ヘッダー

*****************************************************/
    .hd-middle .middle-tit.on .inn .line {
        top: 47%;
    }
    .hd-middle .middle-tit.on .inn .subtit {
        top: 49%;
    }
    .hd-middle .middle-tit.on .inn .txt {
        top: 56%;
    }
}