@charset "UTF-8";
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html {
  overflow-x: hidden;
  position: relative;
}

body {
  font-size: 1rem;
  background-color: #ffffff;
  color: #333333;
  font-family: "Zen Maru Gothic", sans-serif;
  line-height: 1.6;
  font-weight: 600;
}

.tel-link {
  cursor: text;
  text-decoration: none;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  .tel-link {
    cursor: auto;
    text-decoration: none;
    pointer-events: auto;
  }
}

a {
  color: #2595EA;
  text-decoration: underline;
}

.fade-in {
  opacity: 0;
  transition-duration: 1s;
  transition-property: opacity, transform;
}

.fade-in-up {
  transform: translate(0, 50px);
}

.fade-in-down {
  transform: translate(0, -50px);
}

.fade-in-left {
  transform: translate(-50px, 0);
}

.fade-in-right {
  transform: translate(50px, 0);
}

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

.text-red {
  color: #ff0000;
}

.bg-red {
  background-color: #ff0000;
}

.text-pink {
  color: #ff00fe;
}

.bg-pink {
  background-color: #ff00fe;
}

.text-purple {
  color: #800080;
}

.bg-purple {
  background-color: #800080;
}

.text-blue {
  color: #0000FF;
}

.bg-blue {
  background-color: #0000FF;
}

.text-green {
  color: #008000;
}

.bg-green {
  background-color: #008000;
}

.text-yellow {
  color: #ffc000;
}

.bg-yellow {
  background-color: #ffc000;
}

.text-shadow {
  text-shadow: 1px 1px 2px #fff, -1px 1px 2px #fff, 1px -1px 2px #fff, -1px -1px 2px #fff;
}

@media screen and (max-width: 768px) {
  .br_pc {
    display: none;
  }
}

@media screen and (min-width: 1441px) {
  .br_sp {
    display: none;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  .br_sp {
    display: none;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .br_sp {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .pc {
    display: none;
  }
}

@media screen and (min-width: 1441px) {
  .sp {
    display: none;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  .sp {
    display: none;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .sp {
    display: none;
  }
}

.wide {
  max-width: 1140px;
  margin: auto;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .wide {
    max-width: 800px;
  }
}
@media screen and (max-width: 768px) {
  .wide {
    max-width: none;
  }
}

#main {
  overflow: hidden;
}

p {
  font-size: 1.2rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  p {
    font-size: 1.1rem;
  }
}
@media screen and (max-width: 768px) {
  p {
    font-size: 1rem;
  }
}

h1 {
  font-size: 2.2vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  h1 {
    font-size: 3.5vw;
  }
}
@media screen and (max-width: 768px) {
  h1 {
    font-size: 7vw;
  }
}

h2 {
  font-size: 1.6vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  h2 {
    font-size: 3vw;
  }
}
@media screen and (max-width: 768px) {
  h2 {
    font-size: 6vw;
  }
}

h3 {
  font-size: 1.3vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  h3 {
    font-size: 2.5vw;
  }
}
@media screen and (max-width: 768px) {
  h3 {
    font-size: 5vw;
  }
}

h4 {
  font-size: 1.2vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  h4 {
    font-size: 2.2vw;
  }
}
@media screen and (max-width: 768px) {
  h4 {
    font-size: 4vw;
  }
}

h5 {
  font-size: 1.1vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  h5 {
    font-size: 2vw;
  }
}
@media screen and (max-width: 768px) {
  h5 {
    font-size: 3.5vw;
  }
}

#lower {
  position: relative;
  z-index: 12;
  overflow: hidden;
}
#lower .lower {
  position: relative;
  width: 100vw;
  height: 70vh;
  background-position: center;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  #lower .lower {
    position: relative;
    height: 75vw;
  }
}
#lower .lower_contents {
  position: absolute;
  top: 50%;
  width: 30%;
  color: #fff;
  text-align: center;
  z-index: 123;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #lower .lower_contents {
    top: 40%;
  }
}
@media screen and (max-width: 768px) {
  #lower .lower_contents {
    display: none;
  }
}
#lower .lower_contents h1 {
  color: #ffffff;
  text-shadow: 0px 0px 5px #000;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 600;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #lower .lower_contents h1 {
    font-size: 140%;
  }
}
#lower .lower_contents p {
  font-size: 120%;
  text-shadow: 0px 0px 5px #000;
}
#lower .lower-header-wrap {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  color: #fff;
  text-shadow: 1px 1px 2px rgb(0, 34, 85), -1px 1px 2px rgb(0, 34, 85), 1px -1px 2px rgb(0, 34, 85), -1px -1px 2px rgb(0, 34, 85);
  position: absolute;
  z-index: 1234;
}
@media screen and (max-width: 768px) {
  #lower .lower-header-wrap {
    display: none;
  }
}
#lower .lower-header-wrap .lower-comment {
  width: 50%;
  margin-left: 30%;
}
#lower .lower-header-wrap .lower-comment p {
  font-size: 1vw;
  line-height: 1.8;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #lower .lower-header-wrap .lower-comment p {
    font-size: 2vw;
  }
}

.contents_top {
  display: none;
}
@media screen and (max-width: 768px) {
  .contents_top {
    display: block;
    position: relative;
    z-index: 10;
  }
}
.contents_top .contents_top_headline {
  color: #333333;
  text-align: center;
  margin: 2rem auto;
}
.contents_top .contents_top_headline h2 {
  font-size: 200%;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .contents_top .contents_top_headline h2 {
    font-size: 160%;
  }
}
.contents_top .contents_top_headline p {
  font-size: 120%;
}
@media screen and (max-width: 768px) {
  .contents_top .contents_top_headline p {
    font-size: 120%;
  }
}
.contents_top .lower-header-wrap {
  top: 50%;
  left: 0;
  width: 100%;
  color: #fff;
  text-shadow: 1px 1px 2px rgb(0, 34, 85), -1px 1px 2px rgb(0, 34, 85), 1px -1px 2px rgb(0, 34, 85), -1px -1px 2px rgb(0, 34, 85);
  position: absolute;
  z-index: 1234;
}
@media screen and (max-width: 768px) {
  .contents_top .lower-header-wrap {
    position: relative;
    color: #333333;
    text-shadow: none;
  }
}
.contents_top .lower-header-wrap .lower-comment {
  width: 50%;
  margin-left: 30%;
}
@media screen and (max-width: 768px) {
  .contents_top .lower-header-wrap .lower-comment {
    width: 90%;
    margin: auto;
  }
}
.contents_top .lower-header-wrap .lower-comment p {
  font-size: 1vw;
  line-height: 1.8;
}
@media screen and (max-width: 768px) {
  .contents_top .lower-header-wrap .lower-comment p {
    font-size: 4vw;
  }
}

.back-to-top {
  display: none;
  position: fixed;
  z-index: 9999;
  right: 3%;
  bottom: 5%;
  color: #ffffff;
  padding: 2rem;
  font-size: 2.5vw;
  border-radius: 50px;
  display: inline-block;
  text-decoration: none;
}
@media screen and (max-width: 768px) {
  .back-to-top {
    display: none !important;
  }
}

.topBtnSp {
  display: block !important;
  position: relative;
  top: 0;
  left: 0;
  color: #ffffff;
  padding: 1rem;
  font-size: 3vw;
  width: 100% !important;
  text-decoration: none;
  background: rgba(253, 0, 0, 0.85);
  text-align: center;
}
@media screen and (min-width: 1441px) {
  .topBtnSp {
    display: none !important;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  .topBtnSp {
    display: none !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .topBtnSp {
    display: none !important;
  }
}
.topBtnSp::before {
  width: 100% !important;
  height: 20vw !important;
  border-radius: 0 !important;
}
.topBtnSp i {
  font-size: 4vw;
}
.topBtnSp p {
  font-size: 3vw;
}

.back-to-top::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-block;
  width: 60px;
  height: 60px;
  background: rgba(0, 34, 85, 0.85);
  box-shadow: 1px 1px 2px rgba(255, 255, 255, 0.3), 1px -1px 2px rgba(255, 255, 255, 0.3), -1px 1px 2px rgba(255, 255, 255, 0.3), -1px -1px 2px rgba(255, 255, 255, 0.3);
  z-index: -1;
}

#rainbow {
  height: 10px;
  background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
}

.loading {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  background-color: #ffffff;
  font-size: 30px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s;
  z-index: 100;
}
.loading .loading_text {
  width: 50vw;
  height: 50vw;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
}
.loading .loadingText {
  animation: 0.5s flashing infinite;
  color: #fff;
  font-size: 1.2vw;
}
@media screen and (max-width: 768px) {
  .loading .loadingText {
    font-size: 3.3vw;
  }
}

