@charset "utf-8";
/* CSS Document */

@media screen and (min-width: 768px) {
    /* メディアクエリー */

    * {
        margin: 0;
        padding: 0;

        box-sizing: border-box;
    }

    body {
        font: 15px/2.4 'Montserrat', 'Noto Sans JP', "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", "meiryo", "ＭＳ Ｐゴシック", sans-serif;
        background: #000;
        color: #fff;
    }


    header,
    article,
    footer,
    aside,
    time,
    nav,
    small,
    section {
        display: block;
    }

    p,
    ul,
    table,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin-bottom: 1.2em;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        line-height: 1.7;
    }

    ul li,
    ol li {
        list-style-type: none;
    }

    a img {
        border-style: none;
    }

    a {
        color: #4d4d4d;
        text-decoration: none;

        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

    a:hover {
        text-decoration: none;
    }

    img {
        vertical-align: bottom;
        max-width: 100%;
        height: auto;
    }

    table {
        width: 100%;
    }

    table th,
    table td {
        vertical-align: top;
    }



    a[href^="tel:"] {
        pointer-events: none;
        /*リンクを非リンクに変える*/
        cursor: default;
        /*マウスカーソルを矢印のまま変えない*/
    }




    /*----------------------------------------------------------------


	clearfix


----------------------------------------------------------------*/








    /*----------------------------------------------------------------


	Selected Text


----------------------------------------------------------------*/

    ::selection {
        background: #4d4d4d;
        /* Safari */
        color: #fff;
    }

    ::-moz-selection {
        background: #4d4d4d;
        /* Firefox */
        color: #fff;
    }





    /*----------------------------------------------------------------


	PC非表示


----------------------------------------------------------------*/

    .PCDN {
        display: none;
    }




    /*----------------------------------------------------------------


	ローディング


----------------------------------------------------------------*/


    .start {
        background: #000;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 9000;
    }

    .start svg {
        position: fixed;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        display: none;
        z-index: 9999;
        width: 400px;
    }

    /*----------------------------------------------------------------


	レイアウト


----------------------------------------------------------------*/

    #contents {}




    /*----------------------------------------------------------------


	ヘッダー


----------------------------------------------------------------*/

    #globalHeader {
        position: absolute;
        width: 100%;
        z-index: 3;
    }

    #globalHeader > .inner {
        padding: 40px 5% 0;
    }

    #globalHeader .logo {
        width: 300px;
    }

    #globalHeader .logo a img:hover {}



    /*----------------------------------------------------------------


	キービジュアル


----------------------------------------------------------------*/

    #kv {
        background-image: url(../images/kv/bg-kv.png);
        background-repeat: repeat-x;
        animation-name: scroll-header-bg;
        animation-duration: 50s;
        /*3秒で画像1枚分スクロールする*/
        animation-timing-function: linear;
        /*再生速度を一定にする*/
        animation-iteration-count: infinite;
        position: relative;
        height: 100vh;
        width: 100%;
        display: none;
    }

    @keyframes scroll-header-bg {
        0% {
            background-position: 0 center;
            /*初期値を設定する*/
        }

        100% {
            background-position: -3800px center;
            /*画像サイズに合わせて変更する（負号で左スクロール）*/
        }
    }

    #kv ul {
        padding-top: 30vh;
    }

    #kv ul li {
        font-size: 90px;
        font-weight: 800;
        text-align: center;
        line-height: 1.2;
    }

    #kv ul li.catch1 {
        letter-spacing: 0.08em
    }

    #kv ul li.catch3 {
        letter-spacing: 0.14em
    }

    .letterDrop {
        position: relative;
        top: -4.5em;
        display: inline-block;
        opacity: 0.8;
        transform: rotateX(-90deg);
        animation: letterDrop 2.0s ease 1 normal forwards;
    }

    @keyframes letterDrop {
        10% {
            opacity: 0.5;
        }

        20% {
            opacity: 0.8;
            top: -0.75em;
            transform: rotateX(-360deg);
        }

        100% {
            opacity: 1;
            top: 0em;
            transform: rotateX(360deg);
        }
    }

    .letterDrop2 {
        position: relative;
        left: -4.5em;
        display: inline-block;
        opacity: 0.8;
        transform: rotateY(-90deg);
        animation: letterDrop2 2.0s ease 1 normal forwards;
    }

    @keyframes letterDrop2 {
        10% {
            opacity: 0.5;
        }

        20% {
            opacity: 0.8;
            left: -0.75em;
            transform: rotateY(-360deg);
        }

        100% {
            opacity: 1;
            left: 0em;
            transform: rotateY(360deg);
        }
    }

    .letterDrop3 {
        position: relative;
        right: -4.5em;
        display: inline-block;
        opacity: 0.8;
        transform: rotateY(90deg);
        animation: letterDrop3 2.0s ease 4s 1 normal forwards;
    }

    @keyframes letterDrop3 {
        10% {
            opacity: 0.5;
        }

        20% {
            opacity: 0.8;
            right: -0.75em;
            transform: rotateY(360deg);
        }

        100% {
            opacity: 1;
            right: 0em;
            transform: rotateY(-360deg);
        }
    }







    .p-index-kv__scroll {
        width: 1px;
        height: 54px;
        position: absolute;
        bottom: 25px;
        left: 50%;
        z-index: 1;
        background-color: #ababab;
        display: none;
    }

    .p-index-kv__scroll-pointer {
        width: 9px;
        height: 9px;
        position: absolute;
        top: -4px;
        left: -4px;
        border-radius: 50%;
        background-color: #ababab;
    }

    .p-index-kv__scroll .scroll {
        position: absolute;
        top: -37px;
        left: -25px;
        font-size: 13px;
        font-weight: 800;
    }

    .p-index-kv__scroll-pointer:before {
        content: '';
        display: block;
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background-color: #ababab;
    }

    .p-index-kv__scroll-pointer {
        -webkit-animation-name: moveScrollPointer;
        animation-name: moveScrollPointer;
        -webkit-animation-duration: 1.2s;
        animation-duration: 1.2s;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    .p-index-kv__scroll-pointer:before {
        -webkit-animation-name: moveScrollPointerIn;
        animation-name: moveScrollPointerIn;
        -webkit-animation-duration: 1.2s;
        animation-duration: 1.2s;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    @-webkit-keyframes moveScrollPointer {
        0% {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
        }

        100% {
            -webkit-transform: translate3d(0, 54px, 0);
            transform: translate3d(0, 54px, 0)
        }
    }

    @keyframes moveScrollPointer {
        0% {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
        }

        100% {
            -webkit-transform: translate3d(0, 54px, 0);
            transform: translate3d(0, 54px, 0)
        }
    }

    @-webkit-keyframes moveScrollPointerIn {
        0% {
            -webkit-transform: scale(0);
            transform: scale(0)
        }

        10% {
            -webkit-transform: scale(1);
            transform: scale(1)
        }

        65% {
            -webkit-transform: scale(1);
            transform: scale(1)
        }

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

    @keyframes moveScrollPointerIn {
        0% {
            -webkit-transform: scale(0);
            transform: scale(0)
        }

        10% {
            -webkit-transform: scale(1);
            transform: scale(1)
        }

        65% {
            -webkit-transform: scale(1);
            transform: scale(1)
        }

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



    /*----------------------------------------------------------------


	グローバルナビ


----------------------------------------------------------------*/

    #globalNav {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0px;
        right: 0;
        z-index: 21;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        background: rgba(0, 0, 0, 0.9);
        line-height: 1.3;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        -webkit-transition: -webkit-transform cubic-bezier(0.8, 0, 0.1, 1) 0.9s 0.2s;
        transition: transform cubic-bezier(0.8, 0, 0.1, 1) 0.9s 0.2s;
    }

    .menu-open #globalNav {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
    }

    #globalNav .inner {
        max-width: 1200px;
        margin: 150px auto 0;
        opacity: 0;
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0);
        -webkit-transition: opacity ease 0.6s 0s, -webkit-transform ease 0.6s 0s;
        transition: opacity ease 0.6s 0s, transform ease 0.6s 0s;
    }

    .menu-open #globalNav .inner {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition-delay: 0.7s;
        transition-delay: 0.7s;
    }

    #globalNav .inner:after {
        content: "";
        display: block;
        clear: both;
    }


    #globalNav a {
        color: #fff;
        transition: 0.3s;
    }



    #globalNav .inner ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    #globalNav .inner ul li {
        margin: 0 0 30px 0;
    }



    #globalNav .inner figure {
        position: relative;
        transition: 0.3s;
        overflow: hidden;
    }

    #globalNav .inner a figure img {
        transition: 0.3s;
    }

    #globalNav .inner a:hover figure img {
        transform: scale(1.3, 1.3);
    }



    #globalNav .inner figure:after {
        position: absolute;
        width: 100%;
        height: 100%;
        display: inline-block;
        content: '';
        background-color: rgba(0, 0, 0, .4);
        top: 0;
        left: 0;
    }

    #globalNav .inner ul li a:hover figure:after {
        opacity: 0;
        transition: 0.3s;
    }

    #globalNav .inner .title-en {
        position: absolute;
        top: 45%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        z-index: 5;
        font-size: 40px;
        font-weight: bold;
    }

    #globalNav .inner ul li a:hover .title-en {
        text-shadow: 4px 4px 4px #000;
        transition: 0.3s;
    }



    #globalNav .inner .title-jp {
        position: absolute;
        top: 65%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        z-index: 5;
        font-size: 20px;

    }

    #globalNav .inner .ham-center {
        display: block;
        margin: 0 auto 60px;
        width: 30%;
    }



    #globalNav .inner ul li p {
        font-size: 30px;
        line-height: 1;
        margin: 0;
    }

    #globalNav .inner ul li p .midashi {
        font-size: 15px;
    }

    #globalNav .inner ul li a {
        font-size: 24px;

    }


    /**
 * Burger
 */

    #burger {
        width: 100px;
        height: 100px;
        margin: 0 auto;
        display: block;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 23;
        background: #000;
        border: none;
        outline: none;
    }


    #burger p {
        max-width: 50px;
        height: 50px;
        margin: auto;
        position: relative;
        cursor: pointer;
    }

    #burger span {
        height: 1px;
        display: block;
        position: absolute;
        left: 10px;
        right: 10px;
        background: #a9a9a9;
        -webkit-transition: -webkit-transform ease 0.2s;
        transition: transform ease 0.2s;
    }

    #burger span:nth-child(1) {
        top: 30%;
    }

    #burger span:nth-child(2) {
        top: 50%;
    }

    #burger span:nth-child(3) {
        top: 70%;
    }

    .menu-open #burger span:nth-child(1),
    #burger:hover span:nth-child(1) {
        -webkit-transform: translate3d(3px, 0, 0);
        transform: translate3d(3px, 0, 0);
    }

    .menu-open #burger span:nth-child(2),
    #burger:hover span:nth-child(2) {
        -webkit-transform: translate3d(-3px, 0, 0);
        transform: translate3d(-3px, 0, 0);
    }

    .menu-open #burger span:nth-child(3),
    #burger:hover span:nth-child(3) {
        -webkit-transform: translate3d(3px, 0, 0);
        transform: translate3d(3px, 0, 0);
    }



    /*----------------------------------------------------------------


	ぱんくず


----------------------------------------------------------------*/

    .breadcrumbs {
        padding: 10px 20px;
        background: #f5f5f5;
        margin-bottom: 40px;
        font-size: 14px;
    }



    /*----------------------------------------------------------------


	ページタイトル


----------------------------------------------------------------*/

    #pageTitle {
        background: url(https://usudaseiko.com/wp/wp-content/themes/usuda/images/title/bg-title.jpg) no-repeat center center;
        text-align: center;
        margin-bottom: 20px;
        margin-bottom: 100px;
    }

    #pageTitle h2 {
        padding: 180px 0 120px;
    }

    #pageTitle h2 span {}

    #pageTitle h2 span.EN {
        display: block;
        font-size: 70px;
        font-family: "Akrobat-Bold";
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }

    #pageTitle h2 span.JP {
        display: block;
        font-size: 20px;
    }



    /*----------------------------------------------------------------


	フッター


----------------------------------------------------------------*/






    #globalFooter {
        padding: 60px 0 40px;
        font-size: 14px;
        position: relative;
        position: relative;
        line-height: 1.5;
    }

    #globalFooter > .inner {
        padding: 40px 5% 0;
        display: flex;
        justify-content: space-between;
        border-top: 1px solid #2c2e2f;
        align-items: flex-end;
    }

    #globalFooter .info {
        margin-right: 60px;
    }

    #globalFooter .logo {
        width: 300px;
        margin-bottom: 25px;
    }

    #globalFooter .info p {
        margin: 0;
    }

    #globalFooter a {}

    #globalFooter .privacy {
        font-weight: bold;
        margin: 0 30px 0 0;
        padding-top: 3px;
    }

    #globalFooter .privacy a:hover,
    #pagetop a:hover {
        color: #777;
    }

    #pagetop {
        font-size: 40px;
        line-height: 0;
        position: absolute;
        left: 50%;
        top: 50%;
    }
    
    #globalFooter .right{
        flex-grow: 10;
    }
    #globalFooter .fanuc-badge{
        margin-bottom:15px;
        text-align: right;
    }

    #COPYRIGHT {
        margin: 0;
        padding: 0;
        letter-spacing: 0.1em;
        text-align: right;
    }

    #COPYRIGHT small {
        font-size: 12px;
    }

    .error-p {
        text-align: center;
    }



}

/* メディアクエリー閉じタグ */y