@charset "UTF-8";

*{
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: yusei;
    src: url(../fs/Yusei_Magic/YuseiMagic-Regular.ttf);
}

body {
    cursor: url(../images/cursor.png),auto;
    background-color: rgb(246, 208, 151);
}

h2 {
    font-size: 2vw;
    font-family: yusei;
    color: #202020;
}

p {
    font-size: 1.4vw;
    color: #202020;
}

html {
    scroll-behavior: smooth;
}

/* ヘッダーここから */
header:nth-of-type(2) {
    display: none;
}

header {
    position: fixed;
    top: 1vw;
    width: 100%;
    z-index: 10;
}

nav {
    display: flex;
    width: 100%;
    margin-left: auto;
    margin-left: auto;
}

nav div {
    width: 18%;
    margin-left: 3%;
    margin-right: 7%;
}

nav div h1 img {
    width: 100%;
    vertical-align: bottom;
}

nav ul {
    display: flex;
    width: 72%;
    margin-left: auto;
    margin-right: auto;
    list-style-type: none;
}

nav ul li {
    width: 22%;
    height: 10vw;
    margin-right: 2%;
}

nav ul li a {
    display: block;
    text-decoration: none;
    text-align: center;
    padding-top: 3vw;
    padding-bottom: 3vw;
    border-radius: 5vw;
    border: 6px solid rgb(215, 136, 33);
    background-color: rgb(243, 175, 80);
    box-shadow: 5px 8px 8px black;
    font-size: 1.6vw;
    font-family: yusei;
    color: #202020;
    transition: 1s;
}

nav ul li a:hover {
    background-color: rgb(169, 97, 3);
    color: #fff;
    text-shadow: 3px 3px 3px black;
    transition: 1s;
}

header nav div h1 a:nth-of-type(2) {
    display: none;
}
/* ヘッダーここまで */

/* 猫ムーブ1ここから */
.move0 {
    width: 100%;
    overflow: hidden;
}

.move1 {
    width: 20vw;
    margin-left: -22vw;
    animation: move 10s linear infinite;
    animation-delay: 5s;
}

.move1 img {
    width: 100%;
}

@keyframes move {
    100% {
        margin-left: 100%;
    }
}
/* 猫ムーブ1ここまで */

/* お問合せメニューここから */
.menu-box {
    width: 100%;
    margin-top: 2vw;
    margin-left: auto;
    margin-right: auto;
}

.menu-box2 {
    position: relative;
    width: 20%;
}

.menu-box .menu-box2 img {
    position: absolute;
    bottom: 1vw;
    left: 38vw;
    width: 100%;
    vertical-align: bottom;
}
/* お問合せメニューここまで */

/* 猫ムーブ2ここから */
.move0-1 {
    width: 100%;
    margin-top: 4vw;
    overflow: hidden;
}

.move2 {
    width: 15vw;
    animation: move 14s linear infinite ;
}

.move2 img {
    width: 100%;
}

@keyframes move {
    0% {
        margin-left: -10%;
    }
    
    100% {
        margin-left: 95%;
    }
}
/* 猫ムーブ2ここまで */

/* フォームの説明ここから */
.application-box {
    width: 72%;
    margin-left: auto;
}
/* フォームの説明ここまで */

