@charset "UTF-8";
/*==================================================
reset
==================================================*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: 400;
  vertical-align: baseline;
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

* {
  font-size: inherit;
  line-height: inherit;
}

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

span {
  line-height: inherit;
  font-size: inherit;
  text-decoration: inherit;
  vertical-align: inherit;
  font-weight: inherit;
}

body {
  -webkit-text-size-adjust: 100%;
}

ol,
ul {
  list-style: none;
}

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

a {
  transition: opacity 0.4s;
}
a:hover {
  opacity: 0.7;
}

em,
strong,
em *,
strong * {
  font-weight: bold;
}

/*--form初期化--*/
input[type=submit],
button {
  cursor: pointer;
}

button,
input[type=text],
input[type=image],
input[type=password],
input[type=file],
input[type=submit],
input[type=reset],
input[type=button],
input[type=email],
input[type=tel],
textarea {
  font-family: inherit;
}

::placeholder {
  opacity: 1;
}

::-ms-input-placeholder {
  opacity: 1;
}

:-ms-input-placeholder {
  opacity: 1;
}

a {
  text-decoration: none;
  border: none;
  color: inherit;
}

table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  text-align: left;
}

th {
  text-align: left;
}

@media screen and (max-width: 767px) {
  html,
  body,
  div,
  span,
  applet,
  object,
  iframe,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  blockquote,
  pre,
  a,
  abbr,
  acronym,
  address,
  big,
  cite,
  code,
  del,
  dfn,
  em,
  img,
  ins,
  kbd,
  q,
  s,
  samp,
  small,
  strike,
  strong,
  sub,
  sup,
  tt,
  var,
  b,
  u,
  i,
  center,
  dl,
  dt,
  dd,
  ol,
  ul,
  li,
  fieldset,
  form,
  label,
  legend,
  table,
  caption,
  tbody,
  tfoot,
  thead,
  tr,
  th,
  td,
  article,
  aside,
  canvas,
  details,
  embed,
  figure,
  figcaption,
  footer,
  header,
  hgroup,
  menu,
  nav,
  output,
  ruby,
  section,
  summary,
  time,
  mark,
  audio,
  video {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  button,
  input[type=text],
  input[type=image],
  input[type=password],
  input[type=file],
  input[type=submit],
  input[type=reset],
  input[type=button],
  input[type=email],
  input[type=tel] textarea {
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);
    border-radius: 0;
    box-shadow: none;
    appearance: none;
  }
  textarea,
  input[type=email],
  input[type=text],
  input[type=image],
  input[type=password] {
    -webkit-appearance: none;
  }
}
/*==================================================
root
==================================================*/
:root {
  --js-breakpoint-sp: 767px;
  --js-breakpoint-md: 1079px;
  --js-breakpoint-lg: 1179px;
  /*size*/
  --site-width: 1440px;
  --inner-width: 1344px;
  /* padding*/
  --site-padding: 50px;
  --section-padding: 80px;
  --block-padding: 60px;
  --box-padding: 48px;
  --block-gap: 40px;
  --text-gap: 24px;
  /*color*/
  --light-color: #E4F1FA;
  --main-color: #023395;
  /*font*/
  --font-color: #333;
  /*font-size*/
  --font-section-title: 3.6rem;
  --font-block-title: 3.2rem;
  --font-unit-title: 2.4rem;
  --font-large: 2rem;
  --font-middle: 1.8rem;
  --font-base: 1.6rem;
  --font-small: 1.4rem;
  --font-jp: "Noto Sans JP",
    sans-serif;
  --font-en: "Inter",
    sans-serif;
  --base-line: 1.8;
}

@media all and (max-width: 1080px) {
  :root {
    --site-padding: 30px;
    --section-padding: 60px;
    --block-padding: 30px;
    --block-gap: 25px;
    --text-gap: 16px;
    --box-padding: 36px;
    /*font*/
    --font-section-title: 3.2rem;
    --font-block-title: 2.6rem;
    --font-unit-title: 2.1rem;
    --font-large: 1.8rem;
    --font-middle: 1.6rem;
    --font-base: 1.5rem;
    --font-small: 1.3rem;
  }
}
@media all and (max-width: 767px) {
  :root {
    /*size*/
    --site-padding: 20px;
    --section-padding: 40px;
    --block-padding: 30px;
    --block-gap: 15px;
    --text-gap: 16px;
    --box-padding: 24px;
    /*font*/
    --font-section-title: 2.3rem;
    --font-block-title: 2rem;
    --font-unit-title: 1.6rem;
    --font-base: 1.4rem;
    --font-large: 1.8rem;
    --font-middle: 1.5rem;
    --font-small: 1.2rem;
  }
}
/*==================================================
sp pc
==================================================*/
@media all and (min-width: 768px) {
  .sp-only {
    display: none !important;
  }
}

@media all and (max-width: 767px) {
  .pc-only {
    display: none !important;
  }
}

@media all and (min-width: 1201px) {
  .sp-tb-only {
    display: none !important;
  }
}

@media all and (max-width: 767px) {
  .tb-only {
    display: none !important;
  }
}
@media all and (min-width: 1201px) {
  .tb-only {
    display: none !important;
  }
}

@media all and (max-width: 767px) {
  .tb-pc-only {
    display: none !important;
  }
}

/*--------------------------------------
html,body,wrapper
----------------------------------------*/
html {
  font-family: var(--font-jp);
  font-size: 62.5%;
  color: var(--font-color);
}

/*==================================================
l-header
==================================================*/
.l-header {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  display: grid;
  color: #fff;
  width: 100%;
  font-size: var(--font-base);
}
@media all and (max-width: 1079px) {
  .l-header {
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    background: white;
  }
}
.l-header-row {
  display: grid;
  grid-template-columns: 246px auto;
  justify-content: space-between;
  gap: 36px;
  padding: 8px 0 0 var(--site-padding);
}
@media all and (max-width: 1079px) {
  .l-header-row {
    grid-template-columns: 1fr;
    display: flex;
    align-items: center;
    height: 80px;
    padding: 0 0 0 30px;
  }
}
@media all and (max-width: 767px) {
  .l-header-row {
    height: 60px;
    padding: 0 0 0 15px;
  }
}
.l-header-contents {
  display: flex;
  gap: 36px;
}
@media screen and (max-width: 1179px) {
  .l-header-contents {
    gap: 20px;
  }
}
@media all and (max-width: 1079px) {
  .l-header-contents {
    overflow: scroll;
    position: absolute;
    left: 0;
    top: 80px;
    width: 100%;
    height: calc(100lvh - 80px);
    padding-bottom: 60px;
    background: #fff;
    opacity: 0;
    pointer-events: none;
  }
}
@media all and (max-width: 767px) {
  .l-header-contents {
    top: 60px;
    width: 100%;
    height: calc(100lvh - 60px);
  }
}
.l-header-contents.-show {
  opacity: 1;
  pointer-events: auto;
  display: block;
}
.l-header-nav {
  display: flex;
  gap: 1.8em;
  padding-top: 25px;
  margin-right:40px;
}
@media all and (max-width: 1079px) {
  .l-header-nav {
    display: block;
    margin-bottom: 20px;
    padding-top: 0;
  }
}
.l-header-logo {
  display: block;
  padding-top: 20px;
}
@media all and (max-width: 1079px) {
  .l-header-logo {
    width: 240px;
    padding-top: 0;
  }
}
@media all and (max-width: 767px) {
  .l-header-logo {
    width: 170px;
  }
}
.l-header-links {
  display: flex;
  gap: 1.8em;
  font-size: var(--font-large);
}
@media screen and (max-width: 1179px) {
  .l-header-links {
    gap: 1.2em;
  }
}
@media all and (max-width: 1079px) {
  .l-header-links {
    display: block;
    color: var(--main-color);
  }
}
.l-header-links > li {
  position: relative;
}
@media all and (max-width: 1079px) {
  .l-header-links a {
    display: block;
    padding: 10px var(--site-padding);
    border-bottom: 1px solid var(--main-color);
  }
}
.l-header-side {
  display: grid;
  place-content: start start;
  gap: 10px;
  position:fixed;
	top:10%;
	right:0;
	z-index:10;
}
@media all and (max-width: 1079px) {
  .l-header-side {
    grid-template-columns: 100%;
    display: block;
	width:100%;
	top:unset;
	  right:unset;
	  bottom:0;
	  z-index:100;
  }
}
.l-header-sub-list {
  display: flex;
  justify-content: center;
  gap: 30px;
}
@media all and (max-width: 1079px) {
  .l-header-sub-list {
    color: #333;
  }
}

.menu-item-has-children .up-menu {
  position: relative;
  padding-right: 25px;
  display: block !important;
}
@media all and (max-width: 1079px) {
  .menu-item-has-children .up-menu {
    padding: 10px var(--site-padding);
    border-bottom: 1px solid var(--main-color);
  }
}
.menu-item-has-children .up-menu:after {
  content: "";
  position: absolute;
  right: 0;
  top: 9px;
  display: block;
  width: 16px;
  height: 14px;
  background: #fff;
  clip-path: polygon(50% 100%, 0% 0, 100% 0);
}

