@charset "utf-8";
/*--------------------
reset
--------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,picture,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
body {
  background: #fff;
  box-sizing: border-box;
}
article, aside, dialog, figure, footer, header,
hgroup, nav, section {
  display:block;
}
a {
  margin:0;
  padding:0;
  border:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
dl, dt, dd, ul, li, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
picture {
  display: block;
}
img{
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  line-height: 0;
  vertical-align: top;
  border-style: none;
  display: block;
}

/*====================
content
====================*/
body {
  position: relative;
  line-height: 1;
  text-align: left;
  font-family: YuGothic, "游ゴシック体", Yu Gothic, "游ゴシック", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Helvetica Neue", Arial, "メイリオ", Meiryo, sans-serif;
  color: #363636;
  font-weight: 500;
  background-color: rgba(255, 255, 255, 1);
}
#content {
  padding: 0;
  margin: 0;
}
/* a
--------------------*/
a img {
  transition-duration: 0.5s;
}
a:hover img {
  opacity: 0.75;
  transition-duration: 0.5s;
}
a { text-decoration: underline;}
a:hover { text-decoration: none;}
/* wrapper
--------------------*/
#wrapper {
  position: relative;
  max-width: 100vw;
  margin: 0 auto;
  font-size: 1.6rem;
  display: block;
  background: #fff;
  /*box-shadow: 0px 0px 50px 5px rgba(72, 17, 17, 0.2);*/
}
#wrapper h1, h2, h3, p {
  line-height: 1;
  font-size: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0;
  text-align: center;
}
/*====================
header
====================*/
#wrapper header {
}
/*====================
main
====================*/
#wrapper main {
}
#wrapper main .inner {
  position: relative;
}

/* video
--------------------*/
#wrapper main video {
  width: 101%;
  margin: -1% 0 -1% -.5%;
}
#wrapper main .sec3_03 .inner .video_wrap {
  position: absolute;
  top: 3.4%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: calc(658 / 750 * 100%);
  overflow: hidden;
  z-index: 10;
}
#wrapper main .sec3_03 .inner div:first-of-type {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: calc(720 / 750 * 100%);
  z-index: 100;
}
/* btn
--------------------*/
#wrapper .btn {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  max-width: 750px;
  margin: 0 auto;
  z-index: 999;
}
#wrapper .btn .inner {
  position: relative;
}
#wrapper .btn .btn_bg {
  opacity: 0.9;
}
#wrapper .btn a {
  display: block;
  width: 100%;
}
#wrapper .btn p img {
  position: absolute;
  width: calc(332 / 750 * 100%);
  margin: 0 auto;
  bottom: 3%;
  left: 0;
  right: 0;
  opacity: 0;
  transition: all 1.0s;
}
#wrapper .btn .block {
  opacity: 1;
  z-index: 10;
}
/* go_top
--------------------*/
#wrapper .go_top {
  position: absolute;
  width: calc(100/ 750 *100%);
  bottom: 2%;
  right: 2%;
  z-index: 10;
}
/*====================
footer
====================*/
footer {
  font-size: 20px;
  text-align: center;
  color: #ffffff;
  background-color: #224b49;
  padding: 44px;
  margin: 0;
}

@media (width < 750px) {
	footer {
	  font-size: 10px;
	  padding: 22px;
	}
}
#copy {
  margin: 0 auto;
}

/*====================
slider
====================*/
.slider_wrap {
  width: 100%;
  margin: 0 auto;
}
.slick-arrow {
  width: initial !important;
  height: initial !important;
  z-index: 2 !important;
}
.slick-arrow:before {
  font-size: 30px !important;
}
.slick-prev::before, .slick-next::before {
  color: #c9c9c9 !important;
}
.slick-prev, .slick-next {
  top: 52% !important;
}
.slick-dots li {
  width: 8px !important;
  height: 8px !important;
}
.slick-dots li button::before {
  color: #555 !important;
}
.slick-dots li.slick-active button::before {
  color: #ff5e82 !important;
}
.slick-dots li button::before {
  font-size: 8px !important;
  width: 8px !important;
  height: 8px !important;
  line-height: 8px !important;
}

/*====================
media screen     
====================*/


/*====================
 add202510a
====================*/
.flex_box {
  display: flex;
}

.flex_box img:nth-of-type(1) {
  width: calc(391 / 750 * 100%);
}
.flex_box img:nth-of-type(2) {
  width: calc(359 / 750 * 100%);
}

.model .slick-prev {
  display: none !important;
  /*left: 5% !important;*/
}

.model .slick-next {
  display: none !important;
  /*right: 5% !important;*/
}

.slick-dots {
  bottom: -38px !important;
}

.slick-dots li {
    width: 14px !important;
    height: 14px !important;
    margin: 0 8px !important;
}

.slick-dots li button::before {
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
}

.slick-dots li.slick-active button::before {
  color: #f9a63a !important;
}

/*====================
 add202510b
====================*/
.w1400 {
  max-width:1400px;
  margin: 0 auto;
}
#wrapper .float-CTA.btn {
  width:100vw !important;
  max-width: none !important;
}

.float-CTA {
  width:100vw;
  height: auto;
  padding-bottom: 40px;
  background-color: #e5e5e5;
}
@media (width < 750px) {
	.float-CTA {
	  padding-bottom: 20px;
	}
}

.float-CTA .inner {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  gap: 10px;
}

.float-CTA .inner a {
  padding: 0 10px;
}

.CTA .cols img {
  width: 100%;
}

#wrapper section .inner {
  /*position: relative;*/
}

