@charset "UTF-8";
/*
Author: Another Path Inc.
Description: This is our original theme.
Version: 1.0
*/
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&family=Zen+Old+Mincho:wght@400;500;600;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap");
body {
  color: #1e1e1e;
  font-size: 16px;
  font-family: YakuHanJP, "Lato", "Noto Sans JP", serif;
  font-weight: 100;
  letter-spacing: 0.05em;
}
@media (max-width: 767px) {
  body {
    font-size: 14px;
  }
}

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

a {
  text-decoration: none;
  transition: 0.3s ease-in-out;
  color: #1e1e1e;
}

p {
  line-height: 1.6;
}

.content {
  padding-top: 84px;
}
@media (max-width: 767px) {
  .content {
    padding-top: 66px;
  }
}

.inner {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .inner {
    margin: 0;
    padding: 0 15px;
  }
}
@media (max-width: 767px) {
  .inner {
    margin: 0;
    padding: 0 15px;
  }
}

.halfInner {
  max-width: 640px;
  width: 100%;
  margin: 0 auto;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .halfInner {
    margin: 0;
    padding: 0 15px;
  }
}
@media (max-width: 767px) {
  .halfInner {
    margin: 0;
    padding: 0 15px;
  }
}

.section {
  padding: 60px 0;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .section {
    padding: 40px 0;
  }
}
@media (max-width: 767px) {
  .section {
    padding: 30px 0;
  }
}

.title {
  margin-bottom: 60px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .title {
    margin-bottom: 40px;
  }
}
@media (max-width: 767px) {
  .title {
    margin-bottom: 30px;
    text-align: center;
  }
}
.title h2 {
  color: #A90025;
  font-size: 4.6rem;
  letter-spacing: 0.05em;
  font-weight: 700;
  padding-bottom: 12px;
  transform: skewX(-10deg);
}
@media (min-width: 768px) and (max-width: 1279px) {
  .title h2 {
    font-size: 3.6rem;
    padding-bottom: 10px;
  }
}
@media (max-width: 767px) {
  .title h2 {
    font-size: 2.6rem;
    padding-bottom: 8px;
  }
}
.title p {
  letter-spacing: 0.2em;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .title p {
    font-size: 14px;
  }
}
@media (max-width: 767px) {
  .title p {
    font-size: 12px;
  }
}

.button a {
  color: #A90025;
  font-weight: 300;
  background: #fff;
  border: 2px solid #A90025;
  padding: 12px 45px;
  border-radius: 5px;
}
@media (max-width: 767px) {
  .button a {
    padding: 6px 22.5px;
    font-size: 14px;
  }
}
.button a:hover {
  color: #fff;
  background: #A90025;
}

.navItems {
  display: flex;
}

.navItem:not(:first-child) {
  margin-left: 24px;
}
.navItem a {
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.2em;
}
.navItem a:hover {
  color: #A90025;
}

@media (min-width: 768px) and (max-width: 1279px) {
  .isPc {
    display: none;
  }
}
@media (max-width: 767px) {
  .isPc {
    display: none;
  }
}

@media (min-width: 1280px) {
  .isSp {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .isSp {
    display: none;
  }
}

/* header */
.header {
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  padding: 15px 0;
}

.headerInner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 767px) {
  .headerRight {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .headerRight {
    display: none;
  }
}

.headerImg img {
  width: 180px;
}
@media (max-width: 767px) {
  .headerImg img {
    width: 120px;
  }
}

.headerImg a {
  transition: 0.3s ease-in-out;
}

.headerImg img:hover {
  opacity: 0.8;
}

.headerButton a:hover {
  color: #fff;
  background: #A90025;
}

.listInner {
  margin: 24px 0;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .listInner {
    margin: 18px 0;
  }
}
@media (max-width: 767px) {
  .listInner {
    margin: 12px 0;
  }
}

.lists {
  padding: 60px 40px;
  background: #ECE9E0;
  border-radius: 5px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .lists {
    padding: 40px 30px;
  }
}
@media (max-width: 767px) {
  .lists {
    padding: 30px 20px;
    max-width: 340px;
    width: 100%;
    margin: 0 auto;
  }
}

.list {
  padding: 32px 24px;
  display: flex;
  justify-content: left;
  align-items: center;
  border-bottom: 2px solid #fff;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .list {
    padding: 18px 16px;
  }
}
@media (max-width: 767px) {
  .list {
    padding: 16px 12px;
  }
}
.list:first-child {
  border-top: 2px solid #fff;
}