.sub-menu {
  transition: opacity 0.4s;
  pointer-events: none;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 1.5em;
  width: 308px;
}
@media all and (max-width: 1079px) {
  .sub-menu {
    pointer-events: none;
    opacity: 1;
    width: 100%;
    position: static;
  }
}
.sub-menu a {
  display: flex;
  gap: 24px;
  padding: 12px 16px;
  border-bottom: 1px solid #FFF;
  background: linear-gradient(90deg, #1F9FF7 0%, #1273B7 100%);
}
@media all and (max-width: 1079px) {
  .sub-menu a {
    background: none;
    gap: 10px;
    padding: 12px 0 12px 24px;
    border-bottom: 1px solid var(--main-color) !important;
  }
}
.sub-menu a:before {
  content: "";
  display: block;
  width: 12px;
  height: 24px;
  background: url("../img/icons/ico-arrow.svg") no-repeat left center;
}
@media all and (max-width: 1079px) {
  .sub-menu a:before {
    background-image: url("../img/icons/ico-arrow-main-color.svg");
  }
}
.sub-menu li:last-child a {
  border-bottom: none;
}

.l-header-contents.-show .sub-menu {
  pointer-events: auto;
}

@media (hover: hover) and (pointer: fine) {
  .menu-item-has-children:hover .sub-menu {
    opacity: 1;
    pointer-events: auto;
  }
}

.drawer-only {
  display: none;
}
@media all and (max-width: 1079px) {
  .drawer-only {
    display: block;
  }
}

/*==================================================
l-nav-switch
==================================================*/
.l-nav-switch {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  outline: none;
  border: none;
  background: var(--main-color);
  display: none;
}
@media all and (max-width: 1079px) {
  .l-nav-switch {
    display: block;
    height: 80px;
    width: 80px;
  }
}
@media all and (max-width: 767px) {
  .l-nav-switch {
    width: 60PX;
    height: 60px;
  }
}
.l-nav-switch__line {
  position: absolute;
  left: 0;
  right: 0;
  height: 0;
  width: 40px;
  margin: 0 auto;
  border-top: solid 2px #fff;
  transition: all 0.4s;
}
@media all and (max-width: 767px) {
  .l-nav-switch__line {
    width: 30px;
  }
}
.l-nav-switch__line:nth-child(1) {
  top: calc(50% - 8px);
}
.l-nav-switch__line:nth-child(2) {
  top: 50%;
}
.l-nav-switch__line:nth-child(3) {
  top: calc(50% + 8px);
}
.l-nav-switch.-show .l-nav-switch__line:nth-child(1) {
  top: 50%;
  transform: rotate(-45deg);
}
.l-nav-switch.-show .l-nav-switch__line:nth-child(2) {
  display: none;
}
.l-nav-switch.-show .l-nav-switch__line:nth-child(3) {
  top: 50%;
  transform: rotate(45deg);
}

/*==================================================
l-main
==================================================*/
.l-main {
  line-height: var(--base-line);
  font-size: var(--font-base);
}

/*==================================================
l-footer
==================================================*/
.l-footer {
  font-size: var(--font-base);
}
.l-footer-bg {
  background: var(--light-color);
}
@media all and (max-width: 767px) {
  .l-footer-bnr {
    width: 90%;
    margin-inline: auto auto;
  }
}
.l-footer-row {
  display: grid;
  grid-template-columns: 374px 1fr;
  width: min(var(--site-width), 100%);
  margin-inline: auto auto;
  padding: 40px var(--site-padding);
}
@media all and (max-width: 1079px) {
  .l-footer-row {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}
@media all and (max-width: 767px) {
  .l-footer-info {
    display: grid;
    place-content: center;
    gap: 15px;
  }
}
@media all and (max-width: 767px) {
  .l-footer-text {
    text-align: center;
  }
}
.l-footer-body {
  display: grid;
  gap: 24px;
}
@media all and (max-width: 1079px) {
  .l-footer-body {
    grid-template-columns: 1fr 1fr;
  }
}
@media all and (max-width: 767px) {
  .l-footer-body {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.l-footer-body > div {
  display: grid;
  gap: 24px;
}
@media all and (max-width: 1079px) {
  .l-footer-body > div {
    display: grid;
    align-content: start;
    gap: 15px;
  }
}
.l-footer-nav {
  justify-self: end;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--section-padding);
}
@media all and (max-width: 1079px) {
  .l-footer-nav {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    justify-self: stretch;
  }
}
@media all and (max-width: 767px) {
  .l-footer-nav {
    grid-template-columns: 1fr;
  }
}
.l-footer-address {
  display: grid;
  gap: 10px;
  font-style: normal;
}
.l-footer-address__tel {
  padding-left: 24px;
  font-weight: 700;
  font-size: var(--font-middle);
  background: url("../img/icons/ico-tel-main-color.svg") no-repeat left center/19px auto;
}
.l-footer-address__location {
  padding-left: 24px;
  background: url("../img/icons/ico-map-main-color.svg") no-repeat left 4px/19px auto;
}
@media all and (max-width: 1079px) {
  .l-footer-address__location {
    background-position: left 2px;
  }
}
.l-footer-title {
  margin-bottom: 24px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--main-color);
}
.l-footer-title a {
  font-weight: 700;
  font-size: var(--font-middle);
  color: var(--main-color);
}
.l-footer-list {
  display: grid;
  gap: 10px;
}
@media all and (max-width: 767px) {
  .l-footer-list {
    grid-template-columns: 1fr 1fr;
  }
}
.l-footer-list li a {
  display: flex;
  align-items: center;
  gap: 16px;
}
.l-footer-list li a:before {
  content: "";
  display: block;
  width: 10px;
  height: 12px;
  clip-path: polygon(0 0%, 0% 100%, 100% 50%);
  background: #333;
}
.l-footer-copy {
  display: grid;
  place-content: center;
  height: 64px;
  background: var(--main-color);
  text-align: center;
  color: #fff;
  font-size: 1.44rem;
}
.l-footer-emergency {
  margin-top: 24px;
  font-size: 1.44rem;
}

/*==================================================
page-header
==================================================*/
.l-page-header {
  position: relative;
  width: 100%;
  height: 430px;
  display: grid;
  place-content: center;
  color: #fff;
  text-align: center;
}
@media all and (max-width: 767px) {
  .l-page-header {
    height: 260px;
  }
}
.l-page-header__title {
  position: relative;
  z-index: 1;
}
.l-page-header__jp {
  font-size: 4.8rem;
}
@media all and (max-width: 767px) {
  .l-page-header__jp {
    font-size: 3.2rem;
    line-height: 1.4;
  }
}
.l-page-header__en {
  font-size: var(--font-unit-title);
  letter-spacing: 0.1em;
  font-family: var(--font-en);
  text-transform: uppercase;
}
.l-page-header__bg {
  position: absolute;
  left: 0;
  top: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/*==================================================
underapage
==================================================*/
.l-underpage {
  background: var(--light-color);
}

/*==================================================
l-breadcrumbs
==================================================*/
.l-breadcrumbs {
  padding: 15px var(--site-padding);
}
.l-breadcrumbs ol {
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.l-breadcrumbs ol a {
  padding-right: 0.5em;
}

/*==================================================
space
==================================================*/
.m-mb-xsmall {
  margin-bottom: 10px;
}

.m-mb-small {
  margin-bottom: var(--text-gap);
}

.m-mb-middle {
  margin-bottom: var(--block-gap);
}

.m-md-large {
  margin-bottom: var(--section-padding);
}

.m-centered {
  width: fit-content;
  margin-inline: auto auto;
}

/*==================================================
bg
==================================================*/
.m-bg-light {
  background: #F5FBFF;
}

.m-bg-dark {
  background: #C9DFEE;
}

.m-img-pic {
  width: 30%;
  margin-inline: auto auto;
}
@media all and (max-width: 767px) {
  .m-img-pic {
    width: 70%;
  }
}

/*==================================================
text
==================================================*/
.m-under {
  text-decoration: underline;
}

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

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

.m-texts {
  display: grid;
  gap: var(--text-gap);
}

.m-textrow {
  display: inline-block;
  font-weight: inherit;
  color: inherit;
}

/*==================================================
row
==================================================*/
.m-block-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--block-padding);
}
@media all and (max-width: 767px) {
  .m-block-row {
    grid-template-columns: 1fr;
  }
}

.m-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--text-gap);
}
@media all and (max-width: 767px) {
  .m-grid-2 {
    grid-template-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.m-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--text-gap);
}
@media all and (max-width: 767px) {
  .m-grid-3 {
    gap: 30px;
    grid-template-columns: 1fr;
  }
}

.m-grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--text-gap);
}
@media all and (max-width: 767px) {
  .m-grid-4 {
    grid-template-columns: 1fr;
  }
}
@media all and (max-width: 1079px) {
  .m-grid-4--tb-custom {
    grid-template-columns: repeat(2, 1fr);
  }
}

