@charset "utf-8";



@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;500;600;700&display=swap");



body,

div,

dl,

dt,

dd,

ul,

ol,

li,

p,

h1,

h2,

h3,

h4,

h5,

h6,

th,

td,

pre,

code,

blockquote,

form,

fieldset,

legend,

input,

textarea,

figcaption,

figure {

  margin: 0;

  padding: 0

}



table {

  border-collapse: collapse;

  border-spacing: 0

}



fieldset,

img {

  border: 0

}



address,

caption,

cite,

code,

dfn,

em,

th,

var {

  font-style: normal;

  font-weight: normal

}



li {

  list-style: none

}



caption,

th {

  text-align: left

}



h1,

h2,

h3,

h4,

h5,

h6 {

  font-size: 100%;

  font-weight: normal

}



q:before,

q:after {

  content: ''

}



abbr,

acronym {

  border: 0;

  font-variant: normal

}



sup {

  vertical-align: text-top

}



sub {

  vertical-align: text-bottom

}



input,

textarea,

select {

  font-family: inherit;

  font-size: inherit;

  font-weight: inherit

}



input,

textarea,

select {

  *font-size: 100%

}



legend {

  color: #FFF

}



hr {

  display: none

}



img {

  vertical-align: bottom

}



select,

input,

button,

textarea {

  font-size: 99%

}



table {

  font-size: inherit;

  font: 100%;

  border-collapse: collapse;

  border-spacing: 0

}



pre,

code,

kbd,

samp,

tt {

  font-family: monospace;

  *font-size: 108%;

  line-height: 100%

}



.hd {

  display: block;

  width: 0;

  height: 0;

  overflow: hidden

}



.cf:before,

.cf:after {

  content: "";

  display: table

}



.cf:after {

  clear: both

}



.cf {

  *zoom: 1

}



article,

aside,

details,

figcaption,

figure,

footer,

header,

hgroup,

hr,

menu,

nav,

section,

main {

  display: block

}



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

  max-height: 999999px;

  outline: none;

}



*:focus {

  outline: none;

}



button {

  background-color: transparent;

  border: none;

  cursor: pointer;

  outline: none;

  padding: 0;

}



/*-----------------------------------------------

 * 01. Template

 * 00. Modal

-------------------------------------------------*/

/*-----------------------------------------------

 * 01. Template

-------------------------------------------------*/

@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 100;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 200;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 300;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 400;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Bold");

  font-weight: bold;

}



body {

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

  background-color: #fff;

  color: #000;

  font-family: "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;

  font-feature-settings: "palt";

  font-size: 14px;

  font-weight: normal;

  letter-spacing: 0.07em;

  line-height: 1.8;

  word-wrap: break-word;

}



.pc {

  display: block;

}



.sp {

  display: none;

}



a {

  color: #222;

}



a:hover {

  text-decoration: none;

}



.ah {

  transition: opacity .3s ease;

}



.ah:hover {

  opacity: .7;

}



::selection {

  background: #6ccfee;

  color: #fff;

}



::-moz-selection {

  background: #6ccfee;

  color: #fff;

}



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

  html {

    font-size: 62.5%;

  }



  body {

    font-size: 10px;

    font-size: 1rem;

    min-width: 320px;

  }



  .sp {

    display: block;

  }



  .pc {

    display: none;

  }



  .ah:hover {

    opacity: 1;

  }

}



/*-----------------------------------------------

 * 00. Modal

-------------------------------------------------*/

.modalBox {

  -webkit-overflow-scrolling: touch;

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

  display: none;

  width: 100%;

  height: 100%;

  overflow: auto;

  position: fixed;

  top: 0;

  left: 0;

  z-index: 9999;

}



.oneModal {

  display: none;

  width: 100%;

  height: 100%;

  position: relative;

  z-index: 1;

}



.oneModalIn {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -ms-flex-align: center;

  -webkit-align-items: center;

  align-items: center;

  height: auto;

  width: 100%;

  min-width: 1200px;

  min-height: 100%;

  margin: 0 auto;

  position: relative;

}



.oneModalIn__cont {

  padding: 50px 0;

}



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

  .oneModalIn {

    min-width: 100%;

  }



  .oneModalIn__cont {

    width: 100%;

    padding: 30px 0;

  }

}



/* closeBtn */

.closeBtn {

  width: 100%;

  height: 100%;

  min-width: 1200px;

  pointer-events: none;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 2;

}



.closeBtn a {

  background: #000 url(../img/common/close.png) no-repeat 0 0 / 100%;

  display: block;

  width: 80px;

  height: 80px;

  pointer-events: auto;

  position: absolute;

  top: 0;

  right: 0;

}



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

  .closeBtn {

    min-width: 100%;

  }



  .closeBtn a {

    width: 40px;

    height: 40px;

  }

}



/* common */

.commonIframe {

  width: 100%;

  height: 100%;

  display: block;

}



/* youtube */

.youtubeIframeWrap {

  width: 920px;

  height: 520px;

}



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

  .youtubeIframeWrap {

    width: 100%;

    height: auto;

    padding-top: 56.25%;

    position: relative;

  }



  .youtubeIframe {

    position: absolute;

    top: 0;

    left: 0;

  }

}



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

  .sp-none {

    display: none

  }

}



.pc-none {

  display: none

}



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

  .pc-none {

    display: block

  }

}



.is-fixed {

  position: fixed;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0

}



.is-none {

  opacity: 0 !important

}



.is-hide {

  display: none

}