.listTag {
  font-family: "Lato", "Noto Sans JP", serif;
  display: inline-block;
  padding: 8px 18px;
  color: #fff;
  background: #A90025;
  font-size: 18px;
  letter-spacing: 0.2em;
  border-radius: 5px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .listTag {
    padding: 9px 15px;
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .listTag {
    padding: 6px 14px;
    font-size: 14px;
  }
}

.listText {
  margin-left: 40px;
  font-size: 24px;
  font-weight: 500;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .listText {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .listText {
    margin-left: 30px;
    font-size: 18px;
  }
}

/* first view */
.fv {
  padding: 60px 0;
  background: url(../img/fvBg.png) no-repeat center center/cover;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .fv {
    padding: 40px 0;
  }
}
@media (max-width: 767px) {
  .fv {
    padding: 30px 0;
  }
}

.fvInner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 767px) {
  .fvInner {
    flex-direction: column-reverse;
  }
}

.fvTitle h1 {
  font-size: 3.2rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.1em;
}
.fvTitle h1 span {
  font-size: 3.6rem;
  font-weight: 700;
  padding: 12px;
  margin-right: 8px;
  color: #fff;
  background: #A90025;
  border-radius: 5px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .fvTitle h1 {
    font-size: 2.4rem;
  }
  .fvTitle h1 span {
    font-size: 2.8rem;
  }
}
@media (max-width: 767px) {
  .fvTitle h1 {
    font-size: 1.6rem;
  }
  .fvTitle h1 span {
    font-size: 2rem;
    padding: 8px;
  }
}
@media (max-width: 767px) {
  .fvTitle {
    margin-top: 30px;
    max-width: 340px;
    width: 100%;
    margin: 0 auto;
  }
}

.fvTags {
  margin-top: 60px;
  display: flex;
  flex-flow: column;
  max-width: 420px;
  width: 100%;
}
@media (max-width: 767px) {
  .fvTags {
    margin-top: 30px;
    max-width: 340px;
  }
}

.fvTag {
  padding-left: 42px;
  display: inline-block;
  color: #1e1e1e;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.1em;
  position: relative;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .fvTag {
    font-size: 16px;
    line-height: 1.6;
  }
}
@media (max-width: 767px) {
  .fvTag {
    font-size: 14px;
  }
}
.fvTag::before {
  content: "";
  position: absolute;
  background: url(../img/checkIcon.png) no-repeat center center/contain;
  width: 24px;
  height: 24px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.fvTag:not(:first-child) {
  margin-top: 24px;
}
@media (max-width: 767px) {
  .fvTag:not(:first-child) {
    margin-top: 18px;
  }
}

.fvImg {
  max-width: 560px;
  width: 100%;
}
@media (max-width: 767px) {
  .fvImg {
    max-width: 320px;
  }
}

/* reason */
.reasonTitle-bg {
  text-align: center;
  color: #fff;
  background: #A90025;
  padding: 30px 0;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonTitle-bg {
    padding: 20px 0;
  }
}
@media (max-width: 767px) {
  .reasonTitle-bg {
    padding: 15px 0;
  }
}

.reasonTitle {
  font-size: 2.2rem;
  font-weight: 500;
  letter-spacing: 0.1em;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonTitle {
    font-size: 1.6rem;
  }
}
@media (max-width: 767px) {
  .reasonTitle {
    font-size: 1rem;
  }
}

.reasonInner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 40px 0;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonInner {
    display: block;
    padding: 20px 0;
  }
}
@media (max-width: 767px) {
  .reasonInner {
    display: block;
    padding: 20px 0;
  }
}

.reasonImgs {
  display: flex;
  gap: 20px;
  max-width: 640px;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonImgs {
    gap: 10px;
    margin: 0 auto;
    margin-top: 30px;
  }
}
@media (max-width: 767px) {
  .reasonImgs {
    max-width: 320px;
    gap: 10px;
    margin: 0 auto;
    margin-top: 30px;
  }
}

.reasonImg {
  max-width: 180px;
  width: 100%;
  padding: 30px;
  border: 2px solid #A90025;
  border-radius: 5px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonImg {
    max-width: 240px;
  }
}
@media (max-width: 767px) {
  .reasonImg {
    max-width: 100px;
  }
}

.reasonImg01 {
  position: relative;
}
.reasonImg01::before {
  content: "Youtube";
  position: absolute;
  top: -22px;
  left: 0;
  color: #A90025;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.1em;
}
@media (max-width: 767px) {
  .reasonImg01::before {
    top: -16px;
    font-size: 12px;
  }
}

.reasonImg02 {
  position: relative;
}
.reasonImg02::before {
  content: "Instagram";
  position: absolute;
  top: -22px;
  left: 0;
  color: #A90025;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.1em;
}
@media (max-width: 767px) {
  .reasonImg02::before {
    top: -16px;
    font-size: 12px;
  }
}

.reasonImg03 {
  position: relative;
}
.reasonImg03::before {
  content: "Tiktok";
  position: absolute;
  top: -22px;
  left: 0;
  color: #A90025;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.1em;
}
@media (max-width: 767px) {
  .reasonImg03::before {
    top: -16px;
    font-size: 12px;
  }
}

.reasonText {
  max-width: 640px;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonText {
    max-width: 100%;
    margin-top: 18px;
  }
}
@media (max-width: 767px) {
  .reasonText {
    max-width: 320px;
    margin: 0 auto;
    margin-top: 18px;
  }
}
.reasonText p {
  font-size: 18px;
  letter-spacing: 0.2em;
  line-height: 2.4;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .reasonText p {
    font-size: 16px;
    line-height: 2;
  }
}
@media (max-width: 767px) {
  .reasonText p {
    font-size: 14px;
    line-height: 1.8;
  }
}

/* flow */
.flowCards {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .flowCards {
    display: block;
    max-width: 320px;
    margin: 0 auto;
  }
}

.flowCard {
  max-width: calc(25% - 36px);
  width: 100%;
}
@media (max-width: 767px) {
  .flowCard {
    max-width: 100%;
  }
  .flowCard:not(:first-child) {
    margin-top: 20px;
  }
}

.flowCard-tag {
  color: #A90025;
  font-size: 2.8rem;
  font-weight: 900;
  transform: skewX(-10deg);
}
@media (min-width: 768px) and (max-width: 1279px) {
  .flowCard-tag {
    font-size: 2rem;
  }
}
@media (max-width: 767px) {
  .flowCard-tag {
    font-size: 1.8rem;
  }
}

.flowCard-img {
  margin-top: 6px;
  width: 100%;
}
@media (max-width: 767px) {
  .flowCard-img {
    max-width: 240px;
    margin: 0 auto;
    margin-top: 6px;
  }
}

.flowCard-title {
  display: inline-block;
  margin-top: 12px;
  padding: 8px 18px;
  font-size: 18px;
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.2em;
  background: #A90025;
  border-radius: 5px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .flowCard-title {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .flowCard-title {
    margin-top: 6px;
    font-size: 14px;
  }
}

.flowCard-text {
  margin-top: 8px;
}
.flowCard-text p {
  line-height: 2;
}
@media (max-width: 767px) {
  .flowCard-text p {
    line-height: 1.8;
  }
}

/* comment */
.commentTitle-bg {
  text-align: center;
  color: #fff;
  background: #A90025;
  padding: 30px 0;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentTitle-bg {
    padding: 20px 0;
  }
}
@media (max-width: 767px) {
  .commentTitle-bg {
    padding: 15px 0;
  }
}

.commentTitle {
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: 0.1em;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentTitle {
    font-size: 1.4rem;
  }
}
@media (max-width: 767px) {
  .commentTitle {
    font-size: 1rem;
    line-height: 1.2;
  }
}

.commentInner {
  display: flex;
  justify-content: left;
  align-items: center;
  padding: 40px 0;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentInner {
    padding: 20px 0;
  }
}
@media (max-width: 767px) {
  .commentInner {
    display: block;
    max-width: 320px;
    width: 100%;
    margin: 0 auto;
    padding: 20px 0;
  }
}

.commentTag {
  display: inline-block;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.2em;
  padding: 12px 18px;
  border: 2px solid #A90025;
  border-radius: 5px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentTag {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .commentTag {
    font-size: 14px;
    padding: 8px 12px;
  }
}

.commentText {
  margin-top: 18px;
  max-width: 600px;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentText {
    margin-top: 12px;
  }
}
@media (max-width: 767px) {
  .commentText {
    margin-top: 8px;
  }
}
.commentText p {
  font-size: 18px;
  letter-spacing: 0.2em;
  line-height: 2.4;
}
.commentText p span {
  font-weight: 500;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentText p {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .commentText p {
    font-size: 14px;
    line-height: 1.8;
  }
}

.commentRight {
  margin-left: 60px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .commentRight {
    margin-left: 40px;
  }
}
@media (max-width: 767px) {
  .commentRight {
    margin-left: 0;
    margin-top: 20px;
  }
}

.commentImg {
  max-width: 320px;
  width: 100%;
}
@media (max-width: 767px) {
  .commentImg {
    max-width: 240px;
    margin: 0 auto;
  }
}

.priceAndvisionInner {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .priceAndvisionInner {
    display: block;
  }
}

/* price */
.price {
  max-width: 600px;
  width: 100%;
}
@media (max-width: 767px) {
  .price {
    max-width: 100%;
  }
}

.priceText {
  font-size: 18px;
  letter-spacing: 0.2em;
  line-height: 1.6;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .priceText {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .priceText {
    font-size: 14px;
    max-width: 340px;
    margin: 0 auto;
  }
}

/* vision */
.vision {
  max-width: 600px;
  width: 100%;
}
@media (max-width: 767px) {
  .vision {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .visionText {
    max-width: 320px;
    width: 100%;
    margin: 0 auto;
  }
}
.visionText p {
  font-size: 18px;
  letter-spacing: 0.2em;
  line-height: 2.4;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .visionText p {
    font-size: 16px;
    line-height: 2;
  }
}
@media (max-width: 767px) {
  .visionText p {
    font-size: 14px;
    line-height: 1.8;
  }
}

/* contact */
.contactText {
  margin-bottom: 60px;
  font-size: 18px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .contactText {
    margin-bottom: 40px;
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .contactText {
    text-align: center;
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.6;
  }
}

.formBg {
  padding: 80px;
  background: #ECE9E0;
  border-radius: 5px;
}
@media (max-width: 767px) {
  .formBg {
    padding: 60px;
  }
}
@media (max-width: 767px) {
  .formBg {
    padding: 40px;
  }
}

.formInner {
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .formInner {
    max-width: 100%;
  }
}
@media (max-width: 767px) {
  .formInner {
    max-width: 320px;
  }
}

.formList {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .formList {
    display: block;
  }
}
@media (max-width: 767px) {
  .formList {
    display: block;
  }
}
.formList:not(:first-child) {
  margin-top: 32px;
}
@media (max-width: 767px) {
  .formList:not(:first-child) {
    margin-top: 24px;
  }
}

.formLabel {
  margin-right: 80px;
  display: inline-block;
  font-size: 18px;
  position: relative;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .formLabel {
    margin-right: 0;
    margin-bottom: 18px;
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .formLabel {
    margin-right: 0;
    margin-bottom: 12px;
    font-size: 14px;
  }
}
.formLabel::after {
  content: "必須";
  position: absolute;
  color: #A90025;
  border: 1px solid #A90025;
  font-size: 12px;
  font-family: "Lato", "Noto Sans JP", serif;
  font-weight: 400;
  letter-spacing: 0.2em;
  right: -100px;
  top: 50%;
  transform: translateY(-50%);
  padding: 7.5px 15px;
  border-radius: 5px;
}
@media (max-width: 767px) {
  .formLabel::after {
    font-size: 12px;
    right: -60px;
    padding: 3.75px 7.5px;
  }
}

.formInput {
  display: block;
  max-width: 680px;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .formInput {
    max-width: 100%;
  }
}
@media (max-width: 767px) {
  .formInput {
    max-width: 100%;
  }
}

input[type=text],
input[type=email],
input[type=tel],
textarea {
  width: 100%;
  border: none;
  padding: 2em 2.6em;
  border-radius: 5px;
}
@media (max-width: 767px) {
  input[type=text],
input[type=email],
input[type=tel],
textarea {
    padding: 1em 1.3em;
  }
}

input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
textarea:focus {
  outline: none;
}

input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=tel]::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 0.6;
  color: #9c9c9c;
}

input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
textarea::placeholder {
  opacity: 0.6;
  color: #9c9c9c;
}

textarea {
  width: 100%;
  min-height: 360px;
}
@media (max-width: 767px) {
  textarea {
    min-height: 180px;
  }
}

.radioInner {
  max-width: 680px;
  width: 100%;
  display: flex;
}
@media (max-width: 767px) {
  .radioInner {
    max-width: 100%;
    display: block;
  }
}

@media (min-width: 1280px) {
  .radio:not(:first-child) {
    margin-left: 12px;
  }
}
@media (max-width: 767px) {
  .radio:not(:first-child) {
    margin-top: 18px;
  }
}
.radio input[type=radio] {
  display: none;
}
.radio .wpcf7-list-item-label {
  display: inline-block;
  padding-left: 36px;
  font-family: "Lato", "Noto Sans JP", serif;
  font-weight: 400;
  position: relative;
}
@media (max-width: 767px) {
  .radio .wpcf7-list-item-label {
    padding-left: 30px;
  }
}
.radio .wpcf7-list-item-label::before, .radio .wpcf7-list-item-label::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}
.radio .wpcf7-list-item-label::before {
  left: 0;
  width: 24px;
  height: 24px;
  background: #fff;
  border: 1px solid #A90025;
}
@media (max-width: 767px) {
  .radio .wpcf7-list-item-label::before {
    width: 18px;
    height: 18px;
  }
}
.radio .wpcf7-list-item-label::after {
  left: 8px;
  width: 10px;
  height: 10px;
  background: #A90025;
  display: none;
}
@media (max-width: 767px) {
  .radio .wpcf7-list-item-label::after {
    left: 6px;
    width: 8px;
    height: 8px;
  }
}
.radio input[type=radio]:checked + .wpcf7-list-item-label::after {
  display: block;
}

@media (min-width: 1280px) {
  .wpcf7-list-item {
    margin: 0;
  }
}
@media (min-width: 1280px) {
  .wpcf7-list-item:not(:first-child) {
    margin: 0 0 0 1em;
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .wpcf7-list-item {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .wpcf7-list-item:not(:first-child) {
    margin: 0 0 0 1em;
  }
}

@media (max-width: 767px) {
  .wpcf7-list-item {
    display: block;
    margin: 8px 0;
  }
}

.wpcf7-spinner {
  display: none;
}

.formButton-inner {
  text-align: center;
  margin-top: 48px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .formButton-inner {
    margin-top: 36px;
  }
}
@media (max-width: 767px) {
  .formButton-inner {
    margin-top: 24px;
  }
}

.formButton {
  color: #A90025;
  font-size: 20px;
  font-family: "Lato", "Noto Sans JP", serif;
  letter-spacing: 0.2em;
  font-weight: 400;
  background: #fff;
  border: 2px solid #A90025;
  padding: 12px 60px;
  border-radius: 5px;
  transition: 0.3s ease-in-out;
}
@media (max-width: 767px) {
  .formButton {
    padding: 6px 22.5px;
    font-size: 14px;
    border: 1px solid #A90025;
  }
}
.formButton:hover {
  color: #fff;
  background: #A90025;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
}

textarea {
  resize: none;
}


/* footer */
.footer {
  padding: 60px 0 30px;
  background: #A90025;
  color: #fff;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .footer {
    padding: 40px 20px;
  }
}
@media (max-width: 767px) {
  .footer {
    padding: 30px 0 20px;
  }
}

.footerInner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footerImg a {
  transition: 0.3s ease-in-out;
}

.footerImg img {
  width: 180px;
}
@media (max-width: 767px) {
  .footerImg img {
    width: 120px;
  }
}
.footerImg img:hover {
  opacity: 0.8;
}

.footerNav {
  justify-content: right;
}
@media (max-width: 767px) {
  .footerNav {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .footerNav {
    display: none;
  }
}

.footerItem a {
  color: #fff;
}
.footerItem a:hover {
  color: #fff;
  opacity: 0.6;
}

.companyInfos {
  margin-top: 40px;
  justify-content: left;
}
@media (max-width: 767px) {
  .companyInfos {
    margin-top: 30px;
  }
}
@media (max-width: 767px) {
  .companyInfos {
    margin-top: 20px;
  }
}

.companyInfo a {
  font-size: 14px;
}
@media (max-width: 767px) {
  .companyInfo a {
    font-size: 12px;
  }
}

.copy {
  margin-top: 60px;
  color: #fff;
  font-size: 12px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .copy {
    margin-top: 40px;
  }
}
@media (max-width: 767px) {
  .copy {
    margin-top: 30px;
  }
}

/* drawer */
@media (min-width: 1280px) {
  .drawerIcon{
    display: none;
  }
}
@media (min-width: 1280px) {
  .drawerContent{
    display: none;
  }
}
.drawerIcon {
  padding: 0 20px;
  align-items: center;
  position: fixed;
  top: 24px;
  right: 6px;
  z-index: 300;
  transition: transform 0.5s ease 0s;
}
.drawerIcon.active {
  transform: translateX(-18px);
  top: 24px;
}
.drawerIcon.active .drawerIcon-bar1 {
  transform: rotate(-45deg);
  top: 8px;
}
.drawerIcon.active .drawerIcon-bar2 {
  display: none;
}
.drawerIcon.active .drawerIcon-bar3 {
  transform: rotate(45deg);
  top: 8px;
}
.drawerIcon.active .drawerIcon-bar1,
.drawerIcon.active .drawerIcon-bar2,
.drawerIcon.active .drawerIcon-bar3 {
  background: #fff;
}

.drawerIcon-bars {
  display: block;
  position: relative;
  width: 21px;
  height: 20px;
}

.drawerIcon-bar1,
.drawerIcon-bar2,
.drawerIcon-bar3 {
  position: absolute;
  width: 21px;
  height: 2px;
  background: #A90025;
  border-radius: 3px;
  top: 0;
  right: -11px;
}

.drawerIcon-bar1 {
  top: 0;
}

.drawerIcon-bar2 {
  top: 8px;
}

.drawerIcon-bar3 {
  top: 16px;
}

.drawerContent {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  background: rgba(169, 0, 36, 0.15);
  z-index: 299;
  transform: translateX(105%);
  transition: transform 0.5s ease 0s;
}
.drawerContent.active {
  transform: translateX(0);
}

.drawerItems {
  margin-left: auto;
  padding-top: 120px;
  padding-left: 15px;
  background: #A90025;
  width: 40%;
  height: 100%;
}

.drawerItem {
  margin-bottom: 32px;
}
.drawerItem a {
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
}
.drawerItem a:hover {
  opacity: 0.6;
}

/* 404 */
.errorButton a {
  font-weight: 400;
  letter-spacing: .2em;
}

@media (max-width: 767px) {
  .errorButton {
    text-align: center;
  }
}

/* note */
.note{
  position: fixed;
  z-index: 100;
  bottom: 10px;
  right: 10px;
}

.noteImg{
  max-width: 180px;
  width: 100%;
}

@media (max-width: 767px) {
  .noteImg{
    max-width: 100px;
    width: 100%;
  }
}

.noteImg a:hover{
  opacity: .8;
}