/*==================================================
button
==================================================*/
.m-cta-buttons {
  display: grid;
  gap: 8px;
}
@media all and (max-width: 1079px) {
	.l-header-side .m-cta-buttons {
		  display: flex;
		  gap:unset;
		}
	
	.l-header-side .m-cta-buttons li {
		width:50%;
	}
}
.m-cta-button {
  position: relative;
  display: grid;
  place-content: center;
  gap: 3px;
  width: 363px;
  height: 92px;
  padding: 0 48px;
  color: #fff;
}
@media all and (max-width: 1079px) {
  .m-cta-button {
    max-width: 363px;
    width: 100%;
    padding: 0 24px;
    margin-inline: auto auto;
  }
	
  .l-header-side .m-cta-button {
    width: 100%;
	padding:0 12px;
	  height:70px;
	  max-width:unset;
  }
}
@media all and (max-width: 767px) {
  .m-cta-button {
    width: 90%;
  }
	
}
.m-cta-button:before, .m-cta-button:after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
}
.m-cta-button:before {
  inset: 0;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  margin: auto;
  border: 1px solid #fff;
}
.m-cta-button:after {
  z-index: 1;
  right: 4px;
  bottom: 4px;
  width: 26px;
  height: 26px;
  background: #fff;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
.m-cta-button__subtext {
  padding-bottom: 3px;
  border-bottom: 1px solid #fff;
  font-size: 1.6rem;
  text-align: center;
}
@media screen and (max-width:1079px) {
	.l-header-side .m-cta-button__subtext {
    font-size: 12px;
  }
	.l-header-side .m-cta-button__num {
    font-size: 14px;
	padding-left:30px;
	background:url("../img/icons/ico-tel.svg") no-repeat left 6px/14px auto;
  }
	
	.l-header-side .m-cta-button__reservation {
    padding-block: 5px;
    font-size: 14px;
	background:url("../img/icons/ico-device.svg") no-repeat left 3px/20px auto;		
	padding-left:24px;
  }
}
@media all and (max-width: 767px) {
  .m-cta-button__subtext {
    font-size: 1.4rem;
  }
}
.m-cta-button__num {
  padding-left: 36px;
  background: url("../img/icons/ico-tel.svg") no-repeat left 7px/28px auto;
  font-size: var(--font-block-title);
  line-height: 1.2;
  font-family: var(--font-en);
  letter-spacing: 0.03em;
}
@media all and (max-width: 767px) {
  .m-cta-button__num {
    padding-block: 5px;
    font-size: 2.6rem;
  }
}
.m-cta-button__reservation {
  padding-left: 36px;
  background: url("../img/icons/ico-device.svg") no-repeat left 3px/32px auto;
  font-size: 2.8rem;
  font-weight: 500;
  line-height: 1.2;
}
@media all and (max-width: 767px) {
  .m-cta-button__reservation {
    padding-block: 5px;
    font-size: 2.2rem;
  }
}
.m-cta-button--tel {
  background: linear-gradient(90deg, #023395 0%, #2054BC 100%);
}
.m-cta-button--form {
  background: linear-gradient(90deg, #98782F 0%, #B28931 100%);
}

/*==================================================
m-lead-title
==================================================*/
.m-lead-title {
  margin-bottom: 40px;
  color: var(--main-color);
  font-size: var(--font-section-title);
  letter-spacing: 0.08em;
  text-align: center;
  font-weight: 500;
}
@media all and (max-width: 1079px) {
  .m-lead-title {
    line-height: 1.6;
  }
}
@media all and (max-width: 767px) {
  .m-lead-title {
    margin-bottom: 30px;
  }
}
.m-lead-title:after {
  content: "";
  display: block;
  margin-inline: auto auto;
  margin-top: 10px;
  max-width: 120px;
  border-bottom: 1px solid var(--main-color);
}
@media all and (max-width: 767px) {
  .m-lead-title:after {
    margin-top: 5px;
    max-width: 80px;
  }
}

/*==================================================
m-section-title
==================================================*/
.m-section-title {
  padding: 0.15em 0.5em 0.25em 0.5em;
  font-size: var(--font-section-title);
  text-align: center;
  color: #fff;
  letter-spacing: 0.08em;
  background: linear-gradient(90deg, #023395 0%, #057CCE 100%);
  line-height: 1.4;
}

/*==================================================
m-block-title
==================================================*/
.m-block-title {
  margin-bottom: var(--text-gap);
  padding: 0.2em 0.5em 0.3em 0.5em;
  font-size: var(--font-block-title);
  font-weight: 500;
  text-align: center;
  color: #fff;
  background: linear-gradient(270deg, #4EB7FF 0%, #1F9FF7 100%);
  letter-spacing: 0.08em;
  line-height: 1.4;
}

/*==================================================
m-subtitle
==================================================*/
.m-subtitle {
  margin-bottom: 0.75em;
  font-weight: 500;
  font-size: var(--font-unit-title);
  color: var(--main-color);
}
@media all and (max-width: 767px) {
  .m-subtitle {
    margin-bottom: 1.25em;
  }
}
.m-subtitle--line {
  border-bottom: 1px solid var(--main-color);
}

/*==================================================
m-inner
==================================================*/
.m-inner {
  width: min(1300px, 100%);
  margin-inline: auto;
  padding-inline: var(--site-padding);
}
@media all and (max-width: 767px) {
  .m-inner {
    width: 100%;
  }
}
.m-inner.-pos {
  position: relative;
}
/*==================================================
section
==================================================*/
.m-section {
  padding-block: var(--section-padding);
}

.m-lead-section {
  padding-block: var(--block-gap) var(--section-padding);
}

.m-block {
  padding-block: var(--block-gap);
}

.m-unit {
  padding-block: var(--text-gap);
}

.m-section-top {
  padding-top: var(--section-padding);
}

/*==================================================
m-basebox
==================================================*/
.m-basebox {
  position: relative;
  padding: var(--box-padding);
  background: #fff;
}
.m-basebox:before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  display: block;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  margin: auto;
  border: 1px solid var(--main-color);
}

/*==================================================
m-message
==================================================*/
.m-message {
  position: relative;
  z-index: 1;
  margin-bottom: 24px;
}
@media all and (max-width: 1079px) {
  .m-message {
    width: calc(100% - 24px);
    margin-inline: auto auto;
  }
}
.m-message:after, .m-message:before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  display: block;
  margin: auto;
}
.m-message:after {
  content: "";
  z-index: -1;
  left: -24px;
  bottom: -48px;
  width: calc(100% + 48px);
  height: 100%;
  background: linear-gradient(90deg, #023395 0%, #057CCE 100%);
}
@media all and (max-width: 1079px) {
  .m-message:after {
    width: calc(100% + 24px);
    left: -12px;
    bottom: -24px;
  }
}
.m-message:before {
  content: "";
  z-index: 0;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  border: 1px solid var(--main-color);
}
.m-message__inner {
  padding: var(--box-padding);
  background: #fff;
}
.m-message__text {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 1em;
}

/*==================================================
m-feature
==================================================*/
.m-features {
  display: grid;
  gap: var(--text-gap);
}

.m-feature {
  position: relative;
  display: grid;
  gap: var(--block-padding);
  grid-template-columns: 40fr 60fr;
  padding: var(--block-gap);
  background: #fff;
}
@media all and (max-width: 767px) {
  .m-feature {
    grid-template-columns: 1fr;
  }
}
.m-feature:before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 160px;
  height: 160px;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
  background: #E4F1FA;
}
.m-feature--light:before {
  background: color-mix(in srgb, #E4F1FA 50%, white);
}
.m-feature__img {
  position: relative;
}
@media all and (max-width: 767px) {
  .m-feature__img {
    order: 1;
  }
}
.m-feature__texts {
  position: relative;
}
@media all and (max-width: 767px) {
  .m-feature__texts {
    padding: 2;
  }
}
.m-feature__title {
  display: grid;
  align-items: center;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--main-color);
  font-size: var(--font-unit-title);
  font-weight: 500;
  color: var(--main-color);
}
@media all and (max-width: 1079px) {
  .m-feature__title {
    line-height: 1.4;
  }
}
@media all and (max-width: 767px) {
  .m-feature__title {
    gap: 10px;
  }
}
.m-feature__title--no-num {
  grid-template-columns: 1fr;
}
.m-feature__title--large {
  font-size: var(--font-section-title);
}
.m-feature__num {
  aspect-ratio: 1/1;
  display: grid;
  place-content: center;
  width: 100%;
  background: #46B3FE;
  color: #fff;
  font-size: var(--font-block-title);
  font-family: var(--font-en);
  line-height: 1;
}
.m-feature--reverse {
  grid-template-columns: 60fr 40fr;
}
@media all and (max-width: 767px) {
  .m-feature--reverse {
    grid-template-columns: 1fr;
  }
}
.m-feature--reverse:before {
  right: auto;
  left: 0;
  clip-path: polygon(0 0, 0% 100%, 100% 100%);
}
@media all and (max-width: 767px) {
  .m-feature--reverse:before {
    grid-template-columns: 1fr;
  }
}

/*==================================================
m-data-box
==================================================*/
.m-data {
  display: grid;
  gap: var(--text-gap);
}
.m-data__subtitle {
  position: relative;
  margin-bottom: 12px;
  padding-bottom: 12px;
  padding-left: 36px;
  border-bottom: 1px solid var(--main-color);
  color: var(--main-color);
  font-size: var(--font-large);
  font-weight: 500;
}
.m-data__subtitle:before, .m-data__subtitle:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  top: 7px;
  display: block;
}
.m-data__subtitle:after {
  width: 25px;
  height: 25px;
  clip-path: polygon(0% 100%, 100% 0%, 100% 100%);
  background: #69C2FE;
}
.m-data__subtitle:before {
  width: 24px;
  height: 24px;
  background: var(--main-color);
}

/*==================================================
m-num-data
==================================================*/
.m-num-data {
  display: grid;
  gap: var(--text-gap);
}
.m-num-data__count {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1/1;
  background: var(--main-color);
  font-family: var(--font-en);
  color: #fff;
  line-height: 1;
}
.m-num-data__title {
  display: grid;
  grid-template-columns: 40px 1fr;
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-size: var(--font-unit-title);
  gap: 10px;
  border-bottom: 1px solid var(--main-color);
  color: var(--main-color);
  font-weight: 500;
}
@media all and (max-width: 767px) {
  .m-num-data__title {
    align-items: center;
  }
}
/*==================================================
m-text-fata
==================================================*/
.m-text-data {
  padding: 26px 32px 32px 32px;
  border-top: 6px solid var(--main-color);
  background: #fff;
}
@media all and (max-width: 1079px) {
  .m-text-data {
    padding: 26px 18px 18px 18px;
  }
}
.m-text-data__title {
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--main-color);
  text-align: center;
  font-size: var(--font-unit-title);
  font-weight: 500;
}
@media all and (max-width: 1079px) {
  .m-text-data__title--small {
    font-size: 1.8rem;
  }
}
@media all and (max-width: 767px) {
  .m-text-data__title--small {
    font-size: var(--font-unit-title);
  }
}
.m-text-data--fit {
  display: grid;
  align-content: start;
  grid-template-rows: 7.5em 1fr;
}
@media all and (max-width: 767px) {
  .m-text-data--fit {
    display: block;
  }
}
/*==================================================
m-flow
==================================================*/
.m-flow {
  position: relative;
  margin-top: 20px;
  padding: var(--block-gap);
  background: #fff;
}
@media all and (max-width: 767px) {
  .m-flow {
    margin-top: 10px;
  }
}
.m-flow:after {
  position: absolute;
  content: "";
  z-index: 1;
  right: 0;
  bottom: 0;
  width: 78px;
  height: 78px;
  background: var(--light-color);
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
.m-flow__title {
  margin-bottom: 8px;
  font-size: var(--font-unit-title);
  text-align: center;
  line-height: 1.4;
}
.m-flow__num {
  position: absolute;
  display: grid;
  place-items: center;
  left: 0;
  right: 0;
  top: -22px;
  width: var(--box-padding);
  height: var(--box-padding);
  margin: auto;
  border-radius: 50%;
  background: #41B0FD;
  color: #fff;
  font-size: var(--font-unit-title);
  font-family: var(--font-en);
  line-height: 1;
}
@media all and (max-width: 1079px) {
  .m-flow__num {
    top: -16px;
  }
}
.m-flow__text {
  position: relative;
  z-index: 2;
}
.m-flow--dark:after {
  background: #C9DFEE;
}

/*==================================================
gallery
==================================================*/
.m-gallery {
  margin: 0 -10px;
}
@media all and (max-width: 1079px) {
  .m-gallery {
    width: calc(100% - 40px);
    margin-inline: auto auto;
  }
}
@media all and (max-width: 767px) {
  .m-gallery {
    width: 100%;
    margin: 0;
  }
}
.m-gallery li {
  padding: 0 10px;
}
@media all and (max-width: 767px) {
  .m-gallery li {
    padding: 0;
  }
}
.m-gallery img {
  object-fit: cover;
  aspect-ratio: 400/266;
}
/*==================================================
m-figure
==================================================*/
.m-figure {
  padding: var(--block-gap);
  background: linear-gradient(108deg, #C5E8FF 3.39%, #E3F4FF 52.14%, #C5E8FF 99.97%);
}
.m-figure__title {
  margin-bottom: 32px;
  font-size: var(--font-unit-title);
  text-align: center;
  font-weight: 500;
  color: var(--main-color);
}
@media all and (max-width: 767px) {
  .m-figure__title {
    margin-bottom: 16px;
    line-height: 1.6;
    font-size: 1.6rem;
  }
}
.m-figure__title:after {
  content: "";
  display: block;
  width: 120px;
  margin: 16px auto 0 auto;
}

/*==================================================
m-reservation
==================================================*/
.m-reservation {
  display: grid;
  grid-template-columns: 34fr 51fr 34fr;
  background: var(--main-color);
  color: #fff;
}
@media all and (max-width: 767px) {
  .m-reservation {
    grid-template-columns: 1fr;
  }
}
.m-reservation__img {
  height: 100%;
}
.m-reservation__img img {
  height: 100%;
  object-fit: cover;
}
@media all and (max-width: 767px) {
  .m-reservation__img img {
    height: 100px;
  }
}
.m-reservation__body {
  display: grid;
  gap: var(--text-gap);
  padding: var(--block-gap);
}
@media all and (max-width: 767px) {
  .m-reservation__body {
    padding: 30px;
  }
}
.m-reservation__title {
  text-align: center;
  font-size: var(--font-block-title);
  font-weight: 500;
}
.m-reservation__title:after {
  content: "";
  display: block;
  width: 140px;
  margin-inline: auto auto;
  border-top: 1px solid #fff;
}
.m-reservation__texts {
  display: grid;
  gap: 16px;
}
.m-reservation__button {
  display: grid;
  place-content: center;
  margin-inline: auto auto;
  width: 298px;
  padding: 12px;
  background: #fff;
}
@media all and (max-width: 767px) {
  .m-reservation__button {
    width: 100%;
  }
}
.m-reservation__tel {
  display: inline-block;
  padding-left: 30px;
  color: var(--main-color);
  font-family: var(--font-en);
  font-size: var(--font-large);
  background: url("../img/icons/ico-tel-main-color.svg") no-repeat left center;
}

/*==================================================
m-check-list
==================================================*/
.m-check-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--text-gap) 56px;
}
@media all and (max-width: 767px) {
  .m-check-list {
    grid-template-columns: 1fr;
  }
}
.m-check-list li {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #A3A3A3;
  font-size: var(--font-middle);
}
@media all and (max-width: 767px) {
  .m-check-list li {
    padding: 0 0 12px 0;
    gap: 10px;
  }
}
.m-check-list li:before {
  content: "";
  width: 100%;
  aspect-ratio: 1/1;
  margin-top: 5px;
  background: var(--main-color) url("../img/icons/ico-check.svg") no-repeat center;
}
@media all and (max-width: 767px) {
  .m-check-list li:before {
    margin-top: 2px;
  }
}

/*==================================================
m-textlist
==================================================*/
.m-text-list {
  display: grid;
}
.m-text-list li {
  display: grid;
  grid-template-columns: 8px 1fr;
  gap: 15px;
}
.m-text-list li:before {
  content: "";
  display: block;
  margin-top: 11px;
  aspect-ratio: 1/1;
  width: 8px;
  background: var(--main-color);
  border-radius: 50%;
}

/*==================================================
m-order-list
==================================================*/
.m-order-list {
  display: grid;
  gap: 12px;
}
.m-order-list li {
  display: grid;
  align-items: center;
  gap: 16px;
  grid-template-columns: 36px 1fr;
  line-height: 1.6;
}
.m-order-list__count {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1/1;
  background: var(--main-color);
  font-family: var(--font-en);
  color: #fff;
  line-height: 1;
}

/*==================================================
m-point
==================================================*/
.m-point {
  border-top: 1px solid var(--main-color);
  border-bottom: 1px solid var(--main-color);
  padding: var(--text-gap) var(--block-gap);
}
.m-point__ico {
  position: relative;
  display: block;
  padding-left: 40px;
  font-size: var(--font-unit-title);
  font-weight: 500;
  color: var(--main-color);
}
.m-point__ico:before, .m-point__ico:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  top: 10px;
  display: block;
}
@media all and (max-width: 767px) {
  .m-point__ico:before, .m-point__ico:after {
    top: 3px;
  }
}
.m-point__ico:after {
  width: 25px;
  height: 25px;
  clip-path: polygon(0% 100%, 100% 0%, 100% 100%);
  background: #69C2FE;
}
.m-point__ico:before {
  width: 24px;
  height: 24px;
  background: var(--main-color);
}

