@import"https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&family=Noto+Sans+JP:wght@300;400;500;700&family=Shippori+Mincho+B1:wght@500;700&display=swap";



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

  -moz-box-sizing: border-box;

  -webkit-box-sizing: border-box;

  -ms-box-sizing: border-box

}

html {

  font-size: 62.5%;

  -ms-overflow-style: scrollbar;

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)

}





@-ms-viewport {

  width: device-width

}

article, aside, figcaption, figure, footer, header, hgroup, main, section {

  display: block

}

p, ul, ol, li, dl, dt, dd, p, caption, th, td, form, input, textarea, blockquote, address, embed, object, figure, em {

  margin: 0;

  padding: 0;

  font-style: normal;

  font-size: 100%;

  font-weight: 700

}

h1, h2, h3, h4, h5, h6, h7 {

	    font-family: 'Noto Sans JP';

  margin: 0;

  padding: 0

}

body {

  position: relative;

  margin: 0;

  -webkit-text-size-adjust: 100%;

  -ms-text-size-adjust: 100%;

  -webkit-overflow-scrolling: touch;

  font-family: "Noto Sans JP";

  font-size: 1.4em;

  font-weight: 700; /* 700は通常 bold に相当 */

  line-height: 1;

  color: #000;

  text-align: left;

  text-rendering: optimizeLegibility;

}





}

[tabindex="-1"]:focus {

  outline: 0 !important

}

table {

  border-collapse: collapse;

  border-spacing: 0

}

ol ol, ul ul, ol ul, ul ol {

  margin-bottom: 0

}

dd {

  margin-left: 0

}

blockquote {

  margin: 0 0 1rem

}

figure {

  line-height: 0

}

dfn {

  font-style: italic

}

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: inherit;

  text-decoration: none;

  background-color: rgba(0, 0, 0, 0);

  -webkit-text-decoration-skip: objects

}

a:not([href]):not([tabindex]) {

  color: inherit;

  text-decoration: none

}

a:not([href]):not([tabindex]):focus {

  outline: 0

}

pre, code, kbd, samp {

  font-family: "Noto Sans JP";

  font-size: 1em

}

pre {

  margin-top: 0;

  margin-bottom: 1rem;

  overflow: auto;

  -ms-overflow-style: scrollbar

}

img {

  vertical-align: middle;

  border: none

}

svg:not(:root) {

  overflow: hidden

}

table {

  border-collapse: collapse;

  border-spacing: 0

}

th {

  text-align: inherit

}

label {

  display: inline-block

}

button {

  border-radius: 0

}

button:focus {

  outline: 0

}

input, button, select, optgroup, textarea {

  vertical-align: middle;

  position: relative;

  outline: none;

  margin: 0;

  font-family:"Noto Sans JP";

  font-size: inherit;

  line-height: inherit;

  box-sizing: border-box;

  -moz-box-sizing: border-box;

  -webkit-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -webkit-border-radius: 0;

  -webkit-appearance: none;

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)

}

button, input {

  overflow: visible

}

button, select {

  text-transform: none

}

button, html [type=button], [type=reset], [type=submit] {

  -webkit-appearance: button

}

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

}

[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-cancel-button, [type=search]::-webkit-search-decoration {

  -webkit-appearance: none

}

::-webkit-file-upload-button {

  font: inherit;

  -webkit-appearance: button

}

output {

  display: inline-block

}

* {

  margin: 0;

  padding: 0

}

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-size: 100%;

  color: inherit;

  font-weight: normal;

  font: inherit;

  vertical-align: baseline;

  text-decoration: none;

  box-sizing: border-box

}

strong {

  font-weight: bold

}

html {

  font-size: 62.5%

}

body {

  font-family: "Noto Sans JP";

  font-style: normal;

  font-size: 14px;

  font-size: 1.4em;

  font-weight: 400;

  line-height: 1;

  letter-spacing: .1em;

  color: #000;

  background-color: #fff

}

body.loading {

  overflow: hidden

}

input {

  border: none

}

input[type=submit] {

  -webkit-appearance: none;

  border-radius: 0;

  cursor: pointer

}

textarea {

  resize: none

}