.spinner-box {
  width: 300px;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
}
.spinner-box .pulse-container {
  width: 80px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.spinner-box .pulse-container .pulse-bubble {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #fff;
}
.spinner-box .pulse-container .pulse-bubble-1 {
  animation: pulse 0.4s ease 0s infinite alternate;
}
.spinner-box .pulse-container .pulse-bubble-2 {
  animation: pulse 0.4s ease 0.2s infinite alternate;
}
.spinner-box .pulse-container .pulse-bubble-3 {
  animation: pulse 0.4s ease 0.4s infinite alternate;
}

@keyframes pulse {
  from {
    opacity: 1;
    transform: scale(1);
  }
  to {
    opacity: 0.25;
    transform: scale(0.75);
  }
}
.loading.active {
  opacity: 1;
  visibility: visible;
}

header {
  position: relative;
  z-index: 1234;
}
@media screen and (max-width: 768px) {
  header {
    padding: 0;
  }
}
header #header_pc {
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}
@media screen and (max-width: 768px) {
  header #header_pc {
    display: none;
  }
}
header #header_pc .header_logo {
  position: absolute;
  top: 0;
  left: 0;
  width: 320px;
  padding: 1rem;
  z-index: 1234;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  header #header_pc .header_logo {
    width: 240px;
  }
}
header #header_pc .header_logo img {
  width: 100%;
}
header #header_pc .header_menu {
  background-color: rgba(255, 255, 255, 0.75);
}
header #header_pc .header_menu ul {
  display: flex;
  justify-content: end;
  align-items: center;
  list-style: none;
  width: 100%;
}
@media screen and (max-width: 768px) {
  header #header_pc .header_menu ul {
    flex-flow: column;
    height: auto;
  }
}
header #header_pc .header_menu ul li {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 1.5rem 1.5rem 1.5rem 1.5rem;
}
header #header_pc .header_menu ul li a {
  text-decoration: none;
  color: #333;
  font-size: 120%;
  text-align: center;
  font-weight: 400;
  line-height: 1;
  position: relative;
  z-index: 1;
  transition: all 0.4s;
}
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  header #header_pc .header_menu ul li a {
    font-size: 110%;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  header #header_pc .header_menu ul li a {
    font-size: 90%;
  }
}
header #header_pc .header_menu ul li a span {
  font-size: 70%;
}
header #header_pc .header_menu ul li a:hover {
  color: #FFC83F;
}
header #header_pc .header_menu ul li a.new_twitter:before {
  content: "𝕏" !important;
  font-family: sans-serif !important;
  font-weight: bold;
}
header #header_pc .header_menu ul li a.sns-link {
  font-size: 120%;
  color: #fff;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  header #header_pc .header_menu ul li a.sns-link {
    font-size: 80%;
  }
}
header #header_pc .header_menu ul li a.sns-link:hover {
  color: #FFC83F;
}
@media screen and (min-width: 1441px) {
  header #header_sp {
    display: none;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  header #header_sp {
    display: none;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  header #header_sp {
    display: none;
  }
}
header #header_sp .header_sp {
  position: absolute;
  top: 0;
  left: 0;
  padding: 1rem;
  z-index: 1234;
}
header #header_sp .header_sp .header_logo {
  width: 60vw;
}
header #header_sp .header_sp .header_logo img {
  width: 100%;
}
header #header_sp .header_sp_bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 16vw;
  background: rgba(146, 209, 79, 0.8);
  z-index: 9999;
}
header #header_sp .header_sp_bottom ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 90%;
  height: 100%;
  margin: auto;
  list-style: none;
  padding-top: 5px;
}
header #header_sp .header_sp_bottom ul li a {
  text-decoration: none;
  color: #fff;
}
header #header_sp .header_sp_bottom ul li a .header_icon {
  text-align: center;
  height: 8vw;
  display: flex;
  justify-content: center;
  align-items: center;
}
header #header_sp .header_sp_bottom ul li a .header_icon i {
  font-size: 6vw;
}

/*　ハンバーガーボタン　*/
.hamburger {
  display: block;
  z-index: 10005;
  width: 50px;
  height: 50px;
  cursor: pointer;
  text-align: center;
  position: relative;
}

.hamburger span {
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 6px;
  background: #fff;
  transition: 0.3s ease-in-out;
}

.hamburger p {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translate(-50%, 0);
  color: #fff;
}

.hamburger span:nth-child(1) {
  top: 5px;
  left: 50%;
  transform: translate(-50%, 0);
}

.hamburger span:nth-child(2) {
  top: 15px;
  left: 50%;
  transform: translate(-50%, 0);
}

.hamburger span:nth-child(3) {
  top: 25px;
  left: 50%;
  transform: translate(-50%, 0);
}

/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top: 16px;
  left: 15px;
  background: #fff;
  transform: rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 16px;
  left: 15px;
  background: #fff;
  transform: rotate(45deg);
}

nav.globalMenuSp {
  position: fixed;
  z-index: 10000;
  bottom: 60px;
  left: 0;
  color: #fff;
  background: rgba(146, 209, 79, 0.8);
  text-align: center;
  width: 100%;
  height: auto;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  padding: 5vw 3vw;
  overflow: auto;
}

nav.globalMenuSp .ul {
  margin: auto;
  margin-top: 0 !important;
  margin-bottom: 4vw !important;
  padding: 0;
  width: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
}
nav.globalMenuSp .ul .new_twitter:before {
  content: "𝕏" !important;
  font-family: sans-serif !important;
  font-weight: bold;
}

.sns {
  justify-content: center !important;
}

nav.globalMenuSp .ul li {
  list-style-type: none;
  padding: 0;
  width: 45%;
  transition: 0.4s all;
  margin-bottom: 20px;
}

nav.globalMenuSp .ul li:last-child {
  padding-bottom: 0;
}

nav.globalMenuSp .ul li:hover {
  background: #ddd;
}

nav.globalMenuSp .ul li a {
  display: block;
  color: #fff;
  padding: 1em 0;
  font-size: 3.5vw;
  padding: 0 4vw;
  padding-bottom: 2vw;
  border-bottom: 1px solid #fff;
}
nav.globalMenuSp .ul li a i {
  margin-right: 2vw;
}

.header_sp_policy {
  text-align: center;
  margin-bottom: 8vw;
}
.header_sp_policy a {
  text-decoration: none;
  color: #fff;
  font-size: 3.5vw;
  padding: 0 4vw;
  padding-bottom: 2vw;
  border-bottom: 1px solid #fff;
}

/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
  opacity: 100;
  visibility: visible;
}

#top_main {
  position: relative;
  z-index: 12;
  overflow: hidden;
  background-color: #fff;
}
#top_main .top_main {
  height: 100vh;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #top_main .top_main {
    height: 40vh;
  }
}
#top_main .top_main .slider {
  width: 100vw;
  height: 100%;
  margin-inline: auto;
  overflow: hidden;
  background-color: #ffffff;
  z-index: 15;
}
@media screen and (max-width: 768px) {
  #top_main .top_main .slider {
    height: 40vh;
  }
}
#top_main .top_main .slider .slick-list {
  width: 100%;
  height: 100%;
  margin: auto;
}
#top_main .top_main .slider .slick-list .slick-track {
  width: 100%;
  height: 100%;
}
#top_main .top_main .slider .slick-list .slick-track .slick-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#top_main .slider_text {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 1234;
  animation: fadeIn 3s ease 2s forwards normal;
  opacity: 0;
}
#top_main .slider_text h1 {
  color: #ffffff;
  text-shadow: 0px 0px 5px #000;
  text-align: center;
  font-size: 3vw;
  font-weight: 600;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #top_main .slider_text h1 {
    font-size: 6vw;
  }
}
@media screen and (max-width: 768px) {
  #top_main .slider_text h1 {
    font-size: 7vw;
  }
}
#top_main .slider_text h2 {
  color: #ffffff;
  text-shadow: 0px 0px 5px #000;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 600;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #top_main .slider_text h2 {
    font-size: 2.3rem;
  }
}
@media screen and (max-width: 768px) {
  #top_main .slider_text h2 {
    font-size: 5vw;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15); /* 拡大率 */
  }
}
#top_news {
  padding: 3rem 0;
  width: 70%;
  margin: auto;
  position: relative;
}
@media screen and (max-width: 768px) {
  #top_news {
    width: 100%;
    padding: 2rem 1rem;
    margin-top: 3rem;
    margin-bottom: 2rem;
  }
}
#top_news .top_news_btn {
  position: absolute;
  top: 5rem;
  right: 2rem;
}
#top_news .top_news_btn a {
  text-decoration: none;
  transition: all 0.2s;
}
#top_news .top_news_btn a:hover {
  border-bottom: 1px solid #fff;
  opacity: 0.8;
}
#top_news .top_news_btn a button {
  color: #333;
  background-color: #f8f9fa;
  border: 1px solid #d1d1d1;
  border-radius: 0.2rem;
  font-size: 1rem;
  padding: 0.25rem 0.5rem;
}
@media screen and (max-width: 768px) {
  #top_news .top_news_btn a button {
    font-size: 0.8rem;
  }
}
#top_news h1 {
  color: #002255;
  text-align: center;
  margin-bottom: 2rem;
}
#top_news .top_news_contents ul {
  list-style: none;
  min-height: 12vw;
}
#top_news .top_news_contents ul a {
  color: #2595EA;
  text-decoration: none;
}
#top_news .top_news_contents ul a li {
  border-bottom: 2px dotted #002255;
  padding-bottom: 1vw;
}
@media screen and (max-width: 768px) {
  #top_news .top_news_contents ul a li {
    padding-bottom: 2vw;
  }
}
#top_news .top_news_contents ul a li .outline {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #top_news .top_news_contents ul a li .outline {
    flex-flow: column;
    align-items: flex-start;
  }
}
#top_news .top_news_contents ul a li .outline .date {
  width: 20%;
  padding: 0.25rem;
  color: #333;
  margin-right: 2vw;
  font-size: 1vw;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #top_news .top_news_contents ul a li .outline .date {
    margin-right: 0;
    margin-bottom: 2vw;
    font-size: 3vw;
  }
}
#top_news .top_news_contents ul a li .outline .title {
  width: auto;
  color: #002255;
  font-size: 1vw;
  font-size: 600;
  transition: all 0.4s;
}
@media screen and (max-width: 768px) {
  #top_news .top_news_contents ul a li .outline .title {
    font-size: 3vw;
  }
}