/*==================================================
m-faq
==================================================*/
.m-faq {
  display: grid;
  gap: var(--text-gap);
}
.m-faq__box {
  display: grid;
  gap: 14px;
  padding: 28px;
  border-left: 5px solid var(--main-color);
  background: #fff;
}
@media all and (max-width: 767px) {
  .m-faq__box {
    padding: 16px;
  }
}
.m-faq__title, .m-faq__body {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 14px;
}
.m-faq__title {
  font-size: var(--font-large);
  font-weight: 500;
}
@media all and (max-width: 767px) {
  .m-faq__title {
    line-height: 1.6;
    font-size: 1.6rem;
  }
}
@media all and (max-width: 767px) {
  .m-faq__title--align-center {
    display: grid;
    align-items: center;
  }
}
.m-faq__q, .m-faq__a {
  display: grid;
  place-items: center;
  aspect-ratio: 1/1;
  width: 38px;
  font-family: var(--font-en);
  font-size: var(--font-large);
  font-weight: 500;
}
@media all and (max-width: 767px) {
  .m-faq__q, .m-faq__a {
    margin-top: 5px;
  }
}
.m-faq__q {
  background: var(--main-color);
  color: #fff;
}
.m-faq__a {
  border: 1px solid var(--main-color);
  color: var(--main-color);
}
/*==================================================
m-service
==================================================*/
.m-service {
  position: relative;
  background: #fff;
}
.m-service__img {
  display: block;
  object-fit: cover;
  width: 100%;
  height: 216px;
}
.m-service__title {
  padding: 8px;
  background: #41B0FD;
  color: #fff;
  font-size: 1.8rem;
  text-align: center;
  line-height: 1.6;
}
.m-service__text {
  padding: 20px;
}

