@charset "UTF-8";
@font-face {
  font-family: "ttnorms";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../font/tt-norms-regular.woff2") format("woff2"), url("../font/tt-norms-regular.woff") format("woff");
}
@font-face {
  font-family: "ttnorms-medium";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../font/tt-norms-medium.woff2") format("woff2"), url("../font/tt-norms-medium.woff") format("woff");
}
@font-face {
  font-family: "ttnorms-bold";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../font/tt-norms-bold.woff2") format("woff2"), url("../font/tt-norms-bold.woff") format("woff");
}
/* --------------------------
 * reboot
-------------------------- */
* {
  box-sizing: border-box;
}
*::before, *::after {
  box-sizing: border-box;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}

body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #333333;
  text-align: left;
}

[tabindex="-1"]:focus {
  outline: 0 !important;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0;
}

p {
  margin-top: 0;
  margin-bottom: 0;
  display: block;
}

abbr[title], abbr[data-original-title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
}

address {
  margin-bottom: 1rem;
  font-style: normal;
  line-height: inherit;
}

ol, ul, dl {
  margin-top: 0;
  margin-bottom: 1rem;
}

ol ol, ul ul, ol ul, ul ol {
  margin-bottom: 0;
}

dt {
  font-weight: normal;
}

dd {
  margin-bottom: 0;
}

blockquote {
  margin: 0 0 1rem;
}

b, strong {
  font-weight: bolder;
}

small {
  font-size: 80%;
}

sub, sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

a {
  color: #333333;
  text-decoration: none;
  background-color: transparent;
}
a:hover {
  color: #ccc;
  text-decoration: underline;
}
a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none;
}
a:not([href]):not([tabindex]):hover {
  color: inherit;
  text-decoration: none;
}
a:not([href]):not([tabindex]):focus {
  color: inherit;
  text-decoration: none;
  outline: 0;
}

pre, code, kbd, samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 1em;
}

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
}

figure {
  margin: 0 0 1rem;
}

img {
  vertical-align: middle;
  border-style: none;
}

svg {
  overflow: hidden;
  vertical-align: middle;
}

table {
  border-collapse: collapse;
}

caption {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  color: #6c757d;
  text-align: left;
  caption-side: bottom;
}

th {
  text-align: inherit;
}

label {
  display: inline-block;
  margin-bottom: 0.5rem;
}

button {
  border-radius: 0;
}
button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color;
}

input, button, select, optgroup, textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button, input {
  overflow: visible;
}

button {
  text-transform: none;
}

select {
  text-transform: none;
  word-wrap: normal;
}

button, [type=button], [type=reset], [type=submit] {
  -webkit-appearance: button;
}

button:not(:disabled), [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled) {
  cursor: pointer;
}

button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

input[type=radio], input[type=checkbox] {
  box-sizing: border-box;
  padding: 0;
}
input[type=date], input[type=time], input[type=datetime-local], input[type=month] {
  -webkit-appearance: listbox;
}

textarea {
  overflow: auto;
  resize: vertical;
}

fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

legend {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: 0.5rem;
  font-size: 1.5rem;
  line-height: inherit;
  color: inherit;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  outline-offset: -2px;
  -webkit-appearance: none;
}
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}

output {
  display: inline-block;
}

summary {
  display: list-item;
  cursor: pointer;
}

template {
  display: none;
}

[hidden] {
  display: none !important;
}

/* --------------------------
 * adjustment
-------------------------- */
.cf {
  zoom: 1;
}
.cf:before {
  content: "";
  display: table;
}
.cf:after {
  content: "";
  display: table;
  clear: both;
}