/*!

 * ress.css • v1.2.2

 * MIT License

 * github.com/filipelinhares/ress

 */

html {

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  overflow-y: scroll;

  -webkit-text-size-adjust: 100%

}



*,

::before,

::after {

  background-repeat: no-repeat;

  -webkit-box-sizing: inherit;

  box-sizing: inherit

}



::before,

::after {

  text-decoration: inherit;

  vertical-align: inherit

}



* {

  padding: 0;

  margin: 0

}



audio:not([controls]) {

  display: none;

  height: 0

}



hr {

  overflow: visible

}



article,

aside,

details,

figcaption,

figure,

footer,

header,

main,

menu,

nav,

section,

summary {

  display: block

}



summary {

  display: list-item

}



small {

  font-size: 80%

}



[hidden],

template {

  display: none

}



abbr[title] {

  border-bottom: 1px dotted;

  text-decoration: none

}



a {

  background-color: transparent;

  -webkit-text-decoration-skip: objects

}



a:active,

a:hover {

  outline-width: 0

}



code,

kbd,

pre,

samp {

  font-family: monospace, monospace

}



b,

strong {

  font-weight: bolder

}



dfn {

  font-style: italic

}



mark {

  background-color: #ff0;

  color: #000

}



sub,

sup {

  font-size: 75%;

  line-height: 0;

  position: relative;

  vertical-align: baseline

}



sub {

  bottom: -0.25em

}



sup {

  top: -0.5em

}



input {

  border-radius: 0

}



button,

[type="button"],

[type="reset"],

[type="submit"],

[role="button"] {

  cursor: pointer

}



[disabled] {

  cursor: default

}



[type="number"] {

  width: auto

}



[type="search"] {

  -webkit-appearance: textfield

}



[type="search"]::-webkit-search-cancel-button,

[type="search"]::-webkit-search-decoration {

  -webkit-appearance: none

}



textarea {

  overflow: auto;

  resize: vertical

}



button,

input,

optgroup,

select,

textarea {

  font: inherit

}



optgroup {

  font-weight: bold

}



button {

  overflow: visible

}



button::-moz-focus-inner,

[type="button"]::-moz-focus-inner,

[type="reset"]::-moz-focus-inner,

[type="submit"]::-moz-focus-inner {

  border-style: 0;

  padding: 0

}



button:-moz-focusring,

[type="button"]::-moz-focus-inner,

[type="reset"]::-moz-focus-inner,

[type="submit"]::-moz-focus-inner {

  outline: 1px dotted ButtonText

}



button,

html [type="button"],

[type="reset"],

[type="submit"] {

  -webkit-appearance: button

}



button,

select {

  text-transform: none

}



button,

input,

select,

textarea {

  background-color: transparent;

  border-style: none;

  color: inherit

}



select {

  -moz-appearance: none;

  -webkit-appearance: none

}



select::-ms-expand {

  display: none

}



select::-ms-value {

  color: currentColor

}



legend {

  border: 0;

  color: inherit;

  display: table;

  max-width: 100%;

  white-space: normal

}



::-webkit-file-upload-button {

  -webkit-appearance: button;

  font: inherit

}



[type="search"] {

  -webkit-appearance: textfield;

  outline-offset: -2px

}



img {

  border-style: none

}



progress {

  vertical-align: baseline

}



svg:not(:root) {

  overflow: hidden

}



audio,

canvas,

progress,

video {

  display: inline-block

}



@media screen {

  [hidden~="screen"] {

    display: inherit

  }



  [hidden~="screen"]:not(:active):not(:focus):not(:target) {

    position: absolute !important;

    clip: rect(0 0 0 0) !important

  }

}



[aria-busy="true"] {

  cursor: progress

}



[aria-controls] {

  cursor: pointer

}



[aria-disabled] {

  cursor: default

}



::-moz-selection {

  background-color: #b3d4fc;

  color: #000;

  text-shadow: none

}



::selection {

  background-color: #b3d4fc;

  color: #000;

  text-shadow: none

}



html {

  font-size: 62.5%;

  -webkit-box-sizing: border-box;

  box-sizing: border-box

}



*,

*::before,

*::after {

  -webkit-box-sizing: inherit;

  box-sizing: inherit

}



body {

  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  -webkit-font-feature-settings: "palt"1;

  font-feature-settings: "palt"1;

  text-rendering: optimizeLegibility;

  letter-spacing: 0.05em;

  word-wrap: break-word;

  overflow-wrap: break-word;

  color: #222;

  position: relative;

  min-height: 100vh;

  /* mobile viewport bug fix */

  min-height: -webkit-fill-available;

}



html {

  height: -webkit-fill-available;

}



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

  body {

    min-width: auto

  }

}



h1,

h2,

h3,

h4,

h5,

h6 {

  margin: 0;

  font-weight: bold

}



p {

  margin: 0

}



ul,

ol,

dl,

dd {

  margin: 0;

  padding: 0

}



li {

  list-style: none

}



a {

  text-decoration: none;

  -webkit-transition: all .3s;

  transition: all .3s

}



img {

  -webkit-transition: all .3s;

  transition: all .3s

}



strong {

  font-weight: normal

}



img {

  max-width: 100%;

  vertical-align: middle

}



button {

  padding: 0;

  border: none;

  outline: none

}



input {

  border: 0;

  padding: 0;

  outline: none

}



th {

  font-weight: normal

}



a {

  color: #ffa614

}



a:hover {

  opacity: .7

}