/*==================================================
m-detail
==================================================*/
.m-detail {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: var(--block-padding);
}
@media all and (max-width: 767px) {
  .m-detail {
    grid-template-columns: 1fr;
  }
}
.m-detail-img {
  align-self: start;
  background: linear-gradient(199deg, #016DBA 12.82%, #1F9FF7 92.83%);
}
@media all and (max-width: 767px) {
  .m-detail-img {
    width: calc(100% - 12px);
  }
}
.m-detail-img img {
  display: block;
  transform: translate(12px, -12px);
}
/*==================================================
m-merit-table
==================================================*/
.m-merit-table {
  margin-bottom: var(--text-gap);
  background: #fff;
}
.m-merit-table th,
.m-merit-table td {
  padding-inline: 0.5em;
  vertical-align: middle;
  border-bottom: 1px solid #96D4FF;
}
.m-merit-table tr:first-child th {
  background: #41B0FD;
}
.m-merit-table tr:nth-child(2) th {
  background: #2496E5;
}
.m-merit-table th {
  width: 10em;
  text-align: center;
  font-weight: 500;
  color: #fff;
}
@media all and (max-width: 767px) {
  .m-merit-table th {
    width: 6.5em;
  }
}
.m-merit-table td {
  padding: 16px 20px;
}
.m-merit-table__list {
  display: grid;
}
.m-merit-table__list li {
  display: grid;
  grid-template-columns: 8px 1fr;
  gap: 12px;
}
.m-merit-table__list li:before {
  content: "";
  display: block;
  margin-top: 11px;
  aspect-ratio: 1/1;
  width: 8px;
  background: var(--main-color);
  border-radius: 50%;
}

/*==================================================
m-price-table
==================================================*/
.m-price-table {
  background: #fff;
}
.m-price-table caption {
  color: #fff;
  background: #41B0FD;
  font-weight: 500;
}
.m-price-table th,
.m-price-table td {
  padding: 16px 20px;
  vertical-align: middle;
  border-bottom: 1px solid #96D4FF;
}
.m-price-table th {
  width: 13.5em;
  background: #2496E5;
  color: #fff;
}
/*==================================================
overview
==================================================*/
.overview {
  padding-block: var(--section-padding);
  background: linear-gradient(180deg, #FFF 25.33%, #E4F1FA 100%);
}
.overview-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: min(var(--site-width), 100%);
  gap: 40px;
  padding-inline: var(--site-padding);
}
@media all and (max-width: 1079px) {
  .overview-row {
    background-size: 180px auto;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 0;
  }
}
@media all and (max-width: 767px) {
  .overview-row {
    grid-template-columns: 1fr;
    gap: 40px;
    background-position: right bottom;
    padding: 0;
  }
}
.overview-img {
  align-self: start;
  position: relative;
  padding: 40px 40px 0 0;
}
@media all and (max-width: 1079px) {
  .overview-img {
    align-self: start;
    padding: 20px;
  }
}
@media all and (max-width: 767px) {
  .overview-img {
    padding: 20px 0 0 20px;
  }
}
.overview-img:before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  background: linear-gradient(199deg, #016DBA 12.82%, #1F9FF7 92.83%);
}
.overview-img img {
  position: relative;
  z-index: 1;
}
.overview-title {
  margin-bottom: 1em;
  color: var(--main-color);
  font-size: var(--font-unit-title);
  letter-spacing: 0.1em;
  line-height: 1.6;
  font-weight: 500;
}
@media all and (max-width: 1079px) {
  .overview-title {
    margin-bottom: 0.5em;
  }
}
.overview-text {
  display: grid;
  gap: 2em;
  max-width: 520px;
}
.overview-body {
  padding-top: 40px;
}
@media all and (max-width: 1079px) {
  .overview-body {
    padding-top: 30px;
  }
}
@media all and (max-width: 767px) {
  .overview-body {
    padding-top: 0;
  }
}
@media all and (max-width: 1079px) {
  .overview-body p {
    font-size: 1.3rem;
  }
}
.overview-subtitle {
  margin: 1.5em 0 0.5em 0;
  font-weight: 500;
  color: var(--main-color);
  font-size: var(--font-large);
}

/*==================================================
m-tel
==================================================*/
.m-tel {
  display: block;
  font-size: var(--font-block-title);
  text-align: center;
}

.toppage-title {
  display: grid;
  gap: 0.125em;
  text-align: center;
}
.toppage-title__line {
  display: flex;
  gap: 0.5em;
  align-items: center;
  width: 100%;
}
.toppage-title__line:before, .toppage-title__line:after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #155680;
}
.toppage-title__en {
  font-size: 9.6rem;
  letter-spacing: 0.125em;
  line-height: 1.1;
  font-family: var(--font-en);
  font-weight: 300;
  background: linear-gradient(90deg, #023395 0%, #01102F 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media all and (max-width: 1079px) {
  .toppage-title__en {
    font-size: 7rem;
  }
}
@media all and (max-width: 767px) {
  .toppage-title__en {
    font-size: 4.5rem;
  }
}
.toppage-title__jp {
  font-size: 2.8rem;
  letter-spacing: 0.05em;
  letter-spacing: 0.14em;
}
@media all and (max-width: 1079px) {
  .toppage-title__jp {
    font-size: 2.2rem;
  }
}
@media all and (max-width: 767px) {
  .toppage-title__jp {
    font-size: 1.8rem;
  }
}

/*==================================================
mv
==================================================*/
.mv {
  width: 100%;
  height: 70vh;
  background: url("../img/mv.webp") no-repeat center/cover;
  color: #fff;
}
@media all and (max-width: 1079px) {
  .mv {
    display: grid;
    place-content: end center;
    height: 640px;
    padding-bottom: 40px;
    background-position: 30% bottom;
  }
}
@media all and (max-width: 767px) {
  .mv {
    height: 520px;
    padding-bottom: 30px;
    background-position: 10% bottom;
  }
}
.mv-inner {
  display: grid;
  gap: 25px;
  max-width: 704px;
  margin-inline: auto auto;
  padding-top: 200px;
}
@media all and (max-width: 1079px) {
  .mv-inner {
    padding: 0 var(--site-padding);
    gap: 15px;
  }
}
@media all and (max-width: 767px) {
  .mv-inner {
    padding: 0 var(--site-padding);
    gap: 15px;
  }
}
.mv-title {
  font-size: 6.4rem;
  letter-spacing: 0.05em;
  line-height: 1.6;
  font-weight: 500;
}
@media all and (max-width: 1079px) {
  .mv-title {
    font-size: 5rem;
    line-height: 1.4;
  }
}
@media all and (max-width: 767px) {
  .mv-title {
    font-size: 3.2rem;
    letter-spacing: normal;
    line-height: 1.4;
  }
}
.mv-title__kana {
  font-size: 5.6rem;
  letter-spacing: inherit;
}
@media all and (max-width: 1079px) {
  .mv-title__kana {
    font-size: 4.6rem;
  }
}
@media all and (max-width: 767px) {
  .mv-title__kana {
    font-size: 2.8rem;
  }
}
.mv-text {
  display: grid;
  gap: 16px;
}
@media all and (max-width: 767px) {
  .mv-text {
    gap: 8px;
  }
}
.mv-text__row {
  width: fit-content;
  padding: 3px 16px 5px 16px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.25);
  color: #00102F;
  font-size: var(--font-unit-title);
  font-weight: 500;
  line-height: 1.8;
}
@media all and (max-width: 767px) {
  .mv-text__row {
    font-size: 1.4rem;
  }
}