.nowrap {
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bgCover {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
}

.radius {
  border-radius: 5px;
}

figure {
  margin: 0;
  padding: 0;
  display: block;
}
figure img {
  width: 100%;
  height: auto;
}

a {
  color: #000;
  text-decoration: none;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
}
a:hover, a:focus, a:active {
  text-decoration: none;
}
a.alpha {
  opacity: 1;
}
a.alpha img {
  opacity: 1;
  transition: opacity 0.5s ease;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  -ms-transition: opacity 0.3s ease;
}
a.alpha:hover {
  opacity: 0.75;
}
a.alpha:hover img {
  opacity: 0.75;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
  list-style-type: none;
}
ul li {
  margin: 0;
  padding: 0;
  display: block;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

dl {
  margin: 0%;
  padding: 0;
}
dl dt, dl dd {
  margin: 0%;
  padding: 0;
}

h1, h2, h3, h4, h5, p {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: 400;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

div, p, span {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

hr {
  border-top: 1px solid #dddddd;
  margin: 0;
  padding: 0;
}

.video {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
}

/* 16:9 */
.video169 {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  background-color: #333333;
  display: flex;
  justify-content: center;
  align-items: center;
}

.video169 iframe {
  width: 100%;
  height: 100%;
}

/* --------------------------
 * @keyframes
-------------------------- */
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes jamp {
  0% {
    transform: translateY(0px);
  }
  3% {
    transform: translateY(-10px);
  }
  6% {
    transform: translateY(0px);
  }
  100% {
    transform: translateX(0px);
  }
}
@keyframes leftin {
  0% {
    opacity: 0;
    transform: translateX(-25px);
  }
  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}
@keyframes topin {
  0% {
    opacity: 0;
    transform: translateY(-25px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes btmin {
  0% {
    opacity: 0;
    transform: translateY(25px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes scrl {
  0% {
    transform: translate(0, -100%);
  }
  50% {
    transform: translate(0, 0px);
  }
  100% {
    transform: translate(0, 100%);
  }
}
@keyframes rightin {
  0% {
    opacity: 0;
    transform: translateX(25px);
  }
  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}
@keyframes shake-up {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(15px);
  }
}
@keyframes fadeInText {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes linkAnime2 {
  0% {
    transform-origin: right top;
    transform: translateX(0);
  }
  50% {
    transform-origin: right top;
    transform: translateX(200%);
  }
  50.1% {
    transform-origin: left top;
    transform: translateX(-200%);
  }
  100% {
    transform: translateX(0);
  }
}
/* --------------------------
 * font
-------------------------- */
body {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic", "ヒラギノ角ゴ W3", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", Meiryo, sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.wf {
  font-family: "ttnorms", sans-serif;
  font-weight: 400;
}

.wfm {
  font-family: "ttnorms-medium", sans-serif;
  font-weight: 400;
}

.wfb {
  font-family: "ttnorms-bold", sans-serif;
  font-weight: 400;
}

.w300 {
  font-weight: 300;
}

.w500 {
  font-weight: 500;
}

.w600 {
  font-weight: 600;
}

.w700 {
  font-weight: 700;
}

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

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

/* --------------------------
* font size
-------------------------- */
html {
  font-size: 62.5%;
  width: 100%;
}

body {
  line-height: 1.6;
  color: #333333;
  position: relative;
  min-height: 600px;
  font-size: 1.6rem;
  background-color: #F2F2E2;
  background-image: url(../images/common/noise.jpg);
  background-position: center;
  background-size: 200px;
  background-repeat: repeat;
  overflow-x: hidden;
}
@media screen and (max-width: 767px) {
  body {
    font-size: 1.5rem;
  }
}

a {
  color: #333333;
  transition: 0.3s ease all;
}
a:hover {
  color: #333333;
}

/* --------------------------
* flame
-------------------------- */
.pc_dspl {
  display: block !important;
}
@media screen and (max-width: 767px) {
  .pc_dspl {
    display: none !important;
  }
}

.sp_dspl {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .sp_dspl {
    display: block !important;
  }
}

/* pc width min */
@media screen and (min-width: 1080px) {
  body, html {
    width: 100%;
    min-height: 600px;
    -webkit-text-size-adjust: 100%;
  }
  html {
    overflow-x: hidden;
  }
}
/* smartphone */
@media screen and (max-width: 1080px) {
  body {
    -webkit-text-size-adjust: 100%;
    -webkit-overflow-scrolling: touch;
    display: block;
    position: relative;
    width: 100%;
    min-width: auto;
    overflow-x: hidden;
  }
  html {
    -webkit-text-size-adjust: 100%;
    -webkit-overflow-scrolling: touch;
    display: block;
    position: relative;
    width: 100%;
    min-width: auto;
    overflow-x: hidden;
  }
}
/* --------------------------
* container
-------------------------- */
.container {
  position: relative;
  display: block;
  max-width: 1280px;
  margin: 0 auto;
}
@media screen and (max-width: 1440px) {
  .container {
    max-width: 1024px;
  }
}
@media screen and (max-width: 1200px) {
  .container {
    margin: 0 auto;
    width: 960px;
  }
}
@media screen and (max-width: 1024px) {
  .container {
    margin: 0 50px;
    width: auto;
  }
}
@media screen and (max-width: 767px) {
  .container {
    margin: 0 16px;
    width: auto;
  }
}
.container.min {
  max-width: 1024px;
}
@media screen and (max-width: 1024px) {
  .container.min {
    margin: 0 auto;
    width: 800px;
  }
}
@media screen and (max-width: 960px) {
  .container.min {
    margin: 0 50px;
    width: auto;
  }
}
@media screen and (max-width: 767px) {
  .container.min {
    margin: 0 16px;
    width: auto;
  }
}
.container.flex {
  display: flex;
}
.container.reverse {
  flex-flow: row-reverse;
}
@media screen and (max-width: 900px) {
  .container.reverse {
    flex-flow: inherit;
  }
}

/* --------------------------
* flexbox wrap
-------------------------- */
.flexWrap {
  display: flex;
  flex-wrap: wrap;
}
.flexWrap.col-3 {
  margin: 0 -25px;
}
@media screen and (max-width: 1440px) {
  .flexWrap.col-3 {
    margin: 0 -15px;
  }
}
@media screen and (max-width: 767px) {
  .flexWrap.col-3 {
    margin: 0px -5px;
  }
}
.flexWrap.col-3 .item {
  padding: 0 25px 50px;
  width: 33.3333%;
}
@media screen and (max-width: 1440px) {
  .flexWrap.col-3 .item {
    padding: 0 15px 40px;
  }
}
@media screen and (max-width: 960px) {
  .flexWrap.col-3 .item {
    padding: 0 15px 40px;
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .flexWrap.col-3 .item {
    padding: 0 5px 35px;
    width: 50%;
  }
}
.flexWrap.col-3 .item__inner {
  display: block;
}
.flexWrap.col-4 {
  margin: 0 -10px;
}
@media screen and (max-width: 1440px) {
  .flexWrap.col-4 {
    margin: 0 -15px;
  }
}
@media screen and (max-width: 767px) {
  .flexWrap.col-4 {
    margin: 0px -5px;
  }
}
.flexWrap.col-4 .item {
  padding: 0 10px 50px;
  width: 25%;
}
@media screen and (max-width: 1440px) {
  .flexWrap.col-4 .item {
    width: 33.3333%;
    padding: 0 15px 40px;
  }
}
@media screen and (max-width: 960px) {
  .flexWrap.col-4 .item {
    padding: 0 15px 40px;
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .flexWrap.col-4 .item {
    padding: 0 5px 35px;
    width: 50%;
  }
}
.flexWrap.col-4 .item__inner {
  display: block;
}
.flexWrap.center {
  justify-content: center;
}
.flexWrap.reverse {
  flex-flow: row-reverse;
}

/* --------------------------
* crumbs
-------------------------- */
.crumbs {
  position: relative;
  height: 30px;
  line-height: 30px;
  display: flex;
  gap: 36px;
}
@media screen and (max-width: 1536px) {
  .crumbs {
    gap: 30px;
  }
}
@media screen and (max-width: 1366px) {
  .crumbs {
    gap: 24px;
  }
}
.crumbs.color li {
  color: #333333;
}
.crumbs.color li::before {
  background-color: #0DB8D9;
}
.crumbs.color li a {
  color: #333333;
}
.crumbs li {
  position: relative;
  color: #FFFFFF;
  font-size: 1.4rem;
  display: block;
  height: 30px;
}
@media screen and (max-width: 1920px) {
  .crumbs li {
    font-size: 0.73vw;
  }
}
@media screen and (max-width: 1536px) {
  .crumbs li {
    font-size: 0.9vw;
  }
}
@media screen and (max-width: 1200px) {
  .crumbs li {
    font-size: 1.3rem;
  }
}
@media screen and (max-width: 767px) {
  .crumbs li {
    font-size: 1.1rem;
  }
}
.crumbs li::before {
  content: "";
  height: 4px;
  width: 4px;
  background-color: #FFFFFF;
  transform: rotate(30deg);
  position: absolute;
  top: 15px;
  right: -21px;
  border-radius: 2.5px;
}
@media screen and (max-width: 1536px) {
  .crumbs li::before {
    right: -18px;
    top: 14px;
  }
}
@media screen and (max-width: 1366px) {
  .crumbs li::before {
    right: -14px;
    top: 15px;
    height: 3px;
    width: 3px;
  }
}
.crumbs li a {
  color: #FFFFFF;
}
.crumbs li a img {
  width: 13px;
  height: auto;
  line-height: 1;
  position: relative;
  top: -2px;
}
@media screen and (max-width: 767px) {
  .crumbs li a img {
    width: 11px;
  }
}
.crumbs li a:hover {
  opacity: 0.5;
}
.crumbs li:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
}
.crumbs li:last-child::before {
  content: none;
}

/* --------------------------
* borderBox
-------------------------- */
.borderBox {
  letter-spacing: 0;
  margin: 0 auto 50px;
  background-color: #FFFFFF;
  padding: 25px 35px;
  border-radius: 5px;
  line-height: 2;
}
@media screen and (max-width: 1200px) {
  .borderBox {
    margin-bottom: 50px;
    padding: 20px 30px;
    font-size: 1.5rem;
    line-height: 1.8;
  }
}
@media screen and (max-width: 767px) {
  .borderBox {
    margin-bottom: 35px;
    padding: 20px 25px;
    font-size: 1.5rem;
    line-height: 1.8;
  }
}
.borderBox ul {
  display: list-item;
}
.borderBox ul li {
  display: list-item;
  list-style: square;
  margin-left: 20px;
  margin-top: 5px;
}
@media screen and (max-width: 1080px) {
  .borderBox ul li {
    font-size: 1.5rem;
    margin-bottom: 3px;
    letter-spacing: 0px;
  }
}
@media screen and (max-width: 767px) {
  .borderBox ul li {
    font-size: 1.3rem;
    line-height: 1.5;
    margin-bottom: 5px;
    margin-left: 15px;
    letter-spacing: 0px;
  }
}
.borderBox ul li:last-child {
  margin-bottom: 0;
}

/* --------------------------
* history
-------------------------- */
.hidden {
  height: 1050px;
  overflow: hidden;
  position: relative;
  transition: 0.3s ease all;
}
.hidden.open {
  height: 100%;
}
.hidden .moreBtn {
  z-index: 9;
  height: 200px;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  background-image: linear-gradient(0deg, rgb(255, 255, 255) 15%, rgba(255, 255, 255, 0));
}
@media screen and (max-width: 767px) {
  .hidden .moreBtn {
    height: 150px;
  }
}
.hidden .moreBtn .inner {
  width: 180px;
  height: 36px;
  line-height: 36px;
  background-color: #0DB8D9;
  color: #FFFFFF;
  display: block;
  position: absolute;
  z-index: 99;
  text-align: center;
  font-size: 1.6rem;
  border-radius: 50em;
  padding-left: 10px;
  cursor: pointer;
  transition: 0.3s ease all;
}
@media screen and (max-width: 767px) {
  .hidden .moreBtn .inner {
    font-size: 1.5rem;
    width: 150px;
    height: 30px;
    line-height: 30px;
  }
}
.hidden .moreBtn .inner span {
  margin-left: 10px;
  font-size: 0.9rem;
  position: relative;
  top: -3px;
}
@media screen and (max-width: 767px) {
  .hidden .moreBtn .inner span {
    font-size: 0.8rem;
  }
}
.hidden .moreBtn .inner:hover {
  background-color: #FFF462;
}

dl.history {
  display: flex;
  flex-wrap: wrap;
  line-height: 1.8;
  margin: 0;
  position: relative;
  margin-bottom: -100px;
  overflow: hidden;
}
dl.history::before {
  content: "";
  width: 1px;
  height: calc(100% - 130px);
  background-color: #dddddd;
  z-index: -1;
  position: absolute;
  left: 16.9%;
  top: 15px;
}
@media screen and (max-width: 1440px) {
  dl.history::before {
    left: 16.75%;
  }
}
@media screen and (max-width: 960px) {
  dl.history::before {
    left: 16.7%;
  }
}
@media screen and (max-width: 767px) {
  dl.history::before {
    left: 21.65%;
  }
}
dl.history dt {
  width: 25%;
  font-size: 3.6rem;
  font-weight: 300 !important;
  color: #0DB8D9;
  margin-bottom: 100px;
  line-height: 1;
  position: relative;
}
@media screen and (max-width: 1440px) {
  dl.history dt {
    font-size: 3.2rem;
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 960px) {
  dl.history dt {
    font-size: 3rem;
  }
}
@media screen and (max-width: 767px) {
  dl.history dt {
    width: 30%;
    font-size: 2.4rem;
  }
}
dl.history dt::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50em;
  background-color: #0DB8D9;
  display: block;
  position: absolute;
  top: 14px;
  right: 30%;
}
@media screen and (max-width: 1440px) {
  dl.history dt::before {
    top: 12px;
  }
}
@media screen and (max-width: 960px) {
  dl.history dt::before {
    top: 10px;
  }
}
@media screen and (max-width: 767px) {
  dl.history dt::before {
    top: 9px;
    right: 23%;
    width: 8px;
    height: 8px;
  }
}
dl.history dt:nth-last-of-type() {
  margin-bottom: 0;
}
dl.history dd {
  width: 75%;
  margin-bottom: 100px;
}
@media screen and (max-width: 1440px) {
  dl.history dd {
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 767px) {
  dl.history dd {
    width: 70%;
  }
}
dl.history dd:nth-last-of-type() {
  margin-bottom: 0;
}

/* --------------------------
* list dl
-------------------------- */
dl.list {
  display: flex;
  flex-wrap: wrap;
  line-height: 1.8;
  margin: 0;
  border-bottom: 1px solid #dddddd;
}
@media screen and (max-width: 767px) {
  dl.list {
    margin: 0 -16px;
    line-height: 1.8;
    width: auto;
  }
}
dl.list > dt {
  width: 25%;
  padding: 30px 0;
  border-top: 1px solid #dddddd;
  display: block;
  font-weight: 500;
}
@media screen and (max-width: 1440px) {
  dl.list > dt {
    padding: 20px 0;
    width: 25%;
  }
}
@media screen and (max-width: 1024px) {
  dl.list > dt {
    padding: 15px 0 5px;
    font-weight: 600;
    width: 100%;
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  dl.list > dt {
    padding: 18px 16px 10px;
  }
}
@media screen and (max-width: 1024px) {
  dl.list > dt br {
    display: none;
  }
}
dl.list > dt span {
  font-weight: 500;
}
dl.list > dd {
  width: 75%;
  padding: 30px 0;
  border-top: 1px solid #dddddd;
  display: block;
}
@media screen and (max-width: 1440px) {
  dl.list > dd {
    padding: 20px 0;
    width: 75%;
  }
}
@media screen and (max-width: 1024px) {
  dl.list > dd {
    padding: 0px 0px 15px;
    line-height: 1.6;
    width: 100%;
    border-top: none !important;
  }
}
@media screen and (max-width: 767px) {
  dl.list > dd {
    padding: 0 16px 22px;
    width: auto;
    font-size: 1.5rem;
  }
}
dl.list > dd a {
  color: #0DB8D9;
  text-decoration: underline;
}
dl.list > dd dl {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: -30px;
}
@media screen and (max-width: 1440px) {
  dl.list > dd dl {
    margin-bottom: -20px;
  }
}
dl.list > dd dl dt {
  width: 35%;
  border-top: 1px solid #dddddd;
  padding: 30px 0;
  font-weight: 500;
}
@media screen and (max-width: 1440px) {
  dl.list > dd dl dt {
    padding: 20px 0;
  }
}
dl.list > dd dl dt:nth-of-type(1) {
  border-top: none;
  padding-top: 0;
}
dl.list > dd dl dd {
  width: 65%;
  border-top: 1px solid #dddddd;
  padding: 30px 0;
}
@media screen and (max-width: 1440px) {
  dl.list > dd dl dd {
    font-size: 1.4rem;
    padding: 20px 0;
  }
}
dl.list > dd dl dd:nth-of-type(1) {
  border-top: none;
  padding-top: 0;
}
dl.list > dd ul li {
  display: list-item;
  margin-left: 20px;
  letter-spacing: 1px;
  list-style-type: disc;
}
@media screen and (max-width: 1024px) {
  dl.list > dd ul li {
    margin-bottom: 7px;
  }
}
@media screen and (max-width: 767px) {
  dl.list > dd ul li {
    font-size: 1.5rem;
    margin-bottom: 5px;
    letter-spacing: 0;
  }
}
dl.list > dd ul li:last-child {
  margin-bottom: 0;
}

/* --------------------------
 * list ul
-------------------------- */
ul.list li {
  display: list-item;
  margin-bottom: 5px;
}
ul.list li:last-child {
  margin-bottom: 0;
}
ul.list.disc {
  list-style-type: disc;
  padding-left: 10px;
  margin-left: 10px;
}

/* --------------------------
 * faq
-------------------------- */
/* --------------------------
 * single-post
-------------------------- */
/* --------------------------
* single-post - sideBar
-------------------------- */
/* --------------------------
* pageFeed
-------------------------- */
#pageFeed {
  display: flex;
  height: 60px;
  line-height: 60px;
  justify-content: space-between;
  margin: 0px auto;
  width: 100%;
}
@media screen and (max-width: 1024px) {
  #pageFeed {
    height: 50px;
    line-height: 50px;
  }
}
@media screen and (max-width: 767px) {
  #pageFeed {
    height: 36px;
    line-height: 36px;
  }
}
@media screen and (max-width: 960px) {
  #pageFeed {
    margin-bottom: 50px;
  }
}
#pageFeed > div {
  width: 180px;
  display: block;
  height: 60px;
}
@media screen and (max-width: 1024px) {
  #pageFeed > div {
    height: 50px;
  }
}
@media screen and (max-width: 767px) {
  #pageFeed > div {
    height: 36px;
    width: 110px;
  }
}
#pageFeed > div a {
  display: flex;
  overflow: hidden;
  border-radius: 5px;
  height: 60px;
  font-size: 1.6rem;
  position: relative;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}
@media screen and (max-width: 1024px) {
  #pageFeed > div a {
    height: 50px;
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  #pageFeed > div a {
    font-size: 1.3rem;
    height: 36px;
  }
}
#pageFeed > div a img {
  width: 12px;
  position: absolute;
  margin-top: 2px;
}
@media screen and (max-width: 767px) {
  #pageFeed > div a img {
    width: 6px;
  }
}
#pageFeed > div:nth-child(1) a {
  background-color: #0DB8D9;
  color: #FFFFFF;
  padding-left: 15px;
}
#pageFeed > div:nth-child(1) a img {
  left: 20px;
  transform: scale(-1, 1);
}
@media screen and (max-width: 767px) {
  #pageFeed > div:nth-child(1) a img {
    left: 10px;
  }
}
#pageFeed > div:nth-child(1) a:hover {
  background-color: #FFF462;
}
@media screen and (max-width: 767px) {
  #pageFeed > div:nth-child(2) {
    width: 85px;
  }
}
#pageFeed > div:nth-child(2) a {
  color: #333333;
  border: 1px solid #dddddd;
  text-align: center;
}
#pageFeed > div:nth-child(2) a:hover {
  background-color: #eeeeee;
}
#pageFeed > div:nth-child(3) a {
  background-color: #0DB8D9;
  color: #FFFFFF;
  padding-right: 15px;
}
#pageFeed > div:nth-child(3) a img {
  right: 20px;
}
@media screen and (max-width: 767px) {
  #pageFeed > div:nth-child(3) a img {
    right: 10px;
  }
}
#pageFeed > div:nth-child(3) a:hover {
  background-color: #FFF462;
}