#greeting #bg-greeting {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  display: flex;
  justify-content: start;
  align-items: center;
  padding: 10rem 0;
  position: relative;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #greeting #bg-greeting {
    padding: 5rem 0;
  }
}
@media screen and (max-width: 768px) {
  #greeting #bg-greeting {
    background-attachment: scroll;
    padding: 5rem 0;
  }
}
#greeting #bg-greeting:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 100%);
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #greeting #bg-greeting:before {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.85) 60%, rgba(255, 255, 255, 0) 100%);
  }
}
@media screen and (max-width: 768px) {
  #greeting #bg-greeting:before {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
  }
}
#greeting #bg-greeting #text-greeting {
  width: 50%;
  margin: 0 0 0 5%;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #greeting #bg-greeting #text-greeting {
    width: 55%;
    margin: 0 0 0 3%;
    padding: 3rem 0;
    border-radius: 10px;
  }
}
@media screen and (max-width: 768px) {
  #greeting #bg-greeting #text-greeting {
    width: 95%;
    background: rgba(255, 255, 255, 0.75);
    padding: 3rem 2rem;
    border-radius: 10px;
    margin: 0 auto 0 auto;
  }
}
#greeting #bg-greeting #text-greeting h1 {
  color: #64b200;
  padding-left: 3.5rem;
  position: relative;
  margin-bottom: 2rem;
  font-size: 1.6rem;
  background-size: 50px;
  background-position: left center;
  background-repeat: no-repeat;
}
#greeting #bg-greeting #text-greeting h1:after {
  position: absolute;
  content: "";
  top: 100%;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(45deg, transparent, #64b200 0, #64b200 10%, transparent);
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #greeting #bg-greeting #text-greeting h1 {
    font-size: 1.4rem;
  }
}
#greeting #bg-greeting #text-greeting p {
  font-weight: 600;
  color: #333;
  line-height: 2;
}

#top_contents {
  padding: 8rem 0;
  position: relative;
  z-index: 10;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  #top_contents {
    padding: 5rem 0;
  }
}
#top_contents #top_contents_box {
  width: 85%;
  margin: auto;
  padding: 3rem;
  background-color: rgba(255, 255, 255, 0.85);
  border-radius: 1rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #top_contents #top_contents_box {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #top_contents #top_contents_box {
    width: 90%;
    padding: 1.5rem;
  }
}
#top_contents #top_contents_box h1 {
  margin: auto;
  padding: 0 10rem 0.5rem 10rem;
  display: table;
  color: #333;
  text-align: center;
  margin-bottom: 2rem;
  letter-spacing: 5px;
  background-image: repeating-linear-gradient(-45deg, #ff9393 0, #ff9393 2px, transparent 2px, transparent 4px, #ffbf7f 4px, #ffbf7f 6px, transparent 6px, transparent 8px, #ff7fff 8px, #ff7fff 10px, transparent 10px, transparent 12px, #7f7fff 12px, #7f7fff 14px, transparent 14px, transparent 16px, #7fffff 16px, #7fffff 18px, transparent 18px, transparent 20px, #bfff7f 20px, #bfff7f 22px, transparent 22px, transparent 24px, #ffff7f 24px, #ffff7f 26px, transparent 26px, transparent 28px);
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: 100% 5px;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #top_contents #top_contents_box h1 {
    padding: 0 10rem 0.5rem 10rem;
  }
}
@media screen and (max-width: 768px) {
  #top_contents #top_contents_box h1 {
    display: block;
    padding: 0 0 0.5rem 0;
  }
}
#top_contents #top_contents_box p {
  font-weight: 600;
  color: #333;
  text-align: center;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  #top_contents #top_contents_box p {
    text-align: left;
  }
}
#top_contents #top_contents_box p strong {
  width: 11rem;
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.25rem;
}
@media screen and (max-width: 768px) {
  #top_contents #top_contents_box p strong {
    width: 10rem;
  }
}
#top_contents #top_contents_box p strong img {
  width: 100%;
}
#top_contents #top_contents_box p a {
  display: table;
  margin: 0 auto;
  color: #ff0000;
  text-decoration: none;
  background-color: rgba(255, 255, 255, 0.75);
  padding: 0.5rem 2rem;
  margin-top: 1rem;
  border: 3px solid;
  -o-border-image: repeating-linear-gradient(135deg, red 0px 9px, transparent 10px 19px, orange 20px 29px, transparent 30px 39px, yellow 40px 49px, transparent 50px 59px, green 60px 69px, transparent 70px 79px, lightblue 80px 89px, transparent 90px 99px, blue 100px 109px, transparent 110px 119px, purple 120px 129px, transparent 130px 139px) 5;
     border-image: repeating-linear-gradient(135deg, red 0px 9px, transparent 10px 19px, orange 20px 29px, transparent 30px 39px, yellow 40px 49px, transparent 50px 59px, green 60px 69px, transparent 70px 79px, lightblue 80px 89px, transparent 90px 99px, blue 100px 109px, transparent 110px 119px, purple 120px 129px, transparent 130px 139px) 5;
  transition: 0.4s ease-out;
}
#top_contents #top_contents_box p a:hover {
  color: #ff9a00;
  opacity: 0.75;
}
#top_contents #top_contents_box .top_contents_img {
  margin-top: 3rem;
}
#top_contents #top_contents_box .top_contents_img ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 50%;
  margin: auto;
  list-style: none;
}
@media screen and (max-width: 768px) {
  #top_contents #top_contents_box .top_contents_img ul {
    flex-flow: column;
    width: 100%;
  }
}
#top_contents #top_contents_box .top_contents_img ul li {
  width: 45%;
  margin: auto;
}
@media screen and (max-width: 768px) {
  #top_contents #top_contents_box .top_contents_img ul li {
    width: 100%;
    margin-bottom: 1.5rem;
  }
}
#top_contents #top_contents_box .top_contents_img ul li img {
  width: 100%;
  height: 15rem;
  -o-object-fit: cover;
     object-fit: cover;
  box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.4);
}
#top_contents #top_contents_box .top_contents_img ul #top_contents_img01 {
  animation: fadeIn 3s ease 2s forwards normal;
  opacity: 0;
}
#top_contents #top_contents_box .top_contents_img ul #top_contents_img02 {
  animation: fadeIn 3s ease 2.5s forwards normal;
  opacity: 0;
}