ul {

  list-style-type: none

}

blockquote {

  color: #191919;

  background-color: #f2f2f2;

  position: relative;

  margin-top: 2rem;

  padding: 20px 20px 20px 70px

}

blockquote:before {

  position: absolute;

  top: 25px;

  left: 35px;

  content: '"';

  font-size: 3rem;

  color: #d8d8d8

}

a, a * {

  transition: opacity .75s

}

a:hover, a:hover * {

  opacity: .8;

  filter: alpha(opacity=80)

}

@media screen and (max-width: 559px) {

  a:hover, a:hover p, a:hover img {

    opacity: 1;

    filter: alpha(opacity=100)

  }

}

.d-none {

  display: none !important

}

ol, ul {

  list-style-type: none

}

h1, h2, h3, h4, h5, h6, h7 {

  font-style: normal;

  font-size: 100%;

  font-weight: 700

}

:focus {

  outline: none

}

a {

  outline: none

}

div.pageWrap {

  position: relative;

  width: 100%;

  text-align: left

}

.ofi-img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: center center;

  font-family: "Noto Sans JP";

}

br.pcbr {

  display: none

}

header, .fixed-head {

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  position: fixed;

  height: 62px;

  top: 0;

  left: 50%;

  width: 100%;

  max-width: 450px;

  background: rgba(255,255,255,0.00);

  z-index: 100

}

header  {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-justify-content: space-between;

  justify-content: space-between;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  width: 100%;

  height: 100%

}

header  {

  margin: 0 auto;

  width: 75px;

  height: 62px

}

header . a {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-justify-content: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  transition: .5s ease;

  width: 100%;

  height: 100%

}

footer {

  width: 100%;

  padding: 60px 0 10px;

  background: #fff

}

footer .foot-menu {

  margin: 0 0 60px

}

footer dl:not(:last-of-type) {

  margin: 0 0 40px

}

footer dl.other dt {

  padding: 0 15px;

  text-align: left

}

footer dl.other dd ul {

  padding: 10px 0 30px;



}

footer dl.other dd ul li {

  border: none;

  height: 25px

}

footer dl.other dd ul li:not(:last-child) {

  margin: 0 0 10px

}

footer dl.other dd ul li a:after {

  display: none

}

footer dl dt {

  margin: 0 0 10px;

  font-size: 1.4rem;

  font-weight: 700;

  text-align: center;

  letter-spacing: .12em;

  line-height: 1.5

}

footer dl dd ul {



}

footer dl dd ul li {

  width: 100%;

  height: 55px;

  border-bottom: 1px solid #ededed

}

footer dl dd ul li a {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-justify-content: flex-start;

  justify-content: flex-start;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  position: relative;

  width: 100%;

  height: 100%;

  padding: 0 15px;

  font-size: 1.5rem;

  font-weight: 700

}

footer dl dd ul li a:after {

  position: absolute;

  -webkit-transform: translate(0, -50%);

  transform: translate(0, -50%);

  width: 10px;

  height: 10px;

  border-top: 1px solid #000;

  border-right: 1px solid #000;

  -webkit-transform: translate(0, -50%) rotate(45deg);

  transform: translate(0, -50%) rotate(45deg);

  -webkit-transform-origin: center center;

  transform-origin: center center;

  content: "";

  top: 50%;

  right: 15px;

  margin-top: -3px

}

footer .foot-logo {

  width: 160px;

  max-width: 100%;

  margin: 0 auto 35px

}

footer .foot-logo img {

  width: 100%;

  max-width: 100%

}

footer .foot-copyright {

  font-size: 1rem;

  text-align: center;

  letter-spacing: .02em

}



.container {

  position: relative;

  width: 100%;

  height: auto; /* 固定高さ */

overflow-x: hidden; /* 横方向のオーバーフローを非表示 */



}



 



.page-content {

  position: relative;

  width: 100%;

  max-width: 805px;

  margin: 0 auto;

  padding: 50px 15px 0;

  overflow: hidden



}





button {

  position: relative;

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-justify-content: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  color: #000;

  outline: none;

  border: none;

  background: none;

  letter-spacing: .1em;

  cursor: pointer

}