/* --------------------------
* formWrap
-------------------------- */
#formWrap {
  position: relative;
  background-color: #FFFFFF;
  padding: 75px;
  border-radius: 20px;
  border: 5px solid #0DB8D9;
}
@media screen and (max-width: 960px) {
  #formWrap {
    padding: 50px;
  }
}
@media screen and (max-width: 767px) {
  #formWrap {
    padding: 32px 16px;
    border: 3px solid #0DB8D9;
    border-radius: 0 0 10px 10px;
  }
}
#formWrap h4 {
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
  margin-bottom: 75px;
  line-height: 2;
  padding-top: 20px;
}
@media screen and (max-width: 767px) {
  #formWrap h4 {
    font-size: 1.6rem;
    text-align: left;
    margin-bottom: 0;
    padding: 0 20px 40px;
    line-height: 1.8;
  }
}
@media screen and (max-width: 767px) {
  #formWrap h4 br {
    display: none;
  }
}
#formWrap .step {
  display: flex;
  margin-bottom: 75px;
  padding-top: 50px;
  position: relative;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  #formWrap .step {
    margin-bottom: 50px;
  }
}
#formWrap .step::before {
  content: "";
  width: 70%;
  height: 2px;
  display: block;
  background-color: #eeeeee;
  position: absolute;
  top: 85px;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  #formWrap .step::before {
    top: 75px;
  }
}
#formWrap .step .item {
  position: relative;
  z-index: 9;
  width: 33.3333%;
  display: flex;
  justify-content: center;
}
#formWrap .step .item.active .item__inner .num {
  background-color: #0DB8D9;
}
#formWrap .step .item.active .item__inner .num::before {
  content: "";
  width: 80px;
  aspect-ratio: 1/1;
  display: block;
  border-radius: 50em;
  border: 1px solid #0DB8D9;
  position: absolute;
  top: -5px;
  left: -5px;
}
@media screen and (max-width: 767px) {
  #formWrap .step .item.active .item__inner .num::before {
    width: 60px;
  }
}
#formWrap .step .item.active .item__inner p {
  color: #0DB8D9;
}
#formWrap .step .item__inner {
  display: block;
}
#formWrap .step .item__inner .num {
  width: 70px;
  aspect-ratio: 1/1;
  border-radius: 50em;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  color: #FFFFFF;
  font-size: 3rem;
  background-color: #dddddd;
  position: relative;
}
@media screen and (max-width: 767px) {
  #formWrap .step .item__inner .num {
    width: 50px;
    font-size: 2.1rem;
  }
}
#formWrap .step .item__inner p {
  font-weight: 500;
  text-align: center;
  width: 100%;
  margin-top: 10px;
  color: #dddddd;
  font-size: 1.6rem;
}
@media screen and (max-width: 1440px) {
  #formWrap .step .item__inner p {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  #formWrap .step .item__inner p {
    font-size: 1.3rem;
  }
}
#formWrap .caution {
  letter-spacing: 0;
  margin: 0 auto 50px;
  background-color: #f5f5f5;
  padding: 35px 35px 40px;
  border-radius: 10px;
  line-height: 1.5;
}
@media screen and (max-width: 1080px) {
  #formWrap .caution {
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 767px) {
  #formWrap .caution {
    margin-bottom: 0px;
    padding: 35px 25px 30px;
  }
}
#formWrap .caution > p {
  width: 200px;
  height: 40px;
  line-height: 36px;
  background-color: #FFFFFF;
  border: 2px solid #0DB8D9;
  border-radius: 50em;
  font-weight: 500;
  text-align: center;
  color: #0DB8D9;
  margin: -55px auto 20px;
}
#formWrap .caution ul {
  display: list-item;
}
#formWrap .caution ul li {
  display: list-item;
  list-style: disc;
  margin-left: 15px;
  margin-bottom: 10px;
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  #formWrap .caution ul li {
    font-size: 1.3rem;
  }
}
#formWrap .caution ul li:last-child {
  margin-bottom: 0;
}
#formWrap .note {
  margin-bottom: 100px;
  text-align: center;
  font-size: 1.4rem;
}
#formWrap .tx {
  margin: 0 auto;
  font-size: 1.8rem;
}
@media screen and (max-width: 1536px) {
  #formWrap .tx {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 1200px) {
  #formWrap .tx {
    font-size: 1.5rem;
  }
}
#formWrap .tx h2 {
  font-size: 3.6rem;
  margin-bottom: 75px;
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 1536px) {
  #formWrap .tx h2 {
    font-size: 3.2rem;
  }
}
@media screen and (max-width: 960px) {
  #formWrap .tx h2 {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  #formWrap .tx h2 {
    font-size: 2.4rem;
  }
}
#formWrap .tx h2 span {
  display: block;
  font-size: 1.8rem;
  color: #0DB8D9;
  border-bottom: none;
  line-height: 1;
  margin-top: 5px;
}
@media screen and (max-width: 767px) {
  #formWrap .tx h2 span {
    font-size: 1.6rem;
    margin-top: 10px;
  }
}
#formWrap .tx .btn {
  margin-top: 75px;
}
#formWrap dl {
  margin: 0;
  padding: 0;
  margin-bottom: 25px;
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px dotted #dddddd;
}
#formWrap dl .hiddenArea, #formWrap dl #zip, #formWrap dl #addr, #formWrap dl #confirm-zip, #formWrap dl #confirm-addr {
  width: 100% !important;
}
#formWrap dl .hiddenArea .flexWrap, #formWrap dl #zip .flexWrap, #formWrap dl #addr .flexWrap, #formWrap dl #confirm-zip .flexWrap, #formWrap dl #confirm-addr .flexWrap {
  flex-wrap: inherit;
}
@media screen and (max-width: 1024px) {
  #formWrap dl .hiddenArea .flexWrap, #formWrap dl #zip .flexWrap, #formWrap dl #addr .flexWrap, #formWrap dl #confirm-zip .flexWrap, #formWrap dl #confirm-addr .flexWrap {
    display: block;
  }
}
#formWrap dl dt {
  width: 35%;
  padding: 0;
  display: flex;
  align-items: center;
  border-top: 1px dotted #dddddd;
  position: relative;
  line-height: 1;
}
@media screen and (max-width: 1024px) {
  #formWrap dl dt {
    width: 100%;
    padding-top: 20px;
  }
}
#formWrap dl dt .label {
  position: relative;
  width: auto;
  font-weight: 500;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  #formWrap dl dt .label {
    font-size: 1.5rem;
  }
}
#formWrap dl dt .label.twoline {
  line-height: 2;
}
#formWrap dl dt span.required {
  display: block;
  color: #FFFFFF;
  font-weight: normal;
  background-color: #0DB8D9;
  line-height: 18px;
  font-size: 1.2rem;
  padding: 2px 0;
  position: absolute;
  top: 50%;
  right: 40px;
  border-radius: 2px;
  width: 50px;
  margin-top: -11px;
  text-align: center;
}
@media screen and (max-width: 1440px) {
  #formWrap dl dt span.required {
    font-size: 1.1rem;
    width: 40px;
    height: 20px;
    line-height: 18px;
    margin-top: -12px;
    padding: 0;
    right: 30px;
  }
}
@media screen and (max-width: 1024px) {
  #formWrap dl dt span.required {
    position: relative;
    top: inherit;
    right: inherit;
    display: inline-block;
    margin-left: 15px;
    margin-top: 0;
    line-height: 15px;
    margin-top: -5.5px;
    height: 15px;
  }
}
#formWrap dl dd {
  width: 65%;
  padding: 20px 0;
  display: block;
  border-top: 1px dotted #dddddd;
}
@media screen and (max-width: 1024px) {
  #formWrap dl dd {
    width: 100%;
    border-top: none;
    padding-top: 10px;
  }
}
#formWrap dl dd > label {
  margin: 0 20px 0 0;
  padding: 0;
}
#formWrap dl dd p input[type=text] {
  margin-top: 0;
  margin-bottom: 15px;
}
#formWrap dl dd p > label {
  width: 100px;
  margin: 0;
}
#formWrap dl dd p input[type=radio] {
  margin-right: 5px;
  margin-left: 15px;
}
#formWrap dl dd p input[type=radio]:first-child {
  margin-left: 0;
}
#formWrap dl dd p input[type=checkbox] {
  margin-left: 15px;
}
#formWrap dl dd p input[type=checkbox]:first-child {
  margin-left: 0;
}
#formWrap dl dd span {
  color: #EE836F;
  font-weight: bold;
}
#formWrap dl select {
  width: 100%;
  height: 3.6em;
  line-height: 1;
  background-color: #F9F9F9;
  color: #333333 !important;
  padding: 0 20px;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