/*==================================================
news
==================================================*/
.news {
  padding-block: var(--section-padding);
}
.news-inner {
  display: grid;
  gap: 20px;
  width: min(1180px, 100%);
  margin-inline: auto auto;
  padding: 0 30px;
}
@media all and (max-width: 767px) {
  .news-inner {
    gap: 10px;
    padding-inline: var(--site-padding);
  }
}
.news-title {
  display: flex;
  align-items: flex-end;
  gap: 0.435em;
}
.news-title__en {
  color: var(--main-color);
  font-size: 6.4rem;
  letter-spacing: 0.16em;
  font-weight: 300;
  line-height: 1.1;
  font-family: var(--font-en);
}
@media all and (max-width: 1079px) {
  .news-title__en {
    font-size: 5.6rem;
  }
}
@media all and (max-width: 767px) {
  .news-title__en {
    font-size: 3.2rem;
  }
}
.news-title__jp {
  padding-bottom: 5px;
  font-size: var(--font-unit-title);
  letter-spacing: 0.015em;
  line-height: 1.6;
}
.news-unit {
  display: grid;
  gap: 10px;
  grid-template-columns: 150px 1fr;
  border-bottom: 1px solid var(--main-color);
  padding-block: 20px;
}
@media all and (max-width: 767px) {
  .news-unit {
    grid-template-columns: 70px 1fr;
    padding-block: 10px;
  }
}
.news-unit__day {
  color: var(--main-color);
  font-family: var(--font-en);
}
.l-main .pagination {
  border-top: none;
}