.orcat dl dt {

  position: relative;

  margin: 0 0 35px;

  padding-top: 50px;

  text-align: center

	  

}

.orcat dl dt:before {

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  content: "";

  top: 0;

  left: 50%;

  width: 40px;

  height: 41px;

  background: none center/contain no-repeat

}

.orcat dl dt span {

  font-size: 2.6rem;

  font-weight: 700;

  text-align: center

	  

}

.orcat dl dt em {

  display: block;

  width: 100%;

  margin-top: 15px;

  font-size: 1.5rem;

  font-style: normal;

  text-align: center;

  letter-spacing: .08em;

  line-height: 1.4

}

.orcat dl dd .vlist {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap

}

.orcat dl dd .vlist li {

  position: relative;

  width: 32%;

  height: 122px;

  margin: 0 0 20px

}

.orcat dl dd .vlist li.coming {

  pointer-events: none

}

.orcat dl dd .vlist li.coming:before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(75, 75, 75, .9);

  z-index: 10;

  mix-blend-mode: multiply;

  z-index: 15

}

.orcat dl dd .vlist li.coming:after {

  position: absolute;

  -webkit-transform: translate(-50%, -50%);

  transform: translate(-50%, -50%);

  white-space: pre;

  content: "Coming\aSoon";

  top: 50%;

  left: 50%;

  color: #fff;

  font-size: 2rem;

  font-weight: 700;

  text-align: center;

  letter-spacing: .08em;

  line-height: 1.3;

  z-index: 15

}

.orcat dl dd .vlist li:not(:nth-child(3n)) {

  margin-right: 2%

}

.orcat dl dd .vlist li a {

  display: block;

  position: relative;

  width: 100%;

  height: 100%;

  font-size: 1.4rem;

  font-weight: 700;

  text-align: center;

  letter-spacing: .05em

}

.orcat dl dd .vlist li a img {

  position: relative;

  top: 3px;

  height: 80px;

  z-index: 10

}

.orcat dl dd .vlist li a:after {

  content: "";

  position: absolute;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100px;

  background: #cde8ff;

  border-bottom: 6px solid #85b9ff;

  z-index: 0;

  border-radius: 10px; /* 任意の角の半径を指定 */

}

.orcat dl dd .vlist li a span {

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  top: auto;

  bottom: 9px;

  left: 50%;

  width: 85%;

  z-index: 1

}



.orcat2 dl dt {

  position: relative;

  margin: 0 0 35px;

  padding-top: 50px;

  text-align: center

}

.orcat2 dl dt:before {

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  content: "";

  top: 0;

  left: 50%;

  width: 40px;

  height: 41px;

  background: none center/contain no-repeat

}

.orcat2 dl dt span {

  font-size: 2.6rem;

  font-weight: 700;

  text-align: center

}

.orcat2 dl dt em {

  display: block;

  width: 100%;

  margin-top: 15px;

  font-size: 1.5rem;

  font-style: normal;

  text-align: center;

  letter-spacing: .08em;

  line-height: 1.4

}

.orcat2 dl dd .vlist {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap

}

.orcat2 dl dd .vlist li {

  position: relative;

  width: 32%;

  height: 122px;

  margin: 0 0 20px

}

.orcat2 dl dd .vlist li.coming {

  pointer-events: none

}

.orcat2 dl dd .vlist li.coming:before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(75, 75, 75, .9);

  z-index: 10;

  mix-blend-mode: multiply;

  z-index: 15

}

.orcat2 dl dd .vlist li.coming:after {

  position: absolute;

  -webkit-transform: translate(-50%, -50%);

  transform: translate(-50%, -50%);

  white-space: pre;

  content: "Coming\aSoon";

  top: 50%;

  left: 50%;

  color: #fff;

  font-size: 2rem;

  font-weight: 700;

  text-align: center;

  letter-spacing: .08em;

  line-height: 1.3;

  z-index: 15

}

.orcat2 dl dd .vlist li:not(:nth-child(3n)) {

  margin-right: 2%

}

