a, span {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

menu {
    margin: 0;
    padding: 0;
}

.grad-trigger {
    display: none;
}

@media screen and (max-width: 768px) {
    body.fadeout #contents {
        -webkit-transform: translateY(25px);
        transform: translateY(25px);
    }
    
    menu,
    menu.open {
        display: block;
    }

    nav.fixednav,
    #globalnavi {
        display: none;
    }

    .gtt {
        top: 16px;
        right: 15px;
        width: 29px;
        height: 29px;
        z-index: 10001;
    }

    .gtt a {
        padding: 0;
    }

    menu nav.menu {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: rgba(255, 255, 255, 0.95);
        z-index: 10000;
        padding-top: 60px;
        overflow: auto;
        transition: transform .3s ease-out;
    }
    
    /*開閉ボタン*/
    #nav_toggle {
        display: block;
        width: 29px;
        height: 29px;
        position: fixed;
        top: 17px;
        left: 15px;
        z-index: 10001;
        mix-blend-mode: multiply;
    }

    #nav_toggle div {
        position: relative;
    }

    #nav_toggle span {
        display: block;
        height: 2px;
        background: #000;
        position: absolute;
        width: 100%;
        left: 0;
        border-radius: 2px;
        -webkit-transition: 0.3s ease-out;
        -moz-transition: 0.3s ease-out;
        transition: 0.3s ease-out;
    }

    #nav_toggle span:nth-child(1) {
        top: 6px;
    }

    #nav_toggle span:nth-child(2) {
        top: 13px;
    }

    #nav_toggle span:nth-child(3) {
        top: 20px;
    }

    /*開閉ボタンopen時*/

    #nav_toggle span:nth-of-type(1) {
        -webkit-animation: menu-bar01 .75s forwards;
        animation: menu-bar01 .75s forwards;
    }

    @-webkit-keyframes menu-bar01 {
        0% {
            -webkit-transform: translateY(7px) rotate(45deg);
        }

        50% {
            -webkit-transform: translateY(7px) rotate(0);
        }

        100% {
            -webkit-transform: translateY(0) rotate(0);
        }
    }

    @keyframes menu-bar01 {
        0% {
            transform: translateY(7px) rotate(45deg);
        }

        50% {
            transform: translateY(7px) rotate(0);
        }

        100% {
            transform: translateY(0) rotate(0);
        }
    }

    #nav_toggle span:nth-of-type(2) {
        transition: all .25s .25s;
    }

    #nav_toggle span:nth-of-type(3) {
        -webkit-animation: menu-bar02 .75s forwards;
        animation: menu-bar02 .75s forwards;
    }

    @-webkit-keyframes menu-bar02 {
        0% {
            -webkit-transform: translateY(-7px) rotate(-45deg);
        }

        50% {
            -webkit-transform: translateY(-7px) rotate(0);
        }

        100% {
            -webkit-transform: translateY(0) rotate(0);
        }
    }

    @keyframes menu-bar02 {
        0% {
            transform: translateY(-7px) rotate(-45deg);
        }

        50% {
            transform: translateY(-7px) rotate(0);
        }

        100% {
            transform: translateY(0) rotate(0);
        }
    }

    .open #nav_toggle span:nth-of-type(1) {
        -webkit-animation: active-menu-bar01 .75s forwards;
        animation: active-menu-bar01 .75s forwards;
    }

    @-webkit-keyframes active-menu-bar01 {
        0% {
            -webkit-transform: translateY(0) rotate(0);
        }

        50% {
            -webkit-transform: translateY(7px) rotate(0);
        }

        100% {
            -webkit-transform: translateY(7px) rotate(45deg);
        }
    }

    @keyframes active-menu-bar01 {
        0% {
            transform: translateY(0) rotate(0);
        }

        50% {
            transform: translateY(7px) rotate(0);
        }

        100% {
            transform: translateY(7px) rotate(45deg);
        }
    }

    .open #nav_toggle span:nth-of-type(2) {
        width: 0;
        left: 50%;
    }

    .open #nav_toggle span:nth-of-type(3) {
        -webkit-animation: active-menu-bar03 .75s forwards;
        animation: active-menu-bar03 .75s forwards;
    }

    @-webkit-keyframes active-menu-bar03 {
        0% {
            -webkit-transform: translateY(0) rotate(0);
        }

        50% {
            -webkit-transform: translateY(-7px) rotate(0);
        }

        100% {
            -webkit-transform: translateY(-7px) rotate(-45deg);
        }
    }

    @keyframes active-menu-bar03 {
        0% {
            transform: translateY(0) rotate(0);
        }

        50% {
            transform: translateY(-7px) rotate(0);
        }

        100% {
            transform: translateY(-7px) rotate(-45deg);
        }
    }

    .open #nav_toggle {
        position: fixed;
    }

    #globalnavi_inner2,
    #contacts {
        display: block;
    }

    #toppage,
    #newspage,
    #aboutpage,
    #flowpage,
    #workspage,
    #formpage {
        padding-top: 66px;
    }

    header {
        padding: 7.5px 0;
        position: fixed;
        top: 0;
        left: 0;
        background-color: #fff;
    }


    header h1 {
        width: 128px;
        height: 45px;
    }

    header .tel,
    header .icons {
        display: none;
    }

    #globalnavi_hmbg ul,
    #globalnavi_inner2 ul,
    #contacts ul {
        display: block;
        text-align: center;
        font-weight: bold;
    }

    #contacts ul {
        display: flex;
    }

    #globalnavi_hmbg ul li,
    #globalnavi_inner2 ul li {
        display: block;
        width: 100%;
    }
    
    #globalnavi_inner2 ul li {
        display: flex;
        justify-content: space-around;
        font-size: 32px;
    }

    #globalnavi_hmbg ul li a,
    #globalnavi_inner2 ul li a,
    #contacts ul li a {
        -webkit-transition: opacity .3s ease;
        transition: opacity .3s ease;
        border: none;
        padding: 22.5px 0;
        display: block;
    }

    #contacts ul li {
        width: 50%;
    }

    #globalnavi_hmbg {
        padding-bottom: 22.5px;
        margin: 0 15px;
    }

    #contacts {
        width: 80%;
        margin: 0 auto;
        padding: 22.5px 0;
        border-top: 1px solid #000;
        border-bottom: 1px solid #000;
    }

    #globalnavi_inner2 {
        padding: 22.5px 0;
        margin: 0 15px;
    }

    #contacts,
    #globalnavi_inner2 {
        line-height: 100%;
    }

    #toppage .topimg {
        background-size: 150%;
        padding-top: 60%;
    }

    #toppage .intro dt {
        font-size: 1.7rem;
    }

    #toppage .intro dt,
    #toppage .intro dd {
        width: 80%;
    }

    #toppage .topworks_wrapper {
        flex-flow: row wrap;
    }

    #toppage .topworks .jyushou {
        width: 100%;
        margin-bottom: 15px;
    }

    #toppage .information dl {
        width: 94%;
        letter-spacing: 1px;
    }

    #toppage .information dt,
    #toppage .information dd {
        font-size: 1.4rem;
    }

    #toppage .information dt {
        width: 30%;
    }

    #toppage .information dd {
        width: 70%;
    }

    #footer {
        letter-spacing: 1px;
    }

    /*news*/

    #newspage #newsinner #newsinner_main {
        width: 94%;
        padding: 0;
    }

    #newspage #newsinner .newsbox {
        margin-bottom: 30px;
    }

    #newspage #newsinner h3 {
        font-size: 1.8rem;
        width: 100%;
        height: auto;
        line-height: 2;
        margin: 0;
    }

    #newspage #newsinner h3 p {
        display: block;
        float: none;
    }

    #newspage #newsinner h3 p.date {
        float: none;
    }

    #newspage #newsinner #newsinner_side {
        width: 100%;
    }

    #newspage #newsinner #newsinner_side dl dd ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    #newspage #newsinner #newsinner_side dl dd ul li {
        margin: 0.25em 0;
        width: 100%;
    }

    /*about*/

    #aboutpage .table_about dt,
    #aboutpage .table_about dd {
        width: 100%;
        font-size: 1.4rem;
    }

    #aboutpage .table_about dt {
        padding: 22.5px 7.5px 0;
        border: none;
    }

    #aboutpage .table_about dd {
        text-align: center;
        padding: 15px 0;
    }
    
    #aboutpage #access p.address {
        font-size: 1.3rem;    
    }
    
    #aboutpage #privacypolicy {
        font-size: 1.2rem;
    }

    /*flow*/

    #flowpage #flow ol li {
        width: 100%;
    }

    #flowpage #flow ol span {
        width: 16px;
        height: 23px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    #flowpage #flow ol span:nth-of-type(3) {
        display: block;
    }

    /*yosakoi end*/
    /*form*/

    .otoiawase h2,
    .seisaku h2 {
        font-size: 125%;
    }

    #forminner fieldset {
        width: 94%;
        max-width: 400px;
    }

    .kakuningamen {
        width: 94%;
        max-width: 600px;
    }

    .kakuningamen > dt,
    .kakuningamen > dd {
        width: 100%;
    }

    .kakuningamen > dt {
        text-align: left;
        padding: 1rem 1rem 0 1rem;
        border: none;
    }

    .kakuningamen > dd {
        font-size: 1.8rem;
        min-height: 4.8rem;
        text-align: center;
    }

    /*form end*/

    /*works*/

    #workspage .pickup p.ichiran {
        font-size: 1.4rem;
    }

    #workspage .pickup p.ichiran a {
        margin: 0 !important;
        padding: 0;
    }

    #workspage .pickuplist,
    #workspage .past {
        width: 90%;
    }

    #workspage .pickuplist dl,
    #workspage .past dl {
        width: 100%;
    }

    #workspage .pickuplist dl dt,
    #workspage .past dl dt {
        width: 70%;
        margin: 0 auto;
    }

    #workspage .pickuplist dl dt .photo p,
    #workspage .past dl dt .photo p {
        width: 100%;
        height: 100%;
    }

    #workspage .pickuplist dl dd p,
    #workspage .pickuplist dl dd p span,
    #workspage .past dl dd p {
        white-space: normal;
    }
    
    #workspage .pickuplist dl dd p.title {
        height: auto;
        line-height: 0;
    }
    
    #workspage .pickuplist dl dd p span {
        line-height: 26px;
    }
    
    #workspage .pickuplist dl dd p.title span::after {
        display: none;
    }
    
    #workspage .pickuplist dl dt:hover + dd p.title span {
        text-decoration: underline;
    }

    #workspage h3 {
        font-size: 2rem;
    }

    #workspage .teamprofile {
        padding: 30px 0;
    }

    #workspage .teamprofile dl {
        width: 94%;
    }

    #workspage .teamprofile dl dt,
    #workspage .teamprofile dl dd {
        width: 100%;
        font-size: 1.4rem;
    }

    #workspage .teamprofile dl dt {
        padding: 22.5px 7.5px 0;
        border: none;
    }

    #workspage .teamprofile dl dd {
        padding: 22.5px 0;
        text-align: center;
    }

    #workspage .table_jisseki {
        width: 100%;
        white-space: nowrap;
        margin: 0 auto;
        border-left: 15px #fff solid;
        border-right: 15px #fff solid;
    }

    #workspage .table_jisseki th {
        text-align: center;
    }

    #workspage .table_jisseki td .jissekilist {
        white-space: normal;
        width: 160px;
    }

    .scroll {
        overflow: auto;
        white-space: nowrap;
    }

    /*work end*/

    /*p.menu {
        display: none;
    }

    .slick-wrapper img {
        max-width: 100%;
        height: auto;
    }*/

    .otoiawase a.tel[href*="tel:"] {
        pointer-events: auto;
        cursor: default;
        color: #f15a24;
        font-weight: bold;
        border-bottom: 2px dashed #fff;
    }

    #toppage .jyushou.delighter:nth-of-type(2) {
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
    }

    #toppage .jyushou.delighter:nth-of-type(3) {
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
    }

    .grad-wrap {
        position: relative;
    }

    .grad-wrap + .grad-wrap {
        margin-top: 40px;
    }

    .grad-trigger {
        display: block;
        z-index: 2;
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        margin: auto;
        text-align: center;
        cursor: pointer;
        transition: .3s ease-out;
    }

    .grad-item {
        position: relative;
        overflow: hidden;
    }

    .grad-item.is-hide {
        height: 180px;
        /*隠した後の高さ*/
    }

    .grad-item::before {
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        content: "";
        width: 100%;
        height: 30px;/*グラデーションで隠す高さ*/
        background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 50%, #fff 100%);
        background: linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 50%, #fff 100%);
    }

    .grad-trigger.is-show + .grad-item::before {
        display: none;
    }

}

