@charset "UTF-8";
@media screen and (max-width: 1024px) {
    /*index*/
    /*
    .index_cnt1 .inner h2 {
        font-size: 3.4rem;
    }
    .index_cnt1 .inner p strong {
        font-size: 3rem;
    }
    .index_cnt2 h2 {
        font-size: 3.4rem;
    }
    */
    .index_cnt2 {
        margin: 0 auto 5rem;
      }
    .index_cnt2 .col2 {
        display: block;
    }
    .index_cnt2 .col2 :is(.left, .right) {
        width: 100%;
    }
    /*
    .index_cnt2 .col2 .right h3 {
        font-size: 3rem;
    }
    .index_cnt3 h3 {
        font-size: 3rem;
    }
    .index_cnt3 .read {
        font-size: 2.4rem;
    }
    */
    .index_cnt3{
        padding: 5rem 0;
    }
    .index_cnt3 .col2 :is(.left, .right) {
        width: 100%;
    }
    .index_cnt3 .col2 .right h4 {
        /*font-size: 2.4rem;*/
        white-space: initial;
    }

    .index_cnt4{
        padding: 5rem 0;
        margin: 0 auto;
    }
    .index_cnt4 h3 {
        font-size: 3rem;
    }
    .index_cnt4 .read {
        font-size: 2.4rem;
    }
    .index_cnt4 .col2 {
        display: block;
    }
    .index_cnt4 .col2 :is(.left, .right) {
        width: 100%;
        padding: 0;
    }
    .index_cnt4 .col2 .left{
        margin: 0 auto 3rem;
    }
    .index_cnt5{
        padding: 5rem 0;
    }
    .index_cnt5 .movie {
        width: 90%;
    }
    .index_cnt6{
        padding: 5rem 0;
    }
    .index_cnt6 .title{
        margin: 0 auto 5rem;
    }
    .index_cnt6 .col2 {
        display: block;
    }
    .index_cnt6 .col2 :is(.left, .right) {
        width: 100%;
    }
    .index_cnt6 .col2 .left img {
        position: initial;
    }
    .index_cnt6 .col2 .right p:not(.buttonA){
        font-size: initial;
    }
    .index_cnt6 .col2 .right .buttonA {
        transform: initial;
        float: initial;
        margin: auto;
    }
    .index_cnt7 .col2 {
        display: block;
    }
    .index_cnt7 .col2 :is(.left, .right) {
        width: 100%;
    }
    .index_cnt7 .col2 .right textarea {
        height: 30rem;
    }

    /*profile*/
    .profile_cnt1{
        padding: 5rem 0;
    }
    .profile_cnt1 .inner .title{
        margin: 0 auto 5rem;
    }
    .profile_cnt2{
        padding: 5rem 0;
    }
    .profile_cnt2 .pic {
        width: 80%;
        position: initial;
        margin: 0 auto 3rem;
    }
    .profile_cnt2 p {
        width: 100%;
    }
    .profile_cnt2 .sign {
        margin: 0 0 0 auto;
    }
    .profile_cnt3{
        padding: 5rem 0;
    }
    .profile_cnt3 .inner .grid {
        display: block;
    }
    .profile_cnt3 .inner .grid figure {
        margin: 0 auto 3rem;
    }






    /*history*/
    .history_cnt1 .inner .title{
        margin: 0 auto 5rem;
    }
    [class^="history_cnt"]:not(.history_cnt1){
        padding: 5rem 0;
    }
    [class^=history_cnt]:not(.history_cnt1) .inner h3 {
        writing-mode: initial;
        transform: initial;
        position: initial;
        margin: 0 0 3rem;
    }
    [class^=history_cnt]:not(.history_cnt1) .inner h3 span {
        position: initial;
        transform: initial;
        font-size: 3rem;
    }

    [class^=history_cnt]:not(.history_cnt1) .inner h3::after {
        width: 10rem;
        height: 0.1rem;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history)>.hist {
        margin: 0 0 3rem;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history) {
        width: 100%;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history)>.hist dl {
        display: block;
        margin: 0 0 3rem;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history)>.hist dt {
        font-weight: bold;
        width: 100%;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history)>.hist dd {
        width: 100%;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner .slide_hist {
        width: 100%;
        position: initial;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history)>.hist dd li {
        white-space: initial;
    }
    [class^="history_cnt"]:not(.history_cnt1):nth-of-type(even) .inner dl:not(.history) {
        width: 100%;
    }
}




@media screen and (max-width: 750px) {
    .index_cnt1 .inner p strong{
        font-size: 2.4rem;
    }
    .index_cnt1 .inner .read br{
        display: none;
    }
    .index_cnt2 h2{
        margin: 0 auto 5rem;
    }
    .index_cnt2 .col2 .right h3 br{
        display: none;
    }
    .index_cnt2 .col2 .right .button {
        display: block;
    }
    .index_cnt2 .col2 .right .button .buttonA{
        display: block !important;
        margin: 0 auto 3rem;
    }
    .index .slide2 {
        height: 24vw;/*9rem*/
    }
    .index .slide3 {
        height: 36vw;/*13.5rem*/}
        .index_cnt3 .col2 {
            display: block;
        }
    .index_cnt3 .read{
        font-size: 2rem;
        margin: 0 0 5rem;
    }
    .index_cnt3 .col2 .right h4 br{
        display: none;
    }
    .index_cnt3 .col2 .right .button{
        display: block;
    }
    .index_cnt3 .col2 .right .button .buttonA{
        display: block !important;
        margin: 0 auto 3rem;
    }
    .index_cnt4 .read{
        font-size: 2rem;
        margin: 0 0 5rem;
    }
    .index_cnt4 .col2 .right .button{
        display: block;
    }
    .index_cnt4 .col2 .right .button .buttonA{
        display: block !important;
        margin: 0 auto 3rem;
    }






    /*portfolio*/
    .profile_cnt1 .inner .pic{
        width: 100%;
    }
    .profile_cnt1 .inner .nameplate{
        font-size: 1.6rem;
        right:0;
        width:19.75rem ;
        height: 5.4rem;
    }





    /*history*/
    .history_cnt1 .inner .read{
        font-size: 2.4rem;
    }
    [class^="history_cnt"]:not(.history_cnt1) .inner dl:not(.history) > dt{
        font-size: 3rem;
    }




    
}