@charset "utf-8";
/* reset */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
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,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,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}address{font-style:normal}*{margin:0;padding:0}*,:after,:before{background-repeat:no-repeat;box-sizing:border-box}img{vertical-align:bottom;-webkit-backface-visibility:hidden}

/* font */
@font-face {
	font-family: 'GenJyuuGothicX';
	font-style: normal;
	font-weight: 900;
	src: url('../font/GenJyuuGothicX-Heavy.woff2?v=3') format('woff2'), url('../font/GenJyuuGothicX-Heavy.woff?v=3') format('woff'); 
}
@font-face {
	font-family: 'GenJyuuGothicX';
	font-style: normal;
	font-weight: 700;
	src: url('../font/GenJyuuGothicX-Bold.woff2?v=3') format('woff2'), url('../font/GenJyuuGothicX-Bold.woff?v=3') format('woff'); 
}
@font-face {
	font-family: 'GenJyuuGothicX';
	font-style: normal;
	font-weight: 500;
	src: url('../font/GenJyuuGothicX-Medium.woff2?v=3') format('woff2'), url('../font/GenJyuuGothicX-Medium.woff?v=3') format('woff'); 
}
@font-face {
	font-family: 'GenJyuuGothicX';
	font-style: normal;
	font-weight: 400;
	src: url('../font/GenJyuuGothicX-Regular.woff2?v=3') format('woff2'), url('../font/GenJyuuGothicX-Regular.woff?v=3') format('woff'); 
}
@font-face {
	font-family: 'GenJyuuGothicX';
	font-style: normal;
	font-weight: 300;
	src: url('../font/GenJyuuGothicX-Light.woff2?v=3') format('woff2'), url('../font/GenJyuuGothicX-Light.woff?v=3') format('woff'); 
}
@font-face {
	font-family: 'GenJyuuGothicX';
	font-style: normal;
	font-weight: 200;
	src: url('../font/GenJyuuGothicX-ExtraLight.woff2?v=3') format('woff2'), url('../font/GenJyuuGothicX-ExtraLight.woff?v=3') format('woff'); 
}

/*--------------------------------------------------------------------------------
  base
--------------------------------------------------------------------------------*/
:root {
  --side-space: clamp((30px / 3.5), (30 / 500 * 100vw), 30px);
  --side-space-s: clamp((20px / 3.5), (20 / 500 * 100vw), 20px);
  --space-3l: clamp((180px / 2.25), (180 / 500 * 100vw), 180px);
  --space-2l: clamp((120px / 1.75), (120 / 500 * 100vw), 120px);
  --space-l: clamp((80px / 1.5), (100 / 500 * 100vw), 80px);
  --space-m: clamp((60px / 1.5), (60 / 500 * 100vw), 60px);
  --space-s: clamp((40px / 1.5), (40 / 500 * 100vw), 40px);
  --space-2s: clamp((30px / 1.5), (30 / 500 * 100vw), 30px);
  --space-3s: clamp((20px / 1.5), (20 / 500 * 100vw), 20px);
  --fs-5l: 2.6em;
  --fs-4l: 2.2em;
  --fs-3l: 1.8em;
  --fs-2l: 1.5em;
  --fs-l: 1.3em;
  --fs-m: 1.15em;
  --fs-n: 1em;
  --fs-s: 0.85em;
  --fs-2s: 0.75em;
  --fs-3s: 0.65em;
  --black: #28323C;
  --gray: #7A8896;
  --navy: #0F5A7D;
  --blue: #1687BE;
  --bblue: #28B4E1;
  --bblue70: #50C8F0;
  --bblue50: #9CE2FC;
  --bblue20: #DCF8FF;
  --green: #32BEAA;
  --yellow: #FFDA62;
  --orange: #FFB446;
  --pink: #FA7378;
  --bpink: #FA8C8C;
  --bpink20: #FEEEEF;
  --cubic-bezier: cubic-bezier(.23,1,.32,1);
  --hover-trans: color 0.15s ease-in-out, opacity 0.15s ease-in-out, background 0.1s ease-in-out, border 0.1s ease-in-out, fill 0.1s ease-in-out, filter 0.15s ease-in-out;
  --ff-mgo: 'GenJyuuGothicX', sans-serif;
}

/* font size*/
@media screen and (min-width: 961px) {
  :root {
    --fs-break-point: 960px;
    --fs-min: 13px;
    --fs-max: 16px;
    --fs-ratio: calc((16 - 13) / (1600 - 960));
  }
}
@media screen and (max-width: 640px) {
  :root {
    --fs-break-point: 300px;
    --fs-min: 12px;
    --fs-max: 16px;
    --fs-ratio: calc((16 - 12) / (500 - 300));
  }
}
html { font-size: clamp(var(--fs-min), (100vw - var(--fs-break-point)) * var(--fs-ratio) + var(--fs-min), var(--fs-max)); }

html,
body {
  height: 100%;
}
body {
  font-family:
  'Roboto',
  'Helvetica Neue',
  Arial,
  'Hiragino Kaku Gothic ProN',
  'Hiragino Sans',
  'BIZ UDPGothic',
  Meiryo,
  sans-serif;
  color: var(--black);
  min-width: 300px;
  word-wrap: break-word;
  text-align: center;
  line-height: 1.8;
  background-color: #B6E6FC;
}
[data-ruby] {
  position: relative;
}
[data-ruby]:before {
  content: attr(data-ruby);
  position: absolute;
  top: -1.5em;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  margin: auto;
  font-size: var(--fs-2s);
}
rt {
  display: none;
}
.js_rpsTable,
.js_rpsBlock {
  overflow: hidden;
}
.js_linkBox {
  cursor: pointer;
}
.js_iframe iframe {
  pointer-events: none;
  cursor: pointer;
}
.clear:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
.t-nowrap { display: inline-block; }
.t-break { overflow-wrap: break-word; word-break: keep-all; }
.fancybox-slide--html {
  padding: var(--side-space) !important;
}
.fancybox-container * {
  transition: none;
}