.orcat2 dl dd .vlist li a {

  display: block;

  position: relative;

  width: 100%;

  height: 100%;

  font-size: 1.4rem;

  font-weight: 700;

  text-align: center;

  letter-spacing: .05em

}

.orcat2 dl dd .vlist li a img {

  position: relative;

  top: 3px;

  height: 80px;

  z-index: 10

}

.orcat2 dl dd .vlist li a:after {

  content: "";

  position: absolute;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100px;

  background: #f9f2d7;

  border-bottom: 6px solid #9bd8cf;

  z-index: 0;

  border-radius: 10px; /* 任意の角の半径を指定 */	

	

	

}

.orcat2 dl dd .vlist li a span {

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  top: auto;

  bottom: 9px;

  left: 50%;

  width: 85%;

  z-index: 1

}















.gallery-contents .gallery-list li {

  height: 186px

}

.gallery-contents .gallery-list li:not(:last-child) {

  margin-bottom: 3%

}

.gallery-contents .gallery-list li:not(.full) {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap

}

.gallery-contents .gallery-list li:not(.full) figure {

  position: relative;

  width: 48.5%

}

.gallery-contents .gallery-list li:not(.full) figure::before {

  content: "";

  display: block;

  padding-top: 100%

}

.gallery-contents .gallery-list li:not(.full) figure img {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0

}

.gallery-contents .gallery-list li:not(.full) figure:not(:last-child) {

  margin-right: 3%

}

.gallery-contents .gallery-list li.full {

  width: 100%;

  height: 255px

}

@media screen and (min-width: 321px) {

  .minbr {

    display: none

  }

}



@media screen and (min-width: 414px) {

  header .head-inner .global-nav ul li {

    margin: 0 8px

  }

  header .head-inner .global-nav ul li.status {

    width: 30px;

    height: 30px

  }

  header .head-inner .global-nav ul li a {

    width: 30px;

    height: 30px

  }

}

@media screen and (max-width: 414px) {

  .trigger {

    position: absolute;

    -webkit-transform: translate(0, 0);

    transform: translate(0, 0);

    position: fixed;

    right: 30px;

    margin-right: 0

  }

  .p-home .pc_bg {

    display: none

  }

}











@media screen and (max-width: 1025px) {

  .p-home .pc_logo {

    display: none

  }

  .p-home .pc_nav {

    display: none

  }

  .p-home .pc_bnr {

    display: none

  }

}

@media screen and (max-width: 959px)and (orientation: landscape) {

  .loading-animation .loading-img .loading-action {

    right: 0

  }

  .loading-animation .loading-img .loading-action img {

    height: 30px

  }

  .loading-animation .loading-img dl dt {

    margin-bottom: 0

  }

  .loading-animation .loading-img dl dt img {

    height: 120px

  }

  .loading-animation .loading-img dl dd img {

    height: 65px

  }

}

@media screen and (min-width: 960px) {

  br.pcbr {

    display: block

  }

  br.spbr {

    display: none

  }

  div.pageWrap {

    display: -webkit-box;

    display: -webkit-flex;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-direction: column;

    -webkit-flex-direction: column;

    -ms-flex-direction: column;

    flex-direction: column;

    align-items: center;

    width: 100%;

    min-height: 100vh;

    height: 100%;

    margin: 0 auto

  }

  div.container {

    position: relative;

    -webkit-flex: 1 0 auto;

    -ms-flex: 1 0 auto;

    flex: 1 0 auto

  }



  a, a *, button, button * {

    transition: .5s ease

  }

  header .head-inner .global-nav ul li.status {

    transition: .5s ease

  }

  header .head-inner .global-nav ul li.status:hover {

    opacity: .6

  }

  a:hover, button:hover {

    opacity: .6

  }

  .trigger .menu-trigger {

    transition: .5s ease

  }



  .trigger:hover .menu-trigger {

    opacity: .6

  }



}

.modal__overlay {

  cursor: pointer;

  background-color: rgba(30, 30, 30, .9);

  z-index: 101010

}



html {

  scroll-behavior: smooth

}

.p-home .pc_bg {

  position: fixed;

  z-index: 0;

  width: 100%;

  height: 100vh

}