@media screen and (max-width: 1024px) {
  #formWrap dl select {
    width: 100%;
    height: 50px;
    padding-left: 10px;
  }
}
@media screen and (max-width: 767px) {
  #formWrap dl select {
    font-size: 1.5rem;
  }
}
#formWrap dl select:focus {
  border: 1px solid #333333;
  outline: 0;
}
#formWrap dl input[type=text], #formWrap dl input[type=email], #formWrap dl input[type=tel] {
  width: 100%;
  box-sizing: border-box;
  background-color: #F9F9F9;
  color: #333333 !important;
  line-height: 1;
  height: 3.6em;
  padding: 0 20px;
  box-shadow: 0;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
@media screen and (max-width: 1024px) {
  #formWrap dl input[type=text], #formWrap dl input[type=email], #formWrap dl input[type=tel] {
    width: 100%;
    height: 50px;
    padding: 0 10px;
  }
}
@media screen and (max-width: 767px) {
  #formWrap dl input[type=text], #formWrap dl input[type=email], #formWrap dl input[type=tel] {
    font-size: 1.5rem;
  }
}
#formWrap dl input[name=zip] {
  width: 50%;
}
@media screen and (max-width: 767px) {
  #formWrap dl input[name=zip] {
    width: 100%;
  }
}
#formWrap dl input:nth-child(2) {
  margin-top: 15px;
}
#formWrap dl textarea {
  box-sizing: border-box;
  width: 100%;
  background-color: #F9F9F9;
  color: #333333 !important;
  line-height: 1.6;
  padding: 15px 20px;
  border-radius: 0px;
  box-shadow: 0;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