.ff-mgo { font-family: var(--ff-mgo); }
.fs-5l { font-size: var(--fs-5l); }
.fs-4l { font-size: var(--fs-4l); }
.fs-3l { font-size: var(--fs-3l); }
.fs-2l { font-size: var(--fs-2l); }
.fs-l { font-size: var(--fs-l); }
.fs-m { font-size: var(--fs-m); }
.fs-n { font-size: var(--fs-n); }
.fs-s { font-size: var(--fs-s); }
.fs-2s { font-size: var(--fs-2s); }
.fs-3s { font-size: var(--fs-3s); }

.fc-gray { color: var(--gray); }
.fc-navy { color: var(--navy); }
.fc-blue { color: var(--blue); }
.fc-bblue { color: var(--bblue); }
.fc-green { color: var(--green); }
.fc-yellow { color: var(--yellow); }
.fc-orange { color: var(--orange); }
.fc-pink { color: var(--pink); }
.fc-bpink { color: var(--bpink); }

/* img
----------------------------------------*/
img {
  max-width: 100%;
  height: auto;
}
img[src$=".svg"] {
  width: 100%;
  height: auto;
}
.svg-icon {
  fill: currentColor;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0.15rem;
}
.svg-icon--newwin {
  width: 1rem;
  height: 1rem;
  margin-left: 0.5rem;
}
@media (hover: hover) {
  img.img-hv,
  a.img-hv img,
  .js_linkBox .img-hv img,
  .js_linkBox img.img-hv {
    transition: opacity 0.2s ease-in-out;
  }
  a .svg-icon {
    transition: var(--hover-trans);
  }
  img.img-hv:hover,
  a.img-hv:hover img,
  .js_linkBox:hover .img-hv img,
  .js_linkBox:hover img.img-hv {
    opacity: 0.6;
  }
}

/* link
----------------------------------------*/
a {
  outline: none;
}
a,
a:visited,
a:hover {
  color: var(--blue);
  text-decoration: underline;
}
@media (hover: hover) {
  a {
    transition: var(--hover-trans);
  }
  a:hover {
    color: var(--bblue);
    text-decoration: none;
  }
  /*
  a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
    color: inherit;
    text-decoration: none;
  }
  */
}

/* margin
----------------------------------------*/
.mg-t05 { margin-top: 0.5rem; }
.mg-t10 { margin-top: 1rem; }
.mg-t15 { margin-top: 1.5rem; }
.mg-t20 { margin-top: 2rem; }
.mg-t25 { margin-top: 2.5rem; }
.mg-t30 { margin-top: 3rem; }
.mg-b05 { margin-bottom: 0.5rem; }
.mg-b10 { margin-bottom: 1rem; }
.mg-b15 { margin-bottom: 1.5rem; }
.mg-b20 { margin-bottom: 2rem; }
.mg-b25 { margin-bottom: 2.5rem; }
.mg-b30 { margin-bottom: 3rem; }

.mg-t-3l { margin-top: var(--space-3l); }
.mg-t-2l { margin-top: var(--space-2l); }
.mg-t-l { margin-top: var(--space-l); }
.mg-t-m { margin-top: var(--space-m); }
.mg-t-s { margin-top: var(--space-s); }
.mg-t-2s { margin-top: var(--space-2s); }
.mg-t-3s { margin-top: var(--space-3s); }
.mg-b-3l { margin-bottom: var(--space-3l); }
.mg-b-2l { margin-bottom: var(--space-2l); }
.mg-b-l { margin-bottom: var(--space-l); }
.mg-b-m { margin-bottom: var(--space-m); }
.mg-b-s { margin-bottom: var(--space-s); }
.mg-b-2s { margin-bottom: var(--space-2s); }
.mg-b-3s { margin-bottom: var(--space-3s); }

/* padding
----------------------------------------*/
.pd-t05 { padding-top: 0.5rem; }
.pd-t10 { padding-top: 1rem; }
.pd-t15 { padding-top: 1.5rem; }
.pd-t20 { padding-top: 2rem; }
.pd-t25 { padding-top: 2.5rem; }
.pd-t30 { padding-top: 3rem; }
.pd-b05 { padding-bottom: 0.5rem; }
.pd-b10 { padding-bottom: 1rem; }
.pd-b15 { padding-bottom: 1.5rem; }
.pd-b20 { padding-bottom: 2rem; }
.pd-b25 { padding-bottom: 3rem; }

.pd-t-3l { padding-top: var(--space-3l); }
.pd-t-2l { padding-top: var(--space-2l); }
.pd-t-l { padding-top: var(--space-l); }
.pd-t-m { padding-top: var(--space-m); }
.pd-t-s { padding-top: var(--space-s); }
.pd-t-2s { padding-top: var(--space-2s); }
.pd-t-3s { padding-top: var(--space-3s); }
.pd-b-3l { padding-bottom: var(--space-3l); }
.pd-b-2l { padding-bottom: var(--space-2l); }
.pd-b-l { padding-bottom: var(--space-l); }
.pd-b-m { padding-bottom: var(--space-m); }
.pd-b-s { padding-bottom: var(--space-s); }
.pd-b-2s { padding-bottom: var(--space-2s); }
.pd-b-3s { padding-bottom: var(--space-3s); }