#flex_contents {
  overflow: hidden;
  padding: 3rem 0;
}
#flex_contents h1 {
  color: #003e6d;
  text-align: center;
  margin-bottom: 2rem;
}
#flex_contents .flex_contents ul#bnr-wrap {
  display: flex;
  list-style: none;
}
@media screen and (max-width: 768px) {
  #flex_contents .flex_contents ul#bnr-wrap {
    flex-flow: column;
  }
}
#flex_contents .flex_contents ul#bnr-wrap li {
  width: 33.3333333333%;
}
@media screen and (max-width: 768px) {
  #flex_contents .flex_contents ul#bnr-wrap li {
    width: 100%;
    height: 80vw;
  }
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link {
  position: relative;
  display: block;
  overflow: hidden;
  height: 24vw;
}
@media screen and (max-width: 768px) {
  #flex_contents .flex_contents ul#bnr-wrap li a.bnr-link {
    height: 80vw;
  }
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link:hover p {
  bottom: 30px;
  opacity: 1;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #flex_contents .flex_contents ul#bnr-wrap li a.bnr-link:hover h2 {
    top: 20%;
  }
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link:hover .bnr-bg {
  transform: scale(1.02) translate(-50%, -50%);
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link:hover::before {
  opacity: 1;
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link:hover::after {
  opacity: 0;
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: 0.4s ease-out;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%);
  opacity: 0;
  z-index: 10;
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: 0.4s ease-out;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
  opacity: 1;
  z-index: 12;
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link .bnr-bg {
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease-out;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: scale(1) translate(-50%, -50%);
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link h2 {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 123;
  color: #fff;
  text-shadow: 1px 1px 1px rgba(0, 34, 85, 0.9);
  font-size: 140%;
  transition: 0.4s ease-out;
}
#flex_contents .flex_contents ul#bnr-wrap li a.bnr-link p {
  position: absolute;
  bottom: 15px;
  width: 70%;
  left: 15%;
  opacity: 0;
  z-index: 123;
  transition: 0.4s ease-out;
  font-size: 100%;
  color: #fff;
  text-shadow: 1px 1px 1px rgba(0, 34, 85, 0.9);
  text-align: center;
}

#works .works {
  width: 90%;
  margin: 3rem auto;
}
#works .works .works_text {
  margin-bottom: 2rem;
}
#works .works .works_text p {
  text-align: center;
}
@media screen and (max-width: 768px) {
  #works .works .works_text p {
    text-align: left;
  }
}
#works .works .works_contents h2 {
  color: #002255;
  border-left: 10px solid #002255;
  padding-left: 10px;
  margin-bottom: 2rem;
}
#works .works .works_contents ul {
  display: flex;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
  list-style: none;
  width: 100%;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents ul {
    flex-flow: column;
  }
}
#works .works .works_contents ul li {
  width: 30%;
  margin: 1%;
  margin-bottom: 2rem;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents ul li {
    width: 100%;
    margin-bottom: 8vw;
  }
}
#works .works .works_contents ul li .thumb {
  width: 100%;
  height: 20vw;
  margin-bottom: 1vw;
  position: relative;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents ul li .thumb {
    height: 50vw;
    margin-bottom: 2vw;
  }
}
#works .works .works_contents ul li .thumb::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.2s;
  background-color: rgba(0, 0, 0, 0);
}
#works .works .works_contents ul li .thumb:hover::after {
  background-color: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}
#works .works .works_contents ul li .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#works .works .works_contents ul li .thumb .search {
  position: absolute;
  top: 4%;
  right: 1%;
  z-index: 10;
}
#works .works .works_contents ul li .thumb .search i {
  transition: all 0.4s;
  font-size: 2vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #works .works .works_contents ul li .thumb .search i {
    font-size: 3vw;
  }
}
@media screen and (max-width: 768px) {
  #works .works .works_contents ul li .thumb .search i {
    font-size: 6vw;
  }
}
#works .works .works_contents ul li .title h4 {
  color: #333;
  font-weight: 600;
  margin-bottom: 0.5vw;
  font-size: 1.2vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #works .works .works_contents ul li .title h4 {
    font-size: 1.6vw;
  }
}
@media screen and (max-width: 768px) {
  #works .works .works_contents ul li .title h4 {
    font-size: 4vw;
    margin-bottom: 2vw;
  }
}
#works .works .works_contents ul li .text p {
  color: #333;
  font-size: 1vw;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents ul li .text p {
    font-size: 3.3vw;
  }
}
#works .works .works_contents .ba li {
  width: 45%;
  padding: 1vw;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents .ba li {
    width: 100%;
    padding: 3vw;
    margin-bottom: 8vw;
  }
}
#works .works .works_contents .ba li .thumb {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 15vw;
  position: relative;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents .ba li .thumb {
    height: 35vw;
  }
}
#works .works .works_contents .ba li .thumb::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 0% !important;
  height: 0% !important;
  transition: all 0.2s;
  background-color: rgba(0, 0, 0, 0);
}
#works .works .works_contents .ba li .thumb:hover::after {
  background-color: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}
#works .works .works_contents .ba li .thumb .img-before {
  width: 40%;
  position: relative;
}
#works .works .works_contents .ba li .thumb .img-before::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.2s;
  background-color: rgba(0, 0, 0, 0);
}
#works .works .works_contents .ba li .thumb .img-before:hover::after {
  background-color: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}
#works .works .works_contents .ba li .thumb .img-before img {
  width: 100%;
}
#works .works .works_contents .ba li .thumb .img-after {
  width: 50%;
  position: relative;
}
#works .works .works_contents .ba li .thumb .img-after::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.2s;
  background-color: rgba(0, 0, 0, 0);
}
#works .works .works_contents .ba li .thumb .img-after:hover::after {
  background-color: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}
#works .works .works_contents .ba li .thumb .img-after img {
  width: 100%;
}
#works .works .works_contents .ba li .thumb p {
  position: absolute;
  top: 50%;
  left: 45%;
  transform: translate(-50%, -50%);
}
#works .works .works_contents .ba li .thumb p i {
  font-size: 3vw;
}
@media screen and (max-width: 768px) {
  #works .works .works_contents .ba li .thumb p i {
    font-size: 6vw;
  }
}

#modal-container {
  display: none;
  position: fixed;
  background: rgba(0, 0, 0, 0.6);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;
}
#modal-container > div {
  display: flex;
  height: 100vh;
  justify-content: center;
  align-items: center;
}
#modal-container > div > img {
  width: auto;
  height: auto;
}
@media screen and (max-width: 768px) {
  #modal-container > div > img {
    width: 300px;
    height: 180px;
  }
}
#modal-container .close {
  position: absolute;
  top: 20%;
  right: 20%;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #modal-container .close {
    top: 32%;
    right: 22%;
  }
}
@media screen and (max-width: 768px) {
  #modal-container .close {
    top: 33%;
    right: 15%;
  }
}
#modal-container .close span:first-child {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-45deg);
  width: 50px;
  height: 2px;
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  #modal-container .close span:first-child {
    width: 25px;
  }
}
#modal-container .close span:last-child {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(45deg);
  width: 50px;
  height: 2px;
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  #modal-container .close span:last-child {
    width: 25px;
  }
}

img.popup {
  cursor: pointer;
  width: 100%;
  height: 100%;
}