@media screen and (max-width: 1024px) {
  #formWrap dl textarea {
    padding: 10px 10px;
  }
}
@media screen and (max-width: 767px) {
  #formWrap dl textarea {
    font-size: 1.5rem;
  }
}
#formWrap dl input[type=text]:focus, #formWrap dl input[type=email]:focus, #formWrap dl input[type=tel]:focus {
  border: 1px solid #333333;
  outline: 0;
}
#formWrap dl textarea:focus {
  border: 1px solid #333333;
  outline: 0;
}
#formWrap dl input[type=checkbox] {
  margin-right: 20px !important;
  line-height: 100px;
  padding: 0 20px;
  border-radius: 0px;
  border: #333333;
  color: #333333 !important;
}
#formWrap dl input[type=radio] {
  margin-right: 10px;
}
#formWrap dl input[type=file] {
  line-height: 25px;
}
#formWrap dl input::-moz-placeholder {
  color: #dddddd;
}
#formWrap dl input::placeholder {
  color: #dddddd;
}
#formWrap dl textarea::-moz-placeholder {
  color: #dddddd;
}
#formWrap dl textarea::placeholder {
  color: #dddddd;
}
#formWrap .policy {
  margin-bottom: 50px;
}
#formWrap .policy h2 {
  text-align: center;
  border-bottom: 1px solid #000;
  padding-bottom: 15px;
  margin-bottom: 25px;
}
#formWrap .policy .textArea {
  background-color: #fff;
  margin-bottom: 50px;
  padding: 3%;
  display: block;
  aspect-ratio: 16/4;
  height: auto;
  width: 100%;
  overflow: auto;
  line-height: 1.8;
  border: 1px solid #dddddd;
}
@media screen and (max-width: 1024px) {
  #formWrap .policy .textArea {
    line-height: 1.6;
  }
}
#formWrap .check {
  line-height: 3;
  margin-bottom: 35px;
  padding-top: 10px;
}
@media screen and (max-width: 1024px) {
  #formWrap .check {
    margin-left: 0%;
    margin-bottom: 25px;
  }
}
#formWrap .check a {
  color: #0DB8D9;
  margin-left: 20px;
  display: inline;
  text-decoration: underline;
}
@media screen and (max-width: 767px) {
  #formWrap .check a {
    display: block;
    line-height: 1;
    margin-top: 0;
    margin-left: -10px;
  }
}
#formWrap .check input[type=checkbox] {
  accent-color: #333333;
  inline-size: 2.5rem !important;
  block-size: 2.5rem !important;
  margin-right: 20px;
  position: relative;
  bottom: -6px;
  border-radius: 0 !important;
  border: 1px solid #0DB8D9;
}
#formWrap div.wpcf7-mail-sent-ok {
  border: 2px solid #398f14;
  background-color: #fff;
  margin: 0 -5px;
}
#formWrap div.wpcf7-mail-sent-ng {
  border: 2px solid #ff0000;
  background-color: #fff;
  margin: 0 -5px;
}
#formWrap div.wpcf7-spam-blocked {
  border: 2px solid #ffa500;
  background-color: #fff;
  margin: 0 -5px;
}
#formWrap div.wpcf7-validation-errors {
  border: 2px solid #f7e700;
  background-color: #fff;
  margin: 0 -5px !important;
}
#formWrap .formBtn {
  width: 100%;
}
#formWrap .formBtn ul {
  width: 60%;
  display: flex;
  gap: 20px;
  justify-content: center;
  margin: 35px auto 0;
}
@media screen and (max-width: 1440px) {
  #formWrap .formBtn ul {
    width: 70%;
  }
}
@media screen and (max-width: 1024px) {
  #formWrap .formBtn ul {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  #formWrap .formBtn ul {
    display: block;
    gap: 0;
    width: 80%;
  }
}
#formWrap .formBtn ul li {
  display: block;
  width: 50%;
}
@media screen and (max-width: 767px) {
  #formWrap .formBtn ul li {
    width: 100%;
    margin-bottom: 10px;
  }
}
#formWrap .formBtn input[type=button], #formWrap .formBtn input[type=submit] {
  width: 100%;
  letter-spacing: 1px;
  height: auto;
  display: block;
  line-height: 60px;
  margin: 0;
  display: block;
  border: none;
  transition: all 0.3s;
  border-radius: 10em;
  font-size: 1.8rem;
}
@media screen and (max-width: 1024px) {
  #formWrap .formBtn input[type=button], #formWrap .formBtn input[type=submit] {
    font-size: 1.6rem;
    aspect-ratio: 16/3;
  }
}
@media screen and (max-width: 767px) {
  #formWrap .formBtn input[type=button], #formWrap .formBtn input[type=submit] {
    height: 50px;
    line-height: 50px;
  }
}