@media screen and (max-width: 767px) {
    
    #flowpage #flow {
        overflow: hidden;
    }
    
    #flowpage #flow ol li:nth-of-type(1n) {
        -webkit-animation: none;
        animation: none;
    }
    
    #flowpage #flow ol li:first-of-type {
        -webkit-transition-delay: 2s;
        transition-delay: 2s;
    }
    
    #flowpage #flow li.delighter {
        -webkit-transform: translateX(50px);
        transform: translateX(50px);
        -webkit-transition: all 0.5s ease-out;
        transition: all 0.5s ease-out;
    }

    #flowpage #flow li.delighter.started {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
    
    .fixedlink {
        right: 15px;
        bottom: 22.5px;
    }
    
}

@media screen and (max-width: 320px) {

    #toppage .information dt,
    #toppage .information dd {
        font-size: 1.3rem;
    }

    #aboutpage .table_about dd {
        font-size: 1.5rem;
    }

    #workspage .pickup p.ichiran {
        font-size: 1.2rem;
    }

    #workspage .teamprofile dl dt,
    #workspage .teamprofile dl dd {
        font-size: 1.2rem;
    }
    
    #formpage .otoiawase h2, .seisaku h2 {
        letter-spacing: 3px;
    }

    .isho label.radiolabel {
        font-size: 1rem;
    }

    #footer {
        font-size: 1.2rem;
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {

    nav.fixednav ul li.tel,
    nav.fixednav ul li.sns {
        display: none;
    }

    #toppage .topimg {
        background-size: 100%;
        padding-top: 41.11%;
    }

    #toppage .intro dt {
        width: 480px;
        font-size: 2rem;
    }

    #toppage .intro dd {
        width: 660px;
    }

    #toppage .information dl {
        width: 520px;
        letter-spacing: 2px;
    }

    #toppage .information dt,
    #toppage .information dd {
        font-size: 1.5rem;
    }

    #toppage .information dt {
        width: 25%;
    }

    #toppage .information dd {
        width: 75%;
    }

    /*flow*/

    #flowpage #flow ol li {
        width: 47.5%;
    }

    #flowpage #flow ol span:nth-of-type(2),
    #flowpage #flow ol span:nth-of-type(4) {
        display: none;
    }

    #flowpage #flow ol span:nth-of-type(3) {
        display: block;
    }

    #flowpage #flow ol span {
        width: 5%;
        height: auto;
        -webkit-transform: none;
        transform: none;
    }

    /*works*/

    #workspage .pickup p.ichiran {
        font-size: 1.5rem;
    }

    #workspage .teamprofile dl dt,
    #workspage .teamprofile dl dd {
        font-size: 1.8rem;
    }

    #workspage .pickuplist dl,
    #workspage .past dl {
        width: 45%;
        max-width: 45%;
    }

    #workspage .pickuplist dl:nth-of-type(odd),
    #workspage .past dl:nth-of-type(odd) {
        margin-left: 5%;
    }

    #workspage .pickuplist dl:nth-of-type(even),
    #workspage .past dl:nth-of-type(even) {
        margin-right: 5%;
    }

    #workspage .past {
        justify-content: flex-start;
    }

    #workspage .past dl dt {
        width: 90%;
    }

    #workspage .pickuplist dl.delighter:nth-of-type(3n-1),
    #workspage .past dl.delighter:nth-of-type(3n-1) {
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
    }

    #workspage .pickuplist dl.delighter:nth-of-type(3n),
    #workspage .past dl.delighter:nth-of-type(3n) {
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
    }

    #workspage .pickuplist dl.delighter:nth-of-type(2n),
    #workspage .past dl.delighter:nth-of-type(2n) {
        -webkit-transition-delay: 0.3s;
        transition-delay: 0.3s;
    }
}