.sec1 h1 {
  width: auto;
  height: clamp(44px, calc((100vw - 751px) * 0.062 + 44px), 84px);
  font-size: clamp(13px, calc((100vw - 375px) * 10 / 905 + 18px), 20px) !important;
  text-align: left !important;
  position: absolute;
  top: 0;
  left: clamp(14px, calc((100vw - 751px) * 0.14 + 110px), 208px);
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.sec1 h1 span:nth-of-type(1) {
  font-size: clamp(18px, calc((100vw - 375px) * 10 / 905 + 18px), 30px) !important;
  color: #1c7d5e;
  letter-spacing: -0.5px;
}

.sec1 h1 span:nth-of-type(2) {
  font-size: clamp(16px, calc((100vw - 375px) * 10 / 905 + 18px), 24px) !important;
  letter-spacing: 1.5px;
}

/* ----------- Media Queries ----------- */
@media (width < 960px) {
  .sec1 h1 {
    font-size: clamp(14px, calc((100vw - 375px) * 0.012 + 14px), 18px) !important;
  }

  .sec1 h1 span:nth-of-type(1) {
    font-size: clamp(18px, calc((100vw - 375px) * 0.015 + 18px), 22px) !important;
    letter-spacing: 1px;
  }

  .sec1 h1 span:nth-of-type(2) {
    font-size: clamp(16px, calc((100vw - 375px) * 0.013 + 16px), 20px) !important;
    letter-spacing: 1px;
  }
}

@media (width < 750px) {
  .sec1 h1 {
    height: clamp(56px, calc((100vw - 375px) * 0.144 + 56px), 110px);
    left: clamp(14px, calc((100vw - 375px) * 0.042857 + 14px), 30px);
  }

  .sec1 h1 span:nth-of-type(1),
  .sec1 h1 span:nth-of-type(2) {
    letter-spacing: 0.5px;
  }
}

.cols {
  display: flex;
}

@media (width < 750px) {
	.CTA_common .cols {
	  display: block;
	}
}

.sec2 {
  background-color: #c6eaed;
}

.slick-slide {
  padding: 16px;
  box-sizing: border-box;
}

.slick-arrow:before {
  font-size: 30px !important;
}
.slick-prev::before,
.slick-next::before {
  color: #8bc0b9 !important;
  filter: drop-shadow(0px 0px 10px rgb(255, 255, 255));
}

.slick-prev {
  width: 30px !important;
  height: 30px !important;
  left: 2% !important;
}
.slick-next {
  width: 30px !important;
  height: 30px !important;
  right: 2% !important;
}

.hall_slider .slick-prev {
  left: 18% !important;
}
.hall_slider .slick-next {
  right: 18% !important;
}
@media (width < 750px) {
	.hall_slider .slick-prev {
	  left: 15% !important;
	}
	.hall_slider .slick-next {
	  right: 15% !important;
	}
}

.voice_slider .slick-prev {
  left: 33% !important;
}
.voice_slider .slick-next {
  right: 33% !important;
}
@media (width < 750px) {
	.voice_slider .slick-prev {
	  left: 3% !important;
	}
	.voice_slider .slick-next {
	  right: 3% !important;
	}
}

section.sec6 {
  padding-bottom: 32px;
}

picture {
  max-width: 1400px;
}

.sec1 {
  background-image:url("../images/pc_sec01_bg.png");
  background-color: #efefef;
  background-repeat: repeat-x;
}

.sec2 {
  background-color: #c6eaed;
}
.sec2-1 {
  background-image:url("../images/pc_sec02_bg.png");
  background-repeat: repeat-x;
}
.sec2-2 {
  background-image:url("../images/pc_sec02-02_bg.png");
  background-color: #ffffff;
  background-repeat: repeat-x;
}
.sec6,
.sec7 {
  background-color: #b4d6cf;
}

.sec8 {
  background-color: #ffffff;
}

.sec10 {
  padding-bottom: 50px;
}
@media (width < 750px) {
	.sec10 {
	  padding-bottom: 30px;
	}
}

.sec1 .inner,
.sec2 .inner,
.sec3 .inner,
.sec4 .inner,
.sec5 .inner,
.sec6 .inner,
.sec7 .inner,
.sec8 .inner,
.sec9 .inner,
.sec10 .inner,
.CTA_common .inner {
  max-width: 1400px;
  margin: 0 auto;
}

.CTA_common {
  max-width: 100vw;
  margin: 0 auto;
  background-image:url("../images/pc_cta_bg.png");
  background-color: #efefef;
  background-repeat: repeat-x;
}

details {
  padding: 0 10px 20px 10px;
}

@media (width < 750px) {
	details {
	  padding: 0 5px 30px 5px;
	}
}

details {
	& .details-title-close {
	  display: block;
	}
	&[open] .details-title-close {
	  display: none;
	}
	& .details-title-open {
	  display: none;
	}
	&[open] .details-title-open {
	  display: block;
	}

  /* --------アコーディオンの中身のスタイル-------- */
  &::details-content {
    transition: height 0.4s, opacity 0.4s, content-visibility 0.4s allow-discrete;
    height: 0;
    opacity: 0;
    overflow: clip;
    background-color: #ffffff;
  }

  /* --------アコーディオンの中身のスタイル（開いている時）-------- */
  &[open]::details-content {
    opacity: 1;
  }
}

@supports (interpolate-size: allow-keywords) {
  :root {
    interpolate-size: allow-keywords; /* height:0（数値型） → auto（文字型） のアニメーションを可能にするための指定 */
  }
  details[open]::details-content {
    height: auto;
  }
}

@supports not (interpolate-size: allow-keywords) {
  details[open]::details-content {
    height: 150px;
    overflow-y: scroll; /* 溢れる場合はスクロール可能にする */
  }
}

summary {
  display: block;
  align-items: center;
  cursor: pointer;

  /* Safariで表示されるデフォルトの三角形アイコンを消します */
  &::-webkit-details-marker {
    display: none;
  }
}