.p-home .pc_bg img {

  position: absolute;

  transition: opacity 1s;

  height: 100%;

  opacity: 0;

  transition-delay: 1s

}

.p-home .pc_logo {

  position: fixed;

  top: 10%;

  left: 5%;

  width: 25%;

  z-index: 0

}

.p-home .pc_logo img {

  position: absolute;

  transition: opacity 1s;

  opacity: 0;

  transition-delay: 1s

}

.p-home .pc_nav {

  position: fixed;

  bottom: 2%;

  left: 5%;

  max-width: 360px;

  z-index: 0

}

.p-home .pc_nav .top_nav {

  display: flex;

  justify-content: space-between;

  flex-wrap: wrap;

  margin-bottom: 10px

}

.p-home .pc_nav .top_nav li {

  width: 30%;

  margin-bottom: 25px

}

.p-home .pc_nav .top_nav li.coming {

  position: relative;

  pointer-events: none

}

.p-home .pc_nav .top_nav li.coming:before {

  content: "";

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  top: 0;

  left: 50%;

  width: 62px;

  height: 55px;

  background: rgba(75, 75, 75, .9);

  z-index: 10;

  mix-blend-mode: multiply;

  z-index: 15

}

.p-home .pc_nav .top_nav li.coming:after {

  position: absolute;

  -webkit-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  white-space: pre;

  content: "Coming\aSoon";

  top: 12px;

  left: 50%;

  color: #fff;

  font-size: 1rem;

  font-weight: 700;

  text-align: center;

  letter-spacing: .08em;

  line-height: 1.3;

  z-index: 15

}

.p-home .pc_nav .top_nav li a {

  display: flex;

  flex-direction: column;

  align-items: center

}

.p-home .pc_nav .top_nav li img {

  width: auto;

  height: 50px;

  margin: 0 auto 10px

}

.p-home .pc_nav .top_nav li p {

  font-size: 14px;

  transition: color 1s;

  transition-delay: 1.1s

}

.p-home .pc_nav .under_nav {

  display: flex;

  justify-content: space-between;

  flex-wrap: wrap

}

.p-home .pc_nav .under_nav li {

  width: 50%;

  margin-bottom: 12px

}

.p-home .pc_nav .under_nav li p {

  font-size: 13px;

  transition: color 1s;

  transition-delay: 1.1s

}

.p-home.bg1 .pc_bg img.pc_bg1 {

  opacity: 1;

  transition-delay: 0

}

.p-home.bg1 .pc_logo img:first-child {

  opacity: 1;

  transition-delay: 0

}

.p-home.bg1 .pc_nav .top_nav li p {

  color: #fff

}

.p-home.bg1 .pc_nav .under_nav li p {

  color: #fff

}

.p-home.bg2 .pc_bg img.pc_bg2 {

  opacity: 1;

  transition-delay: 0

}

.p-home.bg2 .pc_logo img:last-child {

  opacity: 1;

  transition-delay: 0

}

.p-home.bg2 .pc_nav .top_nav li p {

  color: #000

}

.p-home.bg2 .pc_nav .under_nav li p {

  color: #000

}

.p-home.bg3 .pc_bg img.pc_bg3 {

  opacity: 1;

  transition-delay: 0

}

.p-home.bg3 .pc_logo img:first-child {

  opacity: 1;

  transition-delay: 0

}

.p-home.bg3 .pc_nav .top_nav li p {

  color: #fff

}

.p-home.bg3 .pc_nav .under_nav li p {

  color: #fff

}

.p-home .pc_bnr {

  position: fixed;

  bottom: 19%;

  width: 100%;

  bottom: 3%;

  z-index: 0

}

@keyframes fadebnr {

  0% {

    opacity: 0;

    pointer-events: none

  }

  50% {

    opacity: 1;

    pointer-events: auto

  }

  100% {

    opacity: 0;

    pointer-events: none

  }

}

.p-home .pc_bnr a {

  position: absolute;

  width: 380px;

  right: 3%;

  bottom: 0;

  animation-iteration-count: infinite;

  animation-duration: 6s

}

.p-home .pc_bnr a:first-child {

  animation-name: fadebnr;

  animation-delay: -1.5s

}