#service {
  margin-top: 3rem;
}
#service .service {
  margin-bottom: 2rem;
}
#service .service .service_contents ul {
  list-style: none;
}
#service .service .service_contents ul li {
  padding-bottom: 3rem;
}
#service .service .service_contents ul li.reverse .contents_box {
  flex-flow: row-reverse;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li.reverse .contents_box {
    flex-flow: column-reverse;
  }
}
#service .service .service_contents ul li .contents_box {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box {
    flex-flow: column-reverse;
  }
}
#service .service .service_contents ul li .contents_box .list_writing {
  width: 50%;
  padding: 3vw;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box .list_writing {
    width: 100%;
  }
}
#service .service .service_contents ul li .contents_box .list_writing h2 {
  font-size: 1.5rem;
  padding-bottom: 0.5rem;
  color: #ff5300;
  margin-bottom: 1.5rem;
  background-image: repeating-linear-gradient(-45deg, #ff9393 0, #ff9393 2px, transparent 2px, transparent 4px, #ffbf7f 4px, #ffbf7f 6px, transparent 6px, transparent 8px, #ff7fff 8px, #ff7fff 10px, transparent 10px, transparent 12px, #7f7fff 12px, #7f7fff 14px, transparent 14px, transparent 16px, #7fffff 16px, #7fffff 18px, transparent 18px, transparent 20px, #bfff7f 20px, #bfff7f 22px, transparent 22px, transparent 24px, #ffff7f 24px, #ffff7f 26px, transparent 26px, transparent 28px);
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: 100% 5px;
}
#service .service .service_contents ul li .contents_box .list_writing p {
  color: #333;
}
#service .service .service_contents ul li .contents_box .list_writing p i {
  color: #64b200;
  padding-right: 0.5rem;
}
#service .service .service_contents ul li .contents_box .list_writing ul.list_ul li.list_li {
  font-size: 1.2rem;
  padding: 0.25rem 0;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box .list_writing ul.list_ul li.list_li {
    font-size: 1rem;
  }
}
#service .service .service_contents ul li .contents_box .list_writing .two li.list_li {
  border-bottom: dotted 2px #ff5300;
}
#service .service .service_contents ul li .contents_box .list_writing .two li.list_li i {
  color: #ff5300;
  padding-right: 0.5rem;
}
#service .service .service_contents ul li .contents_box .list_writing .three li.list_li {
  border-bottom: dotted 2px #64b200;
}
#service .service .service_contents ul li .contents_box .list_writing .three li.list_li i {
  color: #64b200;
  padding-right: 0.5rem;
}
#service .service .service_contents ul li .contents_box .list_writing .five li.list_li {
  border-bottom: dotted 2px #64b200;
}
#service .service .service_contents ul li .contents_box .list_writing .five li.list_li i {
  color: #64b200;
  padding-right: 0.5rem;
}
#service .service .service_contents ul li .contents_box .list_image {
  width: 50%;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box .list_image {
    width: 100%;
  }
}
#service .service .service_contents ul li .contents_box .list_image img {
  width: 100%;
  vertical-align: middle;
  border-style: none;
}
#service .service .service_contents ul li .contents_box2 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 2vw;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box2 {
    flex-flow: column-reverse;
    margin-bottom: 6vw;
  }
}
#service .service .service_contents ul li .contents_box2 .list_writing {
  width: 100%;
  padding: 3vw;
  font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box2 .list_writing {
    width: 100%;
    font-size: 1rem;
  }
}
#service .service .service_contents ul li .contents_box2 .list_writing h2 {
  font-size: 1.5rem;
  color: #fff;
  background-color: #ff5300;
  text-align: center;
  margin-bottom: 1.5rem;
  padding: 0.5rem 0;
}
#service .service .service_contents ul li .contents_box2 .list_writing dl dt {
  color: #fff;
  font-size: 1.2rem;
  display: inline-block;
  margin-right: 0.5rem;
  border-radius: 0.5rem;
  padding: 0.5rem 0;
  width: 100px;
  text-align: center;
  margin-bottom: 1rem;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box2 .list_writing dl dt {
    font-size: 1rem;
    margin-bottom: 0.5rem;
    display: block;
  }
}
#service .service .service_contents ul li .contents_box2 .list_writing dl dd {
  display: inline-block;
  padding-bottom: 1rem;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box2 .list_writing dl dd {
    display: block;
  }
}
#service .service .service_contents ul li .contents_box2 .list_writing .border-sen {
  background-color: rgba(146, 209, 79, 0.15);
  border-radius: 1rem;
  padding: 2rem;
  margin-top: 1rem;
}
#service .service .service_contents ul li .contents_box2 .list_writing p {
  color: #333;
}
#service .service .service_contents ul li .contents_box2 .list_writing p i {
  color: #64b200;
  padding-right: 0.5rem;
}
#service .service .service_contents ul li .contents_box2 .list_writing .two li.list_li {
  font-size: 1.2rem;
  padding: 0.25rem 0;
  border-bottom: dotted 2px #ff5300;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents ul li .contents_box2 .list_writing .two li.list_li {
    font-size: 1rem;
  }
}
#service .service .service_contents ul li .contents_box2 .list_writing .two li.list_li i {
  color: #ff5300;
  padding-right: 0.5rem;
}
#service .service .service_contents .service_p {
  font-size: 1.2rem;
  text-align: center;
  display: table;
  margin: 0 auto;
  background-color: rgba(255, 192, 0, 0.15);
  border-radius: 1rem;
  padding: 3rem;
  margin-bottom: 5rem;
}
@media screen and (max-width: 768px) {
  #service .service .service_contents .service_p {
    width: 90%;
    font-size: 1rem;
    text-align: left;
    padding: 1.5rem;
  }
}

#company #philosophy {
  width: 80%;
  margin: 3rem auto;
  border: 2px solid #002b54;
  border-radius: 10px;
  padding: 2rem;
}
@media screen and (max-width: 768px) {
  #company #philosophy {
    width: 95%;
  }
}
#company #philosophy h2 {
  text-align: center;
  border-bottom: 1px solid #002b54;
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}
#company #philosophy p {
  text-align: center;
}
@media screen and (max-width: 768px) {
  #company #philosophy p {
    text-align: left;
  }
}
#company .company {
  padding: 4vw 0;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #company .company {
    padding: 6vw 0;
  }
}
@media screen and (max-width: 768px) {
  #company .company {
    padding: 12vw 0;
  }
}
#company .company .company_contents {
  width: 80%;
  margin: auto;
  padding: 5vw;
  margin-bottom: 2rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #company .company .company_contents {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #company .company .company_contents {
    width: 95%;
  }
}
#company .company .company_contents h3 {
  font-size: 1.8rem;
  color: #ff0000;
  text-align: center;
  margin-bottom: 2rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #company .company .company_contents h3 {
    font-size: 3vw;
  }
}
@media screen and (max-width: 768px) {
  #company .company .company_contents h3 {
    font-size: 6vw;
  }
}
#company .company .company_contents h3 i {
  margin-right: 0.5rem;
}
#company .company .company_contents table {
  width: 100%;
  margin: auto;
  margin-bottom: 2vw;
  border-collapse: collapse;
  border: solid 5px #ffffe5;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #company .company .company_contents table {
    width: 100%;
    margin-bottom: 3vw;
  }
}
@media screen and (max-width: 768px) {
  #company .company .company_contents table {
    width: 100%;
    margin-bottom: 6vw;
  }
}
#company .company .company_contents table tr {
  color: #333;
  background-color: rgba(255, 255, 0, 0.1);
}
#company .company .company_contents table tr:nth-child(even) {
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  #company .company .company_contents table tr {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-flow: column;
  }
}
#company .company .company_contents table tr th, #company .company .company_contents table tr td {
  padding: 1rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #company .company .company_contents table tr th, #company .company .company_contents table tr td {
    padding: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #company .company .company_contents table tr th, #company .company .company_contents table tr td {
    text-align: start;
  }
}
#company .company .company_contents table tr th {
  width: 30%;
}
@media screen and (max-width: 768px) {
  #company .company .company_contents table tr th {
    width: 100%;
    padding-bottom: 0.5rem;
  }
}
#company .company .company_contents table tr td {
  width: 70%;
}
@media screen and (max-width: 768px) {
  #company .company .company_contents table tr td {
    width: 100%;
    padding-top: 1.5vw;
  }
}
#company .company .company_contents .map {
  width: 100%;
}
#company .company .company_contents .map iframe {
  width: 100%;
}

#sales {
  padding: 5vw;
}
#sales .sales h3 {
  font-size: 1.6vw;
  text-align: center;
  margin-bottom: 2rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #sales .sales h3 {
    font-size: 3vw;
  }
}
@media screen and (max-width: 768px) {
  #sales .sales h3 {
    font-size: 6vw;
  }
}
#sales .sales h3 i {
  margin-right: 0.5rem;
}
#sales .sales ul {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  #sales .sales ul {
    flex-flow: column;
  }
}
#sales .sales ul li {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 45%;
  margin-bottom: 2vw;
  padding-bottom: 1vw;
  border-bottom: 1px solid #333333;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #sales .sales ul li {
    width: 48%;
  }
}
@media screen and (max-width: 768px) {
  #sales .sales ul li {
    width: 100%;
  }
}
#sales .sales ul li .sales_name {
  width: 40%;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #sales .sales ul li .sales_name h4 {
    font-size: 2vw;
  }
}
@media screen and (max-width: 768px) {
  #sales .sales ul li .sales_name h4 {
    font-size: 3.3vw;
  }
}
#sales .sales ul li .sales_contents {
  width: 60%;
}
#sales .sales ul li .sales_contents p {
  margin-bottom: 0.5vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #sales .sales ul li .sales_contents .tel {
    font-size: 1.6vw;
  }
}
@media screen and (max-width: 768px) {
  #sales .sales ul li .sales_contents .tel {
    font-size: 3.3vw;
  }
}
#sales .sales ul li .sales_contents .tel i {
  margin-right: 0.25rem;
}