button:not(:disabled),
input[type=button]:not(:disabled),
input[type=reset]:not(:disabled),
input[type=submit]:not(:disabled),
.wpcf7-submit:not(:disabled) {
  background: #0DB8D9;
  color: #FFFFFF;
}
button:not(:disabled):hover,
input[type=button]:not(:disabled):hover,
input[type=reset]:not(:disabled):hover,
input[type=submit]:not(:disabled):hover,
.wpcf7-submit:not(:disabled):hover {
  opacity: 0.8;
}

button:disabled,
input:disabled,
.wpcf7-submit:disabled {
  background: #cccccc;
  color: #FFFFFF;
  pointer-events: none;
}
button:disabled:hover,
input:disabled:hover,
.wpcf7-submit:disabled:hover {
  opacity: 1;
}

input.wpcf7-form-control.wpcf7-text.zip,
input.wpcf7-form-control.wpcf7-text.addr {
  position: absolute;
  top: 0;
  left: -50vw;
}

/* --------------------------
 * table
-------------------------- */
/* --------------------------
* pagination
-------------------------- */
.pagination {
  height: 40px;
  width: 100%;
}
.pagination > ul {
  display: flex;
  gap: 6px;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .pagination > ul {
    gap: 4px;
  }
}
.pagination > ul li {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50em;
  overflow: hidden;
  font-size: 1.8rem;
  font-weight: 400;
  display: block;
  transition: 0.3s ease all;
}
@media screen and (max-width: 1200px) {
  .pagination > ul li {
    font-size: 1.6rem;
    width: 36px;
    height: 36px;
    line-height: 36px;
  }
}
@media screen and (max-width: 767px) {
  .pagination > ul li {
    font-size: 1.5rem;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 5px;
  }
}
.pagination > ul li.current {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  background-color: #0DB8D9;
}
.pagination > ul li.current:hover a {
  background-color: #0DB8D9;
}
.pagination > ul li.next, .pagination > ul li.prev {
  font-size: 1.6rem;
  width: 80px;
  border-radius: 50em;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic", "ヒラギノ角ゴ W3", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", Meiryo, sans-serif;
}
@media screen and (max-width: 767px) {
  .pagination > ul li.next, .pagination > ul li.prev {
    width: auto;
    font-size: 1.3rem;
    border-radius: 5px;
  }
}
.pagination > ul li.next a, .pagination > ul li.prev a {
  background-color: #FFFFFF;
  color: #333333;
  display: block;
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .pagination > ul li.next a, .pagination > ul li.prev a {
    padding: 0 7px;
  }
}
.pagination > ul li.next:hover a, .pagination > ul li.prev:hover a {
  background-color: #FFF462;
  color: #333333;
}
.pagination > ul li.next {
  margin-left: 15px;
}
@media screen and (max-width: 767px) {
  .pagination > ul li.next {
    margin-left: 7px;
  }
}
.pagination > ul li.prev {
  margin-right: 15px;
}
@media screen and (max-width: 767px) {
  .pagination > ul li.prev {
    margin-right: 7px;
  }
}
.pagination > ul li.first, .pagination > ul li.last {
  font-size: 1.6rem;
  width: 80px;
  border-radius: 50em;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic", "ヒラギノ角ゴ W3", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", Meiryo, sans-serif;
}
@media screen and (max-width: 767px) {
  .pagination > ul li.first, .pagination > ul li.last {
    width: auto;
    font-size: 1.3rem;
    border-radius: 5px;
  }
}
.pagination > ul li.first a, .pagination > ul li.last a {
  background-color: #FFFFFF;
  color: #333333;
  display: block;
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .pagination > ul li.first a, .pagination > ul li.last a {
    padding: 0 7px;
  }
}
.pagination > ul li.first:hover a, .pagination > ul li.last:hover a {
  background-color: #FFF462;
  color: #333333;
}
.pagination > ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  padding: 0;
  background-color: #FFFFFF;
}
.pagination > ul li:hover a {
  background-color: #0DB8D9;
  color: #FFFFFF;
  opacity: 1 !important;
}

/* --------------------------
* modal
-------------------------- *//*# sourceMappingURL=common.css.map */