.p-home .pc_bnr a:nth-child(2) {

  opacity: 0;

  pointer-events: none;

  animation-name: fadebnr;

  animation-delay: 1.5s

}

.p-home .pc_bnr a img {

  width: 100%

}

.l-contents-sp-inner {

  position: relative;

  width: 100%;

  max-width: 450px;

  z-index: 10;

	box-shadow: 0 0 50px rgba(38,38,38,0.85);

}

.l-contents-main {

  background: #fff

}

@media screen and (min-width: 415px) {

  .l-contents-sp {

    position: relative;

    height: auto;

    overflow: hidden

  }

  .l-contents-sp-inner {

    overflow-y: scroll;

    -ms-overflow-style: none;

    scrollbar-width: none;

    height: -webkit-fill-available;

    min-height: -webkit-fill-available;

    height: 100vh;

    min-height: 100vh;

    margin: 0 auto;

    background: #fff;

    scroll-behavior: smooth;

    z-index: 10

  }

  @supports(-webkit-touch-callout: none) {

    .l-contents-sp-inner {

      height: -webkit-fill-available;

      min-height: -webkit-fill-available

    }

  }

}

@media screen and (max-width: 414px) {

  .p-home .pc_logo {

    display: none

  }

  .p-home .pc_nav {

    display: none

  }

  .p-home .pc_bnr {

    display: none

  }

}

.page-content {

  padding: 0 3px

}











.image-s-section {

  position: relative;

  margin-bottom: 45px;

  margin-left: -15px;

  margin-right: -15px

}

.image-s-section h1 img {

  width: 100%

}

.image-s-section .end-icon {

  position: absolute;

  bottom: 15px;

  right: 15px

}

.image-s-section .end-icon figure {

  width: 115px

}

.image-s-section .end-icon figure img {

  width: 100%

}

.image-s-section .end-icon p {

  position: absolute;

  bottom: 22px;

  right: 45px;

  font-size: 4.1rem;

  font-weight: 700

}

.second-image-section {

  position: relative;

  margin-left: -15px;

  margin-right: -15px

}

.second-image-section figure img {

  width: 100%

}









.c-section-head-content {

  position: relative;

  margin-bottom: 20px;

  text-align: center;

  z-index: 5

}

.c-section-head-content p {

  margin-bottom: 15px;

  font-size: 1.6rem;

  font-weight: 700;

  letter-spacing: .05em

}

.c-section-head-content h2 {

  font-size: 2.5rem;

  font-weight: 700;

  letter-spacing: .01em

}

.c-section-head-content h2 span {

  padding-left: 5px;

  color: #ffd23c;

  font-size: 3.4rem;

  font-weight: 700;

  letter-spacing: -0.02em;

  -webkit-text-stroke: 1px #000;

  text-stroke: 1px #000

}



.crs-section {

  position: relative;

  margin: 0 0 50px;

  padding: 50px 0 95px

}

.crs-section:before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  display: block;

  width: 100vw;

  height: 100%;

  margin: 0 calc(50% - 50vw);

  z-index: -1;

  background: #ededed;

  z-index: 0

}

.crs-section ul {

  position: relative

}

.crs-section ul li {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-box-align: center;

  align-items: center;

  position: relative;

  padding: 20px 15px;

  background: #fff;

  -webkit-flex-wrap: nowrap;

  flex-wrap: nowrap

}

.crs-section ul li::before {

  content: "";

  display: block;

  position: absolute;

  bottom: -10px;

  width: 64px;

  height: 17px

}

.crs-section ul li:not(:last-child) {

  margin-bottom: 25px

}

.crs-section ul li:nth-child(odd) {

  border-radius: 27px 27px 27px 22px/24px 24px 24px 9px

}

.crs-section ul li:nth-child(odd)::before {

  left: -13px;

  background: none center center/contain no-repeat

}

.crs-section ul li:nth-child(odd) figure {

  margin-right: 15px

}

.crs-section ul li:nth-child(even) {

  border-radius: 27px 27px 22px 27px/24px 24px 9px 24px;

  flex-direction: row-reverse

}