#history {
  background: rgba(221, 238, 255, 0.8);
  padding: 5vw;
}
#history .history h3 {
  font-size: 1.6vw;
  text-align: center;
  margin-bottom: 2rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #history .history h3 {
    font-size: 3vw;
  }
}
@media screen and (max-width: 768px) {
  #history .history h3 {
    font-size: 6vw;
  }
}
#history .history h3 i {
  margin-right: 0.5rem;
}
#history .history #history_text {
  padding: 2.5vw;
  width: 45vw;
  margin: auto;
  margin-bottom: 2rem;
  min-width: 500px;
  background: rgba(34, 51, 68, 0.07);
  border: 1px solid rgba(34, 51, 68, 0.4);
}
#history .history #history_text p {
  color: #333;
}
#history .history table {
  width: 100%;
}
#history .history table tr {
  margin-bottom: 2vw;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 1px solid #333333;
}
@media screen and (max-width: 768px) {
  #history .history table tr {
    width: 100%;
    margin-bottom: 6vw;
  }
}
#history .history table tr th, #history .history table tr td {
  padding: 1.5rem 0.5rem 0.5rem;
  margin-bottom: 1vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #history .history table tr th, #history .history table tr td {
    font-size: 1.6vw;
  }
}
@media screen and (max-width: 768px) {
  #history .history table tr th, #history .history table tr td {
    font-size: 3.3vw;
  }
}
#history .history table tr th {
  width: 30%;
}
#history .history table tr td {
  width: 70%;
}

#policy {
  margin: auto;
  padding: 5vw;
}
#policy h2 {
  font-size: 18px;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #policy h2 {
    font-size: 15px;
  }
}
#policy p {
  font-size: 15px;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  #policy p {
    font-size: 10px;
  }
}

#recruit {
  margin-bottom: 8vw;
}
#recruit .recruit .recruit_text {
  margin-bottom: 8vw;
}
#recruit .recruit .recruit_text p {
  line-height: 3vw;
  font-size: 1.2vw;
}
#recruit .recruit .recruit_contents {
  width: 90%;
  margin: auto;
  margin-bottom: 8vw;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  #recruit .recruit .recruit_contents {
    flex-flow: column;
  }
}
#recruit .recruit .recruit_contents .recruit_content {
  background: rgb(255, 255, 255);
  border: 1px solid #003e6d;
  border-radius: 10px;
  width: 48%;
  padding: 1rem;
}
@media screen and (max-width: 768px) {
  #recruit .recruit .recruit_contents .recruit_content {
    width: 95%;
    margin: 2rem auto;
  }
}
#recruit .recruit .recruit_contents .recruit_content h2 {
  font-size: 130%;
  color: #fff;
  background: rgba(89, 136, 198, 0.8);
  padding: 0.5rem;
}
#recruit .recruit .recruit_contents .recruit_content div {
  width: 100%;
}
#recruit .recruit .recruit_contents .recruit_content div dl {
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid rgba(0, 43, 84, 0.3);
  padding: 1.5rem 0.8rem;
}
@media screen and (max-width: 768px) {
  #recruit .recruit .recruit_contents .recruit_content div dl {
    flex-flow: column;
  }
}
#recruit .recruit .recruit_contents .recruit_content div dl dt, #recruit .recruit .recruit_contents .recruit_content div dl dd {
  color: #333;
  padding: 0.25rem;
}
#recruit .recruit .recruit_contents .recruit_content div dl dt {
  width: 30%;
  font-weight: 600;
  text-align: right;
  padding: 0.25rem 0.5rem;
}
@media screen and (max-width: 768px) {
  #recruit .recruit .recruit_contents .recruit_content div dl dt {
    width: 100%;
    margin-bottom: 0.5rem;
  }
}
#recruit .recruit .recruit_contents .recruit_content div dl dd {
  width: 70%;
  padding: 0.25rem 1rem;
}
@media screen and (max-width: 768px) {
  #recruit .recruit .recruit_contents .recruit_content div dl dd {
    width: 100%;
  }
}
#recruit .recruit_btn {
  width: 80%;
  margin: auto;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit .recruit_btn {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #recruit .recruit_btn {
    width: 95%;
  }
}
#recruit .recruit_btn a {
  text-decoration: none;
}
#recruit .recruit_btn a button {
  width: 100%;
  color: #fff;
  font-size: 120%;
  background-color: #0069d9;
  border: 1px solid #003e6d;
  padding: 0.5rem;
  transition: all 0.4s;
  border: none;
  border-radius: 10px;
}
#recruit .recruit_btn a button:hover {
  opacity: 0.7;
}

#recruit_form .recruit_form {
  width: 80%;
  margin: auto;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form {
    width: 95%;
  }
}
#recruit_form .recruit_form .recruit_form_text {
  margin-bottom: 2rem;
}
#recruit_form .recruit_form .recruit_form_text p {
  text-align: center;
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form .recruit_form_text p {
    text-align: left;
  }
}
#recruit_form .recruit_form form {
  width: 100%;
  margin-bottom: 8vw;
}
#recruit_form .recruit_form form table {
  width: 100%;
  margin-bottom: 40px;
  border-collapse: collapse;
  border-top: 1px solid #333;
}
#recruit_form .recruit_form form table tr {
  border-bottom: 1px solid #333;
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr {
    display: flex;
    flex-flow: column;
  }
}
#recruit_form .recruit_form form table tr th, #recruit_form .recruit_form form table tr td {
  font-size: 1vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr th, #recruit_form .recruit_form form table tr td {
    font-size: 1.4vw;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr th, #recruit_form .recruit_form form table tr td {
    font-size: 3.3vw;
  }
}
#recruit_form .recruit_form form table tr th {
  padding: 40px 0;
  width: 35%;
  text-align: end;
  padding-right: 80px;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr th {
    width: 45%;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr th {
    width: 100%;
    border-bottom: none;
    text-align: start;
    padding: 10px 0;
    padding-top: 20px;
    padding-left: 0px;
  }
}
#recruit_form .recruit_form form table tr th .red {
  color: #fff;
  padding: 10px;
  background-color: red;
  margin-left: 20px;
}
#recruit_form .recruit_form form table tr th .blue {
  color: #fff;
  padding: 10px;
  background-color: blue;
  margin-left: 20px;
}
#recruit_form .recruit_form form table tr td {
  padding: 40px 0;
  width: 65%;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr td {
    width: 55%;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr td {
    width: 100%;
    padding: 10px 0;
    padding-bottom: 20px;
    padding-right: 0;
  }
}
#recruit_form .recruit_form form table tr td .mushroom input {
  width: 1vw;
  height: 1vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr td .mushroom input {
    width: 2vw;
    height: 2vw;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr td .mushroom input {
    width: 4vw;
    height: 4vw;
  }
}
#recruit_form .recruit_form form table tr td .number {
  margin-top: 2vw;
}
#recruit_form .recruit_form form table tr td input {
  width: 80%;
  height: 50px;
  padding-left: 5px;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr td input {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr td input {
    width: 100%;
  }
}
#recruit_form .recruit_form form table tr td textarea {
  width: 80%;
  height: 120px;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr td textarea {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr td textarea {
    width: 100%;
  }
}
#recruit_form .recruit_form form table tr.tel-number td input {
  width: 20% !important;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr.tel-number td input {
    width: 25% !important;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr.tel-number td input {
    width: 29% !important;
  }
}
#recruit_form .recruit_form form table tr:first-child td,
#recruit_form .recruit_form form table tr:last-child td {
  display: flex;
  width: 100%;
}
#recruit_form .recruit_form form table tr:first-child td .mwform-radio-field,
#recruit_form .recruit_form form table tr:last-child td .mwform-radio-field {
  width: 35%;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr:first-child td .mwform-radio-field,
  #recruit_form .recruit_form form table tr:last-child td .mwform-radio-field {
    width: 45%;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr:first-child td .mwform-radio-field,
  #recruit_form .recruit_form form table tr:last-child td .mwform-radio-field {
    width: 45%;
  }
}
#recruit_form .recruit_form form table tr:first-child td .mwform-radio-field label,
#recruit_form .recruit_form form table tr:last-child td .mwform-radio-field label {
  display: flex;
  height: 20px;
}
#recruit_form .recruit_form form table tr:first-child td .mwform-radio-field input,
#recruit_form .recruit_form form table tr:last-child td .mwform-radio-field input {
  width: 10%;
  height: 100%;
}
#recruit_form .recruit_form form table tr:first-child td .mwform-radio-field .mwform-radio-field-text,
#recruit_form .recruit_form form table tr:last-child td .mwform-radio-field .mwform-radio-field-text {
  display: inline-block;
  height: 100%;
}
#recruit_form .recruit_form form table tr:nth-child(5) th span {
  background-color: blue;
}
#recruit_form .recruit_form form table tr:nth-child(5) td input {
  width: 20% !important;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #recruit_form .recruit_form form table tr:nth-child(5) td input {
    width: 25% !important;
  }
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form table tr:nth-child(5) td input {
    width: 29% !important;
  }
}
#recruit_form .recruit_form form .agree {
  text-align: center;
  margin: 20px 0;
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form .agree {
    margin: 10px 0;
  }
}
#recruit_form .recruit_form form .submit {
  text-align: center;
}
#recruit_form .recruit_form form .submit input {
  padding: 20px 180px;
  font-size: 18px;
  border: none;
  background: #0069d9;
  color: #fff;
  transition: all 0.4s;
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form .submit input {
    padding: 10px 90px;
  }
}
#recruit_form .recruit_form form .submit input:hover {
  opacity: 0.7;
}
#recruit_form .recruit_form form .submit input[name=submitBack] {
  padding: 20px 90px;
  margin-right: 40px;
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form .submit input[name=submitBack] {
    padding: 10px 45px;
    margin-right: 10px;
    margin-bottom: 20px;
    font-size: 12.5px;
  }
}
#recruit_form .recruit_form form .submit input[name=confirm] {
  padding: 20px 90px;
}
@media screen and (max-width: 768px) {
  #recruit_form .recruit_form form .submit input[name=confirm] {
    padding: 10px 45px;
    margin-bottom: 20px;
    font-size: 12.5px;
  }
}