/* フォームここから */
.form-box {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.form-box iframe {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.form-box2 {
    display: none;
}
/* フォームここまで */

/* 猫ムーブ4ここから */
.move0-2 {
    width: 100%;
    height: 8vw;
    overflow: hidden;
}

.move3 {
    width: 10vw;
    animation: move4 20s linear infinite ;
    transition: 1s;
}

.move3 img {
    width: 100%;
}

.move4 {
    position: relative;
    left: 1vw;
    bottom: 6vw;
    width: 12vw;
    animation: move5 20s linear infinite ;
    transition: 1s;
}

.move4 img {
    width: 100%;
}

.move5 {
    position: relative;
    left: 2vw;
    bottom: 12vw;
    width: 10vw;
    animation: move6 20s linear infinite ;
    transition: 1s;
}

.move5 img {
    width: 100%;
}

@keyframes move4 {
    0% {
        margin-left: -10%;
    }
    
    100% {
        margin-left: 100%;
    }
}

@keyframes move5 {
    0% {
        margin-left: -8%;
    }
    
    100% {
        margin-left: 100%;
    }
}

@keyframes move6 {
    0% {
        margin-left: -50%;
    }
    
    100% {
        margin-left: 100%;
    }
}
/* 猫ムーブ4ここまで */

/* フッターここから */
footer {
    width: 100%;
    background-color: rgb(0, 61, 0);
}

h3 {
    width: fit-content;
    margin-bottom: .5vw;
    text-decoration: none;
    font-size: 1.9vw;
    font-family: yusei;
    line-height: 2;
    border-bottom: 2px solid yellow;
}

h3 a {
    text-decoration: none;
    color: #fff;
    transition: .5s;
}

h3 a:hover {
    color: rgb(215, 136, 33);
    text-shadow: 5px 5px 5px black;
    transition: .5s;
}

.footerbox0 {
    display: flex;
    width: 80%;
    margin-bottom: 4vw;
    margin-left: auto;
    margin-right: auto;
    padding: 1.5vw;
}

.footerbox0 .footerbox1 {
    margin-left: auto;
    margin-right: 8%;
}

.footerbox0 .footerbox2 {
    margin-right: 8%;
}

.footerbox0 .footerbox3 {
    margin-right: auto;
}

footer .footerbox0 ul {
    list-style-type: none;
}

footer .footerbox0 ul a {
    text-decoration: none;
    line-height: 2.5;
    font-size: 1.3vw;
    color: #fff;
    transition: .5s;
}

footer .footerbox0 ul a:hover {
    color: rgb(215, 136, 33);
    text-shadow: 5px 5px 5px black;
    transition: .5s;
}

footer p {
    padding-bottom: 1vw;
    text-align: center;
    color :#fff;
}

footer .footerbox4 {
    width: 100%;
    margin-bottom: 1vw;
    margin-left: auto;
    margin-right: auto;
}

footer .footerbox4 ul {
    display: flex;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    list-style-type: none;
}

footer .footerbox4 ul li:nth-of-type(1) {
    margin-left: auto;
}

footer .footerbox4 ul li:nth-of-type(4) {
    margin-right: auto;
}

footer .footerbox4 ul li:nth-of-type(1) a {
    display: block;
    padding-left: 1vw;
    padding-right: 1vw;
    text-decoration: none;
    font-size: 1.5vw;
    color :#fff;
    border-right: 2px solid yellow;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(1) a:hover {
    color: rgb(215, 136, 33);
    text-shadow: 5px 5px 5px black;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(2) a {
    display: block;
    padding-left: 1vw;
    padding-right: 1vw;
    text-decoration: none;
    font-size: 1.5vw;
    color :#fff;
    border-right: 2px solid yellow;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(2) a:hover {
    color: rgb(215, 136, 33);
    text-shadow: 5px 5px 5px black;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(3) a {
    display: block;
    padding-left: 1vw;
    padding-right: 1vw;
    text-decoration: none;
    font-size: 1.5vw;
    color :#fff;
    border-right: 2px solid yellow;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(3) a:hover {
    color: rgb(215, 136, 33);
    text-shadow: 5px 5px 5px black;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(4) a {
    display: block;
    padding-left: 1vw;
    padding-right: 1vw;
    text-decoration: none;
    font-size: 1.5vw;
    color :#fff;
    transition: .5s;
}

footer .footerbox4 ul li:nth-of-type(4) a:hover {
    color: rgb(215, 136, 33);
    text-shadow: 5px 5px 5px black;
    transition: .5s;
}

/* フッターここまで */

/* TOPへ戻るボタンここから */
.pagejump {
    width: 7%;
    position: fixed;
    bottom: 2vw;
    right: 1vw;
    transition: 1s;
}

.pagejump:hover {
    width: 10%;
    position: fixed;
    bottom: 1vw;
    right: 1vw;
    transition: 1s;
}

.pagejump img {
    width: 100%;
    vertical-align: bottom;
}
/* TOPへ戻るボタンここまで */