.crs-section ul li:nth-child(even)::before {

  right: -13px;

  background: none center center/contain no-repeat

}

.crs-section ul li p {

  font-size: 1.5rem;

  font-weight: 700;

  line-height: 1.7;

  letter-spacing: .05em;

  -webkit-flex: 1;

  flex: 1

}

.crs-section ul li p span {

  color: #d85331

}

.crs-section ul li figure {

  position: relative;

  width: 75px;

  height: 72px

}

.crs-section ul li figure img {

  object-fit: contain

}

.crs-section .crs-text {

  position: relative;

  margin-bottom: 35px;

  padding: 30px 0;

  font-size: 3rem;

  font-weight: 700;

  text-align: center;

  line-height: 1.6;

  letter-spacing: .1em

}











.crs-section2 {

  position: relative;

  margin: 0 0 0px;

  padding: 0px 0 0px;

  justify-content: center;

  align-items: center;

	  text-align: center; /* テキストの中央寄せも追加 */

}

.crs-section2:before {



  background: #ededed;



}

.crs-section2 ul {

  position: relative

   

}

.crs-section2 ul li {

  display: -webkit-box;

  display: -webkit-flex;

  display: flex;

  -webkit-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-box-align: center;

  align-items: center;

  position: relative;

  padding: 20px 15px;

  background: #fff9d8;

  -webkit-flex-wrap: nowrap;

  flex-wrap: nowrap

	  

}

.crs-section2 ul li::before {

  content: "";

  display: block;

  position: absolute;

  bottom: -10px;

  width: 64px;

  height: 17px

}

.crs-section2 ul li:not(:last-child) {

  margin-bottom: 13px

}

.crs-section2 ul li:nth-child(odd) {

}



.crs-section2 ul li:nth-child(odd) figure {

  margin-right: 15px

}

.crs-section2 ul li:nth-child(even) {



  flex-direction: row-reverse

}



.crs-section2 ul li p {

  font-size: 1.5rem;

  font-weight: 700;

  line-height: 1.7;

  letter-spacing: .05em;

  -webkit-flex: 1;

  flex: 1

}

.crs-section2 ul li p span {

  color: #d85331

}

.crs-section2 ul li figure {

  position: relative;

  width: 75px;

  height: 72px

}

.crs-section2 ul li figure img {

  object-fit: contain

}

.crs-section2 .crs-text {

  position: relative;

  margin-bottom: 35px;

  padding: 30px 0;

  font-size: 3rem;

  font-weight: 700;

  text-align: center;

  line-height: 0;

  letter-spacing: .1em

}





@media screen and (max-width: 959px) {

  .bg-full::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    display: block;

    width: 100vw;

    height: 100%;

    margin: 0 calc(50% - 50vw);

    z-index: -1;

    background: #f4f2e7

  }

  .crs-section figure {

    position: relative;

    width: 75px;

    height: 72px

  }

  .crs-section figure img {

    object-fit: contain

  }



	

  .crs-section2 figure {

    position: relative;

    width: 75px;

    height: 72px

  }

  .crs-section2 figure img {

    object-fit: contain

  }

	

 

}

@media screen and (max-width: 959px)and (min-width: 667px) {

  .image-s-section .end-icon {

    bottom: 30px;

    right: 15px

  }

  .image-s-section .end-icon figure {

    width: 185px

  }

  .image-s-section .end-icon p {

    bottom: 37px;

    right: 72px;

    font-size: 6rem

  }

}





@media screen and (max-width: 360px) {

  .crs-section figure img {

    width: 100%

  }

  .crs-section .crs-text {

    font-size: 2.6rem

  }

  .crs-section .crs-text::after {

    width: 100%

  }

	

	

	

.crs-section2 figure img {

    width: 100%

  }

  .crs-section2 .crs-text {

    font-size: 2.6rem

  }

  .crs-section2 .crs-text::after {

    width: 100%

  }

	

	

  .image-s-section .end-icon {

    bottom: 10px;

    right: 15px

  }

  .image-s-section .end-icon figure {

    width: 76px

  }

  .image-s-section .end-icon p {

    bottom: 15px;

    right: 30px;

    font-size: 3rem

  }

  }