#news .news .news_contents {
  width: 80%;
  margin: auto;
}
@media screen and (max-width: 768px) {
  #news .news .news_contents {
    width: 95%;
  }
}
#news .news .news_contents p {
  text-align: center;
  margin-bottom: 3rem;
}
@media screen and (max-width: 768px) {
  #news .news .news_contents p {
    margin-bottom: 8vw;
  }
}
#news .news .news_contents ul {
  width: 70%;
  list-style: none;
}
@media screen and (max-width: 768px) {
  #news .news .news_contents ul {
    width: 100%;
  }
}
#news .news .news_contents ul a {
  display: block;
  text-decoration: none;
  margin-bottom: 2vw;
}
#news .news .news_contents ul a li {
  display: flex;
  justify-content: start;
  align-items: flex-start;
  border-bottom: 1px dotted #333;
}
@media screen and (max-width: 768px) {
  #news .news .news_contents ul a li {
    flex-flow: column;
  }
}
#news .news .news_contents ul a .date {
  font-size: 1vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news .news .news_contents ul a .date {
    font-size: 1.2vw;
  }
}
@media screen and (max-width: 768px) {
  #news .news .news_contents ul a .date {
    font-size: 2.5vw;
    width: 20%;
  }
}
#news .news .news_contents ul a .outline {
  margin-left: 3vw;
}
#news .news .news_contents ul a .outline .sp_title {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 0.25rem;
}
#news .news .news_contents ul a .outline .sp_title .title {
  margin-right: 1vw;
  font-size: 1.2vw;
  font-weight: 600;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news .news .news_contents ul a .outline .sp_title .title {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 768px) {
  #news .news .news_contents ul a .outline .sp_title .title {
    font-size: 3.3vw;
  }
}
@media screen and (max-width: 768px) {
  #news .news .news_contents ul a .outline .sp_title i {
    font-size: 3vw;
  }
}
#news .news .news_contents ul a .outline .descn p {
  font-size: 1vw;
  margin-bottom: 0.5rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news .news .news_contents ul a .outline .descn p {
    font-size: 1.2vw;
  }
}
@media screen and (max-width: 768px) {
  #news .news .news_contents ul a .outline .descn p {
    font-size: 2.5vw;
  }
}

.navigation {
  margin-top: 4vw;
  margin-bottom: 2vw;
  text-align: center;
}
.navigation .current {
  border: none;
}
.navigation a {
  border: none;
  color: #333333;
}

.wp-pagenavi a, .wp-pagenavi span {
  border: none !important;
  margin-left: 20px !important;
}

#news_single .news_single {
  margin-bottom: 4vw;
}
#news_single .news_single .news_contents {
  width: 80%;
  margin: auto;
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents {
    width: 95%;
  }
}
#news_single .news_single .news_contents h4 {
  text-align: center;
  margin-bottom: 3rem;
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents h4 {
    margin-bottom: 8vw;
  }
}
#news_single .news_single .news_contents ul {
  width: 70%;
  list-style: none;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news_single .news_single .news_contents ul {
    width: 80%;
  }
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents ul {
    width: 100%;
  }
}
#news_single .news_single .news_contents ul li {
  display: block;
  text-decoration: none;
  margin-bottom: 2vw;
}
#news_single .news_single .news_contents ul li .outline .date {
  font-size: 0.8vw;
  margin-bottom: 1vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news_single .news_single .news_contents ul li .outline .date {
    font-size: 1.2vw;
    margin-bottom: 1.4vw;
  }
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents ul li .outline .date {
    font-size: 2.5vw;
    margin-bottom: 2.5vw;
  }
}
#news_single .news_single .news_contents ul li .outline .sp_title {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 1.5vw;
  border-bottom: 1px solid #333;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news_single .news_single .news_contents ul li .outline .sp_title {
    margin-bottom: 2vw;
  }
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents ul li .outline .sp_title {
    margin-bottom: 4vw;
  }
}
#news_single .news_single .news_contents ul li .outline .sp_title .title {
  margin-right: 1vw;
  font-size: 1.4vw;
  font-weight: 600;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news_single .news_single .news_contents ul li .outline .sp_title .title {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents ul li .outline .sp_title .title {
    font-size: 3.3vw;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news_single .news_single .news_contents ul li .outline .sp_title i {
    font-size: 1.6vw;
  }
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents ul li .outline .sp_title i {
    font-size: 3vw;
  }
}
#news_single .news_single .news_contents ul li .outline .descn p {
  color: #333;
  font-size: 1vw;
  line-height: 2vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #news_single .news_single .news_contents ul li .outline .descn p {
    font-size: 1.2vw;
    line-height: 2.5vw;
  }
}
@media screen and (max-width: 768px) {
  #news_single .news_single .news_contents ul li .outline .descn p {
    font-size: 2.5vw;
    line-height: 4vw;
  }
}

#contact .contact {
  width: 80%;
  margin: auto;
  margin-bottom: 5rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #contact .contact {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #contact .contact {
    width: 95%;
  }
}
#contact .contact .contact_text {
  margin-bottom: 8vw;
}
#contact .contact .contact_text p {
  line-height: 3vw;
  font-size: 1.2vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #contact .contact .contact_text p {
    font-size: 1.4vw;
    line-height: 4vw;
  }
}
@media screen and (max-width: 768px) {
  #contact .contact .contact_text p {
    font-size: 3.3vw;
    line-height: 6vw;
  }
}
#contact .contact .form {
  width: 100%;
  margin-bottom: 8vw;
}
#contact .contact .form p.main {
  text-align: center;
  padding: 3rem 0;
}
@media screen and (max-width: 768px) {
  #contact .contact .form p.main {
    text-align: left;
  }
}
#contact .contact .form .wpcf7 {
  color: #333;
  background-color: rgba(255, 255, 0, 0.1);
  padding: 5rem;
  border-radius: 10px;
  margin: auto;
}
@media screen and (max-width: 768px) {
  #contact .contact .form .wpcf7 {
    padding: 1.5rem;
  }
}
#contact .contact .form .wpcf7 label {
  display: block;
  margin-bottom: 2rem;
  font-size: 100%;
  font-weight: 600;
  color: #333333;
}
#contact .contact .form .wpcf7 label .red {
  background-color: #ff0000;
  color: #fff;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 10px;
  font-size: 80%;
}
#contact .contact .form .wpcf7 label .blue {
  background-color: #2986ff;
  color: #fff;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 10px;
  font-size: 80%;
}
#contact .contact .form .wpcf7 label .wpcf7-form-control-wrap input {
  width: 100%;
  margin-top: 1rem;
  padding: 1rem;
}
#contact .contact .form .wpcf7 label textarea {
  width: 100%;
  padding: 1rem;
  border: 1px solid #cccccc;
  border-radius: 5px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  background-color: #ffffff;
  height: 250px;
  resize: vertical;
}
#contact .contact .form .wpcf7 label.policy {
  text-align: center;
}
#contact .contact .form .wpcf7 label.policy input {
  width: auto;
}
#contact .contact .form .wpcf7 .wpcf7 input[type=url], #contact .contact .form .wpcf7 .wpcf7 input[type=email], #contact .contact .form .wpcf7 .wpcf7 input[type=tel] {
  padding: 2rem;
  margin-bottom: 2rem;
  height: 20px;
}
#contact .contact .form .wpcf7 input[type=submit] {
  color: #fff;
  background-color: #bf0707;
  cursor: pointer;
  transition: background-color 0.4s ease;
  border: none;
  width: 80%;
  margin: auto 10%;
  font-size: 120%;
  font-weight: 600;
  padding: 1rem;
  border-radius: 10px;
}
#contact .contact .form .wpcf7 input[type=submit]:hover {
  opacity: 0.7;
}
#contact .contact .form .wpcf7 .wpcf7-response-output {
  font-size: 160%;
  text-align: center;
  padding: 1rem;
  color: #333;
  font-weight: 600;
}
#contact .contact .form .wpcf7 .wpcf7-form-control {
  padding: 0.5rem 1rem;
  margin-bottom: 2rem;
}
#contact .contact .form .thanks {
  text-align: center;
  font-size: 140%;
}
@media screen and (max-width: 768px) {
  #contact .contact .form .thanks {
    text-align: left;
    font-size: 100%;
  }
}