/*==================================================
feature
==================================================*/
.feature {
  background: var(--light-color);
}
.feature-header {
  padding-block: var(--section-padding) var(--block-padding);
}
.feature-contents {
  display: grid;
  gap: var(--block-padding);
  padding-bottom: var(--section-padding);
}
.feature-box {
  padding: 20px var(--site-padding);
  background: #fff;
}
.feature-row {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 1fr;
  width: min(var(--site-width), 100%);
  margin-inline: auto auto;
}
@media all and (max-width: 767px) {
  .feature-row {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media all and (max-width: 1079px) {
  .feature-body {
    padding-right: 20px;
  }
}
.feature-count {
  display: grid;
  justify-content: center;
  color: var(--main-color);
  text-align: center;
  margin-bottom: 30px;
}
@media all and (max-width: 767px) {
  .feature-count {
    margin-bottom: 15px;
  }
}
.feature-count--wh {
  color: #fff;
}
.feature-count__en {
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  font-family: var(--font-en);
}
.feature-count__num {
  display: flex;
  align-items: center;
  gap: 16px;
  line-height: 1;
  font-size: 8rem;
  font-family: var(--font-en);
}
@media all and (max-width: 1079px) {
  .feature-count__num {
    font-size: 6rem;
  }
}
@media all and (max-width: 767px) {
  .feature-count__num {
    font-size: 4rem;
  }
}
.feature-count__num:before, .feature-count__num:after {
  content: "";
  display: block;
  width: 24px;
  border-top: 1px solid;
}
.feature-title {
  margin-bottom: 12px;
  font-family: var(--font-en);
  font-weight: 500;
  color: var(--main-color);
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-size: 3.2rem;
  text-align: center;
}
@media all and (max-width: 1079px) {
  .feature-title {
    font-size: 2.5rem;
    line-height: 1.6;
  }
}
@media all and (max-width: 767px) {
  .feature-title {
    font-size: 1.8rem;
  }
}
.feature-title--wh {
  color: #fff;
}
.feature-text {
  max-width: 412px;
  margin-inline: auto auto;
  line-height: 1.8;
}

/*==================================================
expert
==================================================*/
.expert {
  width: min(var(--site-width), 100%);
  margin-inline: auto auto;
  padding: 0 var(--site-padding) var(--block-padding) var(--site-padding);
  background: url("../img/featrure-img-02.webp") no-repeat center bottom/100% auto;
}
@media all and (max-width: 767px) {
  .expert {
    padding-bottom: 24vw;
    background-size: contain;
  }
}
.expert-body {
  width: min(638px, 100%);
  margin-left: auto;
  padding: 40px;
  background: rgba(2, 51, 149, 0.9);
  color: #fff;
}
@media all and (max-width: 1079px) {
  .expert-body {
    width: 450px;
    padding: 30px 40px;
  }
}
@media all and (max-width: 767px) {
  .expert-body {
    width: 100%;
    padding: 20px;
  }
}

/*==================================================
inclusive
==================================================*/
.inclusive {
  position: relative;
  padding-inline: var(--site-padding);
  padding-bottom: 48px;
}
.inclusive:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: calc(100% - 234px);
  background: linear-gradient(90deg, #023395 0%, #057CCE 100%);
}
.inclusive-body {
  position: relative;
  max-width: 1344px;
  margin-inline: auto auto;
  padding: 170px 70px 70px 70px;
  background-color: #fff;
  background-image: url("../img/feature-03-left-img.webp"), url("../img/feature-04-right-img.webp");
  background-repeat: no-repeat;
  background-position: left top, right top;
  background-size: 467px auto, 437px auto;
}
@media all and (max-width: 1079px) {
  .inclusive-body {
    padding-top: 100px;
    background-size: 35vw auto, 35vw auto;
  }
}
@media all and (max-width: 767px) {
  .inclusive-body {
    padding: 60px 45px 45px 45px;
  }
}
.inclusive-text {
  max-width: 490px;
  margin-inline: auto auto;
  text-align: center;
  line-height: 1.8;
}
@media all and (max-width: 767px) {
  .inclusive-text {
    text-align: left;
  }
}

/*==================================================
medical
==================================================*/
.medical {
  padding: var(--section-padding) 0;
}
.medical-message {
  margin-bottom: 30px;
  text-align: center;
}
@media all and (max-width: 767px) {
  .medical-message {
    text-align: left;
  }
  .medical-message br {
    display: none;
  }
}
.medical-body {
  position: relative;
  margin-top: 38px;
  padding: 0 var(--site-padding) 24px var(--site-padding);
}
@media all and (max-width: 767px) {
  .medical-body {
    margin-top: 24px;
  }
}
.medical-body:before {
  content: "";
  position: absolute;
  z-index: -1;
  display: block;
  right: 0;
  top: 0;
  width: 60%;
  height: 100%;
  clip-path: polygon(510px 0%, 100% 0%, 100% 100%, 0% 100%);
  background: linear-gradient(180deg, #71C5FF 0%, #1F9FF7 100%);
}
@media all and (max-width: 767px) {
  .medical-body:before {
    width: 60%;
    clip-path: polygon(250px 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
.medical-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  max-width: var(--inner-width);
  margin-inline: auto auto;
  border: 15px solid #79C5FA;
  background: linear-gradient(90deg, #016DBA 0%, #057CCE 100%);
  color: #fff;
}
@media all and (max-width: 767px) {
  .medical-list {
    grid-template-columns: 100%;
    border-width: 10px;
  }
}
.medical-list a {
  display: grid;
  padding: 22px 120px;
  font-size: var(--font-unit-title);
  border-bottom: 1px solid;
}
@media all and (max-width: 1079px) {
  .medical-list a {
    padding: 24px 36px;
  }
}
.medical-list li:last-child a {
  border-bottom: none;
}
.medical-list__arrow {
  background: url("../img/icons/ico-link-arrow.svg") no-repeat right center;
  font-size: var(--font-unit-title);
}
.medical-list__img img {
  object-fit: cover;
  height: 100%;
}
@media all and (max-width: 767px) {
  .medical-list__img {
    display: none;
  }
}

/*==================================================
greeting
==================================================*/
.greeting {
  padding-block: var(--section-padding);
  background: linear-gradient(180deg, #FFF 25.33%, #E4F1FA 100%);
}
.greeting-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: min(var(--site-width), 100%);
  margin-inline: auto auto;
  margin-top: var(--block-padding);
  padding-inline: var(--site-padding);
  background: url("../img/greeting-bg.webp") no-repeat right top/260px auto;
}
@media all and (max-width: 1079px) {
  .greeting-row {
    background-size: 180px auto;
  }
}
@media all and (max-width: 767px) {
  .greeting-row {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-bottom: 20px;
    background-position: right bottom;
  }
}
.greeting-person {
  position: relative;
  padding: 40px 90px 40px 40px;
}
@media all and (max-width: 1079px) {
  .greeting-person {
    align-self: start;
    padding: 20px;
  }
}
@media all and (max-width: 767px) {
  .greeting-person {
    padding: 20px 0 0 20px;
  }
}
.greeting-person:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 495px;
  max-width: 85%;
  aspect-ratio: 495/523;
  background: linear-gradient(199deg, #016DBA 12.82%, #1F9FF7 92.83%);
}
.greeting-person__img {
  position: relative;
  z-index: 1;
}
.greeting-person__data {
  position: absolute;
  z-index: 2;
  left: 40px;
  bottom: 0;
  padding: 8px 40px;
  background: #fff;
}
@media all and (max-width: 1079px) {
  .greeting-person__data {
    left: 20px;
    padding: 8px 20px;
  }
}
.greeting-person__position {
  border-bottom: 1px solid var(--main-color);
  color: var(--main-color);
  font-size: 2rem;
  font-weight: 500;
}
.greeting-person__name {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-top: 10px;
  line-height: 1;
}
.greeting-person__name [lang=ja] {
  font-size: var(--font-unit-title);
}
.greeting-person__name [lang=en] {
  font-family: var(--font-en);
}
.greeting-person--small {
  padding: 28px 40px 31px 28px;
}
@media all and (max-width: 1079px) {
  .greeting-person--small {
    padding: 14px 0 31px 14px;
  }
}
@media all and (max-width: 767px) {
  .greeting-person--small {
    padding: 28px 0 31px 28px;
  }
}
.greeting-person--small:before {
  width: 376px;
  height: 100%;
}
.greeting-person--small .greeting-person__name [lang=ja] {
  font-size: var(--font-large);
}
@media all and (max-width: 1079px) {
  .greeting-person--small .greeting-person__name [lang=ja] {
    font-size: 1.6rem;
  }
}
.greeting-person--small .greeting-person__name [lang=en] {
  font-size: var(--font-small);
}
@media all and (max-width: 1079px) {
  .greeting-person--small .greeting-person__name [lang=en] {
    font-size: 1.3rem;
  }
}
.greeting-person--small .greeting-person__position {
  font-size: var(--font-middle);
}
.greeting-person--small .greeting-person__data {
  padding: 8px 32px 16px 32px;
  left: 28px;
}
@media all and (max-width: 1079px) {
  .greeting-person--small .greeting-person__data {
    padding: 8px 16px 16px 16px;
  }
}
.greeting-title {
  margin-bottom: 1em;
  color: var(--main-color);
  font-size: 3.2rem;
  letter-spacing: 0.1em;
  line-height: 1.6;
  font-weight: 500;
}
@media all and (max-width: 1079px) {
  .greeting-title {
    font-size: 2.6rem;
  }
}
@media all and (max-width: 767px) {
  .greeting-title {
    font-size: 2.4rem;
  }
}
.greeting-text {
  display: grid;
  gap: 2em;
  max-width: 540px;
}
.greeting-body {
  padding-top: 40px;
}
.greeting-row-small {
  display: grid;
  grid-template-columns: 4.5fr 6fr;
  align-items: start;
  gap: var(--section-padding);
  padding-inline: var(--block-gap);
}
@media all and (max-width: 1079px) {
  .greeting-row-small {
    grid-template-columns: 5fr 6fr;
    gap: 40px;
  }
}
@media all and (max-width: 767px) {
  .greeting-row-small {
    grid-template-columns: 1fr;
  }
}

/*==================================================
clinic
==================================================*/
.clinic {
  padding-block: 120px var(--section-padding);
}
@media all and (max-width: 1079px) {
  .clinic {
    padding-block: 80px;
  }
}
@media all and (max-width: 767px) {
  .clinic {
    padding-block: 60px;
  }
}
.clinic-contents {
  display: grid;
  gap: var(--block-padding);
  width: min(var(--inner-width), 100%);
  margin-inline: auto auto;
  padding: var(--block-padding) var(--site-padding) 0 var(--site-padding);
}
.clinic-title {
  position: relative;
  margin-bottom: 30px;
  padding: 15px 40px;
  background: var(--main-color);
  color: #fff;
  font-size: 2.8rem;
  font-weight: 700;
}
@media all and (max-width: 767px) {
  .clinic-title {
    margin-bottom: 20px;
    padding: 10px 10px;
    font-size: 2rem;
  }
}
.clinic-title:after, .clinic-title:before {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  border-top: 1px solid;
  display: block;
}
.clinic-title:after {
  top: 6px;
}
@media all and (max-width: 767px) {
  .clinic-title:after {
    top: 3px;
  }
}
.clinic-title:before {
  bottom: 6px;
}
@media all and (max-width: 767px) {
  .clinic-title:before {
    bottom: 3px;
  }
}
.clinic-body {
  width: min(100%, 1184px);
  margin-inline: auto auto;
}
.clinic-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 80px;
}
@media all and (max-width: 1079px) {
  .clinic-row {
    gap: 20px;
    grid-template-columns: 1fr 0.7fr;
  }
}
@media all and (max-width: 767px) {
  .clinic-row {
    grid-template-columns: 1fr;
  }
}
.clinic-table {
  margin-block: 24px;
}
.clinic-table th,
.clinic-table td {
  border-top: 1px solid #888;
  text-align: center;
}
@media all and (max-width: 767px) {
  .clinic-table th,
  .clinic-table td {
    padding-block: 5px;
  }
}
.clinic-table tr:last-child td {
  border-bottom: 1px solid #888;
}
.clinic-table th {
  padding-block: 10px;
  font-size: 1.2rem;
  font-weight: 500;
}
@media all and (max-width: 767px) {
  .clinic-table th {
    font-size: 1rem;
    line-height: 1.4;
  }
}
.clinic-table th:first-child {
  width: 10em;
}
@media all and (max-width: 767px) {
  .clinic-table th:first-child {
    width: 9em;
  }
}
.clinic-table__week {
  display: block;
  color: var(--main-color);
  font-size: var(--font-large);
  font-weight: 500;
  font-feature-settings: "palt";
}
.clinic-table td {
  padding-block: 17px;
  vertical-align: middle;
}
.clinic-table td:first-child {
  font-weight: 500;
  font-family: var(--font-en);
  color: var(--main-color);
  text-align: left;
  line-height: 1.6;
  font-size: 1.5rem;
}
@media all and (max-width: 767px) {
  .clinic-table td:first-child {
    font-size: 1.1rem;
  }
}
.clinic-table td:not(:first-child) {
  color: #1F9FF7;
}
.clinic-table svg {
  vertical-align: middle;
}
@media all and (max-width: 767px) {
  .clinic-table svg {
    width: 14px;
  }
}
.clinic-address {
  display: flex;
  gap: 52px;
  margin-bottom: 24px;
  font-style: normal;
}
@media all and (max-width: 767px) {
  .clinic-address {
    display: grid;
    gap: 0;
  }
}
.clinic-map {
  position: relative;
  overflow: hidden;
  height: 579px;
}
@media all and (max-width: 767px) {
  .clinic-map {
    height: 300px;
  }
}
.clinic-map__link {
  position: absolute;
  left: 40px;
  top: 40px;
  width: 360px;
  padding: 22px 30px 22px 34px;
  background: var(--main-color);
  color: #fff;
  font-size: var(--font-unit-title);
  font-family: var(--font-en);
  letter-spacing: 0.05em;
}
@media all and (max-width: 767px) {
  .clinic-map__link {
    left: 20px;
    top: 20px;
    width: 220px;
    padding: 10px 15px;
  }
}
.clinic-map__ico {
  position: relative;
  display: block;
  width: 100%;
  background-image: url("../img/icons/ico-map.svg");
  background-repeat: no-repeat;
  text-align: center;
  line-height: 27px;
}
.clinic-map__ico:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: block;
  width: 13px;
  height: 15px;
  margin: auto;
  clip-path: polygon(0 0%, 0% 100%, 100% 50%);
  background: #fff;
}
.clinic-map__object {
  width: min(1184px, 100%);
  margin-top: -160px;
  height: 739px;
}
.clinic-map--small {
  height: 336px;
  margin-bottom: var(--text-gap);
}
.clinic-map--small .clinic-map__object {
  height: 496px;
}
.clinic-map--small .clinic-map__link {
  left: 20px;
  top: 20px;
  width: 190px;
  padding: 11px 14px 9px 19px;
  font-size: 1.4rem;
}
@media all and (max-width: 1079px) {
  .clinic-notice {
    font-size: 1.4rem;
  }
}
@media all and (max-width: 767px) {
  .clinic-notice {
    font-size: 1.3rem;
  }
}

/*==================================================
history
==================================================*/
.history {
  padding: var(--block-gap);
  background: #fff;
}
.history__unit {
  position: relative;
  padding: var(--block-gap);
  border: solid 1px var(--main-color);
}
.history__unit:after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0px;
  display: block;
  width: 120px;
  height: 120px;
  margin: auto;
  clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
  background: var(--light-color);
}
.history__table th,
.history__table td {
  padding-bottom: 1em;
}
.history__table th {
  width: 6em;
  font-weight: 500;
}
.history__table p:not(:last-child) {
  margin-bottom: 0.25em;
}
.history__list {
  display: grid;
  gap: 8px;
}
.history__list li {
  display: grid;
  align-items: center;
  grid-template-columns: 8px 1fr;
  gap: 12px;
}
.history__list li:before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background: var(--main-color);
  border-radius: 50%;
}

/*==================================================
archive
==================================================*/
.archive-data {
  display: grid;
  gap: 10px;
  padding: 30px 0;
  border-bottom: 1px solid var(--main-color);
}
@media all and (max-width: 767px) {
  .archive-data {
    padding: 15px 0;
  }
}
.archive-data__day {
  color: var(--main-color);
  font-family: var(--font-en);
}
.archive-data dt {
  display: grid;
  grid-template-columns: 7em 1fr;
}
@media all and (max-width: 767px) {
  .archive-data dt {
    grid-template-columns: 1fr;
  }
}
/*==================================================
form
==================================================*/
@media all and (max-width: 1079px) {
  .l-main .wrap_contact {
    padding: 0 20px;
  }
}
@media all and (max-width: 767px) {
  .l-main .wrap_contact {
    padding: 0 20px;
  }
}
@media all and (max-width: 767px) {
  .l-main .step_list {
    width: 100%;
  }
}
.l-main .inquiryForm_message .step_catch {
  clear: both;
  display: block;
  padding-top: 40px;
}
@media all and (max-width: 767px) {
  .l-main .inquiryFormTable dd {
    padding-right: 0;
  }
}
@media all and (max-width: 767px) {
  .l-main .inquiryFormTable .btBox {
    margin: 0;
  }
}
.l-main .step_list li span {
  display: grid;
  place-items: center;
  padding: 0;
  line-height: 1;
}
.l-main .wpcf7 form.invalid .wpcf7-response-output,
.l-main .wpcf7 form.unaccepted .wpcf7-response-output,
.l-main .wpcf7 form.payment-required .wpcf7-response-output {
  max-width: 800px;
  margin-inline: auto auto;
}
.l-main .contact-row {
  display: grid;
  grid-template-columns: 5em 1fr 1fr;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.l-main .inquiryFormTable input[type=radio] {
  position: static;
  width: auto;
  opacity: 1;
  appearance: auto;
}
.l-main .inquiryFormTable input[type=radio] + span::before {
  content: none;
}
.l-main .wpcf7-list-item label {
  display: flex;
  align-items: center;
  gap: 5px;
}
.l-main .inquiryFormTable input[type=radio]:checked + span::before {
  content: none;
}
.l-main .inquiryFormTable input[type=radio] {
  margin: 0;
}
.l-main .inquiryFormTable {
  border: none;
}
.l-main textarea.wpcf7-not-valid {
  border: 1px solid #D93636 !important;
  background: #FDD2D2 !important;
}
.l-main .inquiryFormTable .btBox input[type=submit] {
  text-align: center;
}
.l-main .inquiryFormTable .btBox input[type=submit] {
  float: none;
}
.l-main .inquiryFormTable .btBox {
  margin: 0 auto;
}

.l-main .inquiryFormTable .btBox {
  padding-top: 50px;
}

.contact-confirm {
  padding-bottom: 40px;
}
.contact-confirm .inquiryFormTable dd {
  padding: 30px 0 24px;
}

.btn-group p {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}
.btn-group input[type=submit] {
  width: 100% !important;
}
.btn-group .wpcf7-previous {
  cursor: pointer;
  display: block;
  width: 100%;
  padding: 29px 32px 28px 30px;
  border: none;
  margin: 0 auto;
  border-radius: 0 !important;
  font-size: 26px;
  letter-spacing: 0.1em;
  line-height: 1.2;
  color: #fff;
}

/*JS*/
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-slider * {
  outline: none;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: "";
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  z-index: 1;
  display: block;
  height: 56px;
  width: 56px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}
@media all and (max-width: 767px) {
  .slick-prev,
  .slick-next {
    height: 32px;
    width: 32px;
  }
}
.slick-prev:hover, .slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  outline: none;
  background: transparent;
  color: transparent;
}

.slick-prev {
  left: -20px;
  background: url("../img/clinic/arrow-prev.svg") no-repeat center/contain !important;
}
@media all and (max-width: 767px) {
  .slick-prev {
    left: -10px;
  }
}

.slick-next {
  right: -20px;
  background: url("../img/clinic/arrow-next.svg") no-repeat center/contain !important;
}
@media all and (max-width: 767px) {
  .slick-next {
    right: -10px;
  }
}

.slick-dots {
  position: absolute;
  bottom: -40px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
@media all and (max-width: 767px) {
  .slick-dots {
    bottom: -30px;
  }
}
.slick-dots li {
  position: relative;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: #D1D5DB;
  display: block;
  width: 12px;
  height: 12px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  border-radius: 50%;
  cursor: pointer;
}
.slick-dots li button:focus, .slick-dots li button:hover {
  outline: none;
}
.slick-dots li.slick-active button {
  background: #023395;
}

/*SASS MODULE*/



/*支払い方法の追記*/
/* 変数の定義（もし元ファイルで定義されている色があればここに反映させてください） */
:root {
  --color-primary: #000; /* 例として黒を入れています。適宜変更してください */
}

.payment {
  width: 100%;
  background: #eff5ff;
  padding: 100px 0px 270px 0px;
}

.payment__title-wrapper {
  margin-bottom: 60px;
  display: flex;
  align-items: center;
  gap: 40px;
}

.payment__title-bar {
  flex: 1;
  height: 8px;
  background: #fff;
}

.payment__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.payment__title {
  font-size: 56px;
  font-weight: 600;
  color: var(--color-primary);
  text-align: center;
  line-height: 1.4;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.payment__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

.payment__banner {
  width: 100%;
  display: flex;
  justify-content: center;
}

.payment__banner img {
  width: 100%;
  height: auto;
  display: block;
}

.payment__note {
  font-size: 16px;
  color: #2d2d2d;
  text-align: center;
  line-height: 1.8;
}

.btn-area a {
	padding:12px;
	font-size:16px;
	font-weight:500;
	color:#fff;
	width:298px;
	background-color:#023395;
	border:1px solid #023395;
	display:inline-block;
	text-align:center;
	margin-top:20px;
}
.btn-area a:hover {
	color:#023395;
	background-color:#fff;
	border:1px solid #023395;
	transition:all 0.3s;
}
.center {
	text-align:center;
}
.mb-10 {
	margin-bottom:10px;
}

/* レスポンシブ: 1280px以下 */
@media (max-width: 1280px) {
  .payment {
    padding: 80px 0px 220px 0px;
  }
  .payment__title-wrapper {
    margin-bottom: 50px;
    gap: 32px;
  }
  .payment__title-bar {
    height: 7px;
  }
  .payment__title {
    font-size: 42px;
  }
  .payment__content {
    gap: 28px;
  }
  .payment__banner {
    max-width: 700px;
  }
  .payment__note {
    font-size: 15px;
  }
}

/* レスポンシブ: 1024px以下 */
@media (max-width: 1024px) {
  .payment {
    padding: 70px 0px 180px 0px;
  }
  .payment__title-wrapper {
    margin-bottom: 40px;
    gap: 28px;
  }
  .payment__title-bar {
    height: 6px;
  }
  .payment__title {
    font-size: 36px;
  }
  .payment__content {
    gap: 24px;
  }
  .payment__banner {
    max-width: 600px;
  }
  .payment__note {
    font-size: 14px;
  }
}

/* レスポンシブ: 768px以下 */
@media (max-width: 768px) {
  .payment {
    padding: 60px 0px 140px 0px;
  }
  .payment__title-wrapper {
    margin-bottom: 32px;
    gap: 24px;
  }
  .payment__title-bar {
    height: 5px;
  }
  .payment__title {
    font-size: 32px;
  }
  .payment__content {
    gap: 20px;
  }
  .payment__banner {
    max-width: 100%;
  }
  .payment__note {
    font-size: 13px;
  }
}

/* レスポンシブ: 480px以下 */
@media (max-width: 480px) {
  .payment {
    padding: 50px 0px 120px 0px;
  }
  .payment__title-wrapper {
    margin-bottom: 24px;
    gap: 20px;
  }
  .payment__title-bar {
    height: 4px;
  }
  .payment__title {
    font-size: 28px;
  }
  .payment__content {
    gap: 16px;
  }
  .payment__note {
    font-size: 12px;
  }
}


.visually-hd {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.ai_popup_wrapper {
    border: none;
    position: fixed;
    right: 20px;
    bottom: 10px;
    z-index: 9999;
}
.ai_popup_wrapper img{
    max-width: 300px;
}
.ai_popup_wrapper button {
border: none;
background: none;
cursor: pointer;
}
.sp{
	display:none;
}
@media screen and (max-width: 1076px){
	.ai_popup_wrapper {
		bottom: 10%;
		right:0;
	}
}
@media screen and (max-width: 767px){
	.ai_popup_wrapper img{
    max-width: 220px;
}
	.pc{display:none;}
	.sp{display:block;}
}