#evaluation {
  overflow: hidden;
  padding: 3rem 0;
  background-size: cover;
  background-position: center;
}
#evaluation .evaluation {
  width: 85%;
  margin: 0 auto;
  padding: 3rem 3rem;
  background-color: rgba(255, 255, 255, 0.75);
  border-radius: 1rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #evaluation .evaluation {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #evaluation .evaluation {
    width: 90%;
    padding: 1.5rem;
  }
}
#evaluation .evaluation h1 {
  color: #ff5300;
  text-align: center;
  margin-bottom: 2rem;
  display: table;
  margin: 0 auto 2rem auto;
  border-bottom: solid 3px #ff5300;
  padding: 0 3rem;
}
#evaluation .evaluation h2 {
  text-align: center;
  margin-bottom: 2rem;
}
#evaluation .evaluation .evaluation_list {
  display: flex;
  flex-wrap: wrap;
  width: 85%;
  margin: 0 auto;
  list-style: none;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #evaluation .evaluation .evaluation_list {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  #evaluation .evaluation .evaluation_list {
    width: 90%;
  }
}
#evaluation .evaluation .evaluation_list li {
  width: 33.3333333333%;
  padding: 0 0.5rem;
}
@media screen and (max-width: 768px) {
  #evaluation .evaluation .evaluation_list li {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#evaluation .evaluation .evaluation_list li a {
  color: #fff;
  padding: 0.5rem 0;
  display: block;
  background-color: #666;
  text-decoration: none;
  text-align: center;
  border-radius: 1rem;
  transition: all 0.4s;
}
#evaluation .evaluation .evaluation_list li a:hover {
  opacity: 0.75;
}

#footer_contact {
  position: relative;
}
#footer_contact .footer_contact {
  width: 100%;
  background-size: cover;
  background-position: center;
  position: relative;
}
#footer_contact .footer_contact::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 10;
}
#footer_contact .footer_contact_contents {
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  min-height: 30vw;
  padding: 2.5rem 5vw;
  text-shadow: 2px 2px 2px rgba(0, 34, 85, 0.9);
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents {
    width: 100%;
    left: 0;
  }
}
#footer_contact .footer_contact_contents div {
  position: relative;
  z-index: 15;
  width: 90%;
  margin: 0 auto;
}
#footer_contact .footer_contact_contents div .headline {
  color: #fff;
  margin-bottom: 2rem;
}
#footer_contact .footer_contact_contents div .headline h1 {
  font-size: 3vw;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .headline h1 {
    font-size: 6vw;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content {
    width: 100%;
    flex-flow: column;
    margin-bottom: 3rem;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel {
  width: 45%;
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel {
    width: 100%;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a {
  pointer-events: none;
  text-decoration: none;
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a {
    pointer-events: all;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a button {
  font-family: "Zen Maru Gothic", sans-serif;
  color: #ffffff;
  font-size: 250%;
  font-weight: 600;
  text-shadow: 2px 2px 2px rgba(0, 34, 85, 0.9);
  transition: all 0.4s;
  width: 100%;
  padding: 0.375rem 0.75rem;
  border: none;
  background-color: transparent;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a button {
    font-size: 140%;
  }
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a button {
    font-size: 180%;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a button:hover {
  opacity: 0.7;
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_tel a button i {
  font-size: 80%;
  margin-right: 0.5rem;
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form {
  width: 45%;
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form {
    margin-top: 4vw;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a {
  text-decoration: none;
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button {
  font-family: "Zen Maru Gothic", sans-serif;
  position: relative;
  color: #ffffff;
  font-size: 230%;
  font-weight: 600;
  text-shadow: 2px 2px 2px rgba(0, 34, 85, 0.9);
  transition: 0.5s ease-in-out;
  border: none;
  background-color: transparent;
  padding: 0.375rem 0.75rem;
  width: 100%;
}
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button {
    font-size: 200%;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button {
    font-size: 140%;
  }
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button {
    font-size: 140%;
  }
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button::after {
  content: "";
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  border: 1px solid #ffffff;
  border-top-width: 1px;
  z-index: 2;
  margin: 0px;
  border-radius: 1rem;
  transition: border-top-width 0.1s 0.2s, height 0.2s 0.1s, width 0.2s 0s, margin 0.2s 0s;
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button:hover::after {
  width: 68%;
  height: 0px;
  border-width: 0px 1px 1px;
  margin: 0px 17%;
  transition: border-top-width 0.1s 0s, height 0.2s 0.1s, width 0.2s 0.2s, margin 0.2s 0.2s;
}
#footer_contact .footer_contact_contents div .footer_contact_content .footer_contact_form a button i {
  font-size: 80%;
  margin-right: 0.5rem;
}
#footer_contact .footer_contact_contents div ul {
  list-style: none;
  margin-top: 1.5rem;
}
#footer_contact .footer_contact_contents div ul li {
  text-align: center;
  color: #fff;
  font-size: 120%;
  margin-bottom: 0.5vw;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  #footer_contact .footer_contact_contents div ul li {
    font-size: 90%;
  }
}
@media screen and (max-width: 768px) {
  #footer_contact .footer_contact_contents div ul li {
    text-align: center;
    font-size: 3vw;
    line-height: 1;
    margin-bottom: 2.5vw;
  }
}

footer {
  padding-top: 2vw;
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  footer {
    padding-top: 8vw;
  }
}
footer .footer_menu ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin: auto;
  list-style: none;
}
@media screen and (max-width: 768px) {
  footer .footer_menu ul {
    width: 95%;
    flex-wrap: wrap;
    padding-left: 0;
  }
}
footer .footer_menu ul li {
  flex: 0 0 auto;
  width: auto;
  font-size: 100%;
  padding: 0.5rem 0;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  footer .footer_menu ul li {
    font-size: 80%;
  }
}
@media screen and (max-width: 768px) {
  footer .footer_menu ul li {
    margin-bottom: 4vw;
  }
}
footer .footer_menu ul li a {
  color: #333;
  padding: 0 2vw;
}
@media screen and (max-width: 768px) {
  footer .footer_menu ul li a {
    font-size: 3vw;
    padding: 0 4vw;
  }
}
footer .footer_menu ul li a i {
  margin-right: 0.5rem;
}
footer .footer_menu ul li .new_twitter:before {
  content: "𝕏" !important;
  font-weight: bold;
}
footer .footer_menu ul li .sns-link {
  text-decoration: none;
}
footer .footer_logo_eria {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  color: #ffffff;
  margin: 1rem auto;
}
@media screen and (max-width: 768px) {
  footer .footer_logo_eria {
    flex-wrap: wrap;
  }
}
footer .footer_logo_eria .footer_logo_img {
  width: 30%;
  padding: 0 1rem;
}
@media screen and (max-width: 768px) {
  footer .footer_logo_eria .footer_logo_img {
    width: 80%;
  }
}
footer .footer_logo_eria .footer_logo_img img {
  width: 100%;
}
footer .footer_logo_eria .footer_logo_info {
  width: auto;
  padding: 0 1rem;
}
@media screen and (max-width: 768px) {
  footer .footer_logo_eria .footer_logo_info {
    width: 100%;
  }
}
footer .footer_logo_eria .footer_logo_info ul {
  list-style: none;
}
@media screen and (max-width: 768px) {
  footer .footer_logo_eria .footer_logo_info ul {
    text-align: center;
    margin-top: 0.5rem;
  }
}
footer .footer_logo_eria .footer_logo_info ul li {
  color: #333;
}
footer .footer_logo_eria .footer_logo_info ul li i {
  margin-right: 0.25rem;
}
footer .copyright {
  text-align: center;
  padding: 1vw 0;
  background: #fff;
}
@media screen and (max-width: 768px) {
  footer .copyright {
    padding-bottom: 16vw;
  }
}
footer .copyright div {
  text-align: center;
}
@media screen and (max-width: 768px) {
  footer .copyright div {
    padding-left: 0;
  }
}
footer .copyright div p {
  color: #333;
  font-size: 1rem;
}
@media screen and (max-width: 768px) {
  footer .copyright div p {
    padding: 1.5rem 0;
  }
}/*# sourceMappingURL=style.css.map */