/*====================================================================================================

  Reset CSS

====================================================================================================*/
/*-------------------------------------------------------------------------------
  normalize.css v3.0.2
-------------------------------------------------------------------------------*/
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: bold;
}

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: -0.5em;
}

sub {
  bottom: -0.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, 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 #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

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;
}

*, ::before, ::after {
  background-repeat: no-repeat;
  box-sizing: border-box;
}

img {
  vertical-align: bottom;
  -webkit-backface-visibility: hidden;
}

/*------------------------------------------------------------------------------------------------------------------
font
-------------------------------------------------------------------------------------------------------------------*/

@font-face {
  font-family: "fot rodin pron";
  font-style: normal;
  font-weight: 700;
  src: url("../font/fot_rodinpron_b.woff2") format("woff2"),
    url("../font/fot_rodinpron_b.woff") format("woff"),
    url("../font/fot_rodinpron_b.otf") format("opentype");
  font-display: auto;
}

@font-face {
  font-family: "fot rodin pron";
  font-style: normal;
  font-weight: 600;
  src: url("../font/fot_rodinpron_db.woff2") format("woff2"),
    url("../font/fot_rodinpron_db.woff") format("woff"),
    url("../font/fot_rodinpron_db.otf") format("opentype");
  font-display: auto;
}

/*====================================================================================================

  Base

====================================================================================================*/
.preload * {
  transition: none !important;
  animation: none !important;
}

:root {
  --base-width: 1240px;
  --PC-min-width: 1000px;
  --SP-min-width: 320px;
  --ff-en: 'Roboto', sans-serif;
  --cubic-bezier: cubic-bezier(.23, 1, .32, 1);
  /* --box-shadow: 0 0 25px 0 rgba(var(--color-8),0.05); */
  --box-shadow: 0 0 25px 0 rgba(var(--color-gray02), 0.6);
  --line-height-m: 1.6;
  --line-height-s: 1.4;
  --bg-color:
    /* #f8fbfe */
    #fff;
  --font-color: #3c3c3c;

  /* base color（RGB） */
  --color-dark: 35, 65, 100;
  --color-10: 35, 85, 135;
  --color-8: 50, 115, 180;
  --color-6: 90, 150, 210;
  --color-5: 125, 175, 230;
  --color-4: 175, 205, 245;
  --color-2: 218, 232, 251;
  --color-1: 229, 242, 251;

  /* sub color（RGB） */
  --scolor-10: 242, 146, 12;
  --scolor-8: 244, 166, 12;
  --scolor-6: 247, 188, 73;
  --scolor-5: 249, 206, 122;
  --scolor-4: 251, 224, 170;
  --scolor-1: 255, 250, 238;

  /* color（RGB） */
  --color-gray01: 246, 246, 246;
  --color-gray02: 239, 239, 239;
  --color-blue01: 221, 242, 255;
  --color-blue02: 93, 162, 242;
  --color-blue03: 84, 151, 195;
  --color-blue04: 0, 111, 185;
  --color-yellow01: 255, 253, 198;
  --color-yellow02: 220, 161, 29;
  --color-green: 18, 179, 154;
  --color-dblue: 25, 55, 85;
  --color-ldblue: 40, 75, 115;
  --color-blue: 0, 80, 160;
  --color-lblue: 20, 100, 180;
  /* --color-green: 0,160,120; */
  --color-lgreen: 20, 175, 135;
  --color-red: 222, 58, 55;
  --color-dgray: 80, 95, 110;
  --color-gray: 110, 130, 145;

  /* bg color */
  --bgcolor-gray: #F6F7F8;
  --bgcolor-gray2: #E5E8EC;
  --bgcolor-blue: #E1F0FA;

  /* border color */
  --linecolor-gray: #DDE1E6;
  --linecolor-gray2: #C5CDD4;


  /* accent color（RGB） */
  /*
  --acolor-10: ;
  --acolor-8: ;
  --acolor-6: ;
  --acolor-5: ;
  --acolor-4: ;
  --acolor-1: ;
  */

  /* link color */
  /* --fc-link: rgba(var(--color-8),1); */
  --fc-link: #201615;
  --fc-link-hover: rgba(var(--color-5), 1);

  /* TEL */
  --tel-ic: url("../image/icon/tel_green.svg");
  --tel-fc: rgba(var(--color-green), 1);
  --tel-ic-blue: url("../image/icon/tel_blue.svg");

  /* fancybox thumbnail */
  --fancybox-tmb-bg: rgba(0, 0, 0, 0.2);
  --fancybox-tmb-border-width: 3px;
  /*--fancybox-tmb-border-color: ;*/
  /*--fancybox-progress-color: ;*/
}

.fc-red {
  color: rgba(var(--color-red), 1);
}

@media print, screen and (min-width:641px) {
  :root {
    --line-height: 1.8;
    --side-space: 2em;

    --block-space-unit: 20px;
    --block-space-max: -wbkit-calc(var(--block-space-unit) * 4);
    --block-space-max: calc(var(--block-space-unit) * 5);
    --block-space-2l: -wbkit-calc(var(--block-space-unit) * 4);
    --block-space-2l: calc(var(--block-space-unit) * 4);
    --block-space-l: -webkit-calc(var(--block-space-unit) * 3);
    --block-space-l: calc(var(--block-space-unit) * 3);
    --block-space-m: -webkit-calc(var(--block-space-unit) * 2);
    --block-space-m: calc(var(--block-space-unit) * 2);
    --block-space-s: -webkit-calc(var(--block-space-unit) * 1.5);
    --block-space-s: calc(var(--block-space-unit) * 1.5);

    --box-space-l: 2.5em;
    --box-space-m: 2em;
    --box-space-s: 1.5em;
  }
}

@media screen and (max-width:640px) {
  :root {
    --line-height: 1.7;
    --side-space: 5%;

    --block-space-unit: 0.75em;
    --block-space-max: -webkit-calc(var(--block-space-unit) * 5);
    --block-space-max: calc(var(--block-space-unit) * 5);
    --block-space-2l: -webkit-calc(var(--block-space-unit) * 4);
    --block-space-2l: calc(var(--block-space-unit) * 4);
    --block-space-l: -webkit-calc(var(--block-space-unit) * 3);
    --block-space-l: calc(var(--block-space-unit) * 3);
    --block-space-m: -webkit-calc(var(--block-space-unit) * 2);
    --block-space-m: calc(var(--block-space-unit) * 2);
    --block-space-s: -webkit-calc(var(--block-space-unit) * 1.25);
    --block-space-s: calc(var(--block-space-unit) * 1.25);

    --box-space-l: 1.5em;
    --box-space-m: 1.5em;
    --box-space-s: 1.25em;
  }
}

html,
body {
  height: 100%;
}

body {
  background-color: var(--bg-color);
  color: var(--font-color);
  font-family: "Helvetica Neue",
    'Noto Sans JP', Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo, sans-serif;
  /* font-weight: 300; */
  min-width: var(--SP-min-width);
  line-height: var(--line-height);
  word-wrap: break-word;
  /*  text-align: center; */
}

@media print, screen and (min-width:641px) {
  html {
    min-width: var(--PC-min-width);
  }

  .pc-none {
    display: none !important;
  }
}

@media screen and (max-width:640px) {
  html {
    min-width: 320px;
  }

  .sp-none {
    display: none !important;
  }
}

.js__rpsTable,
.js__rpsBlock {
  overflow: hidden;
}

.js__linkBox {
  cursor: pointer;
}

.clear:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}

.t-nowrap {
  display: inline-block;
}

.lineh-s {
  line-height: var(--line-height-m);
}

.lineh-m {
  line-height: var(--line-height-s);
}

/*--------------------------------------------------------------------------------
  font-size
--------------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
}

body {
  font-size: 1.7rem;
}

:root {
  --fs-max: 2.22em;
  --fs-4l: 2em;
  --fs-3l: 1.66em;
  --fs-2l: 1.44em;
  --fs-l: 1.22em;
  --fs-m: 1.1em;
  --fs-s: 0.9em;
  --fs-2s: 0.88em;
  --fs-3s: 0.77em;
  --fs-min: 0.66em;
}

@media screen and (max-width:640px) {
  html {
    font-size: 58%;
  }

  :root {
    --fs-max: 2em;
    --fs-4l: 1.88em;
    --fs-3l: 1.66em;
    --fs-2l: 1.44em;
  }
}

@media screen and (min-width:1000px) and (max-width:1100px) {
  html {
    font-size: -webkit-calc(0.2em + 0.6vw);
    font-size: calc(0.2em + 0.6vw);
  }
}

@media screen and (min-width:641px) and (max-width:1001px) {
  html {
    font-size: 56%;
  }
}

@media screen and (max-width:560px) {
  html {
    font-size: -webkit-calc(0.4em + 0.5vw);
    font-size: calc(0.4em + 0.5vw);
  }
}

.fs-max {
  font-size: var(--fs-max);
}

.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-s {
  font-size: var(--fs-s);
}

.fs-2s {
  font-size: var(--fs-2s);
}

.fs-3s {
  font-size: var(--fs-3s);
}

.fs-min {
  font-size: var(--fs-min);
}

/*-----------------------------------------------------------------------------------
  img
-----------------------------------------------------------------------------------*/
img {
  max-width: 100%;
  height: auto;
}

img[src$=".svg"] {
  width: 100%;
  height: auto;
}

.ua-pc img.img-hv,
.ua-pc a.img-hv img {
  transition: opacity 0.3s ease-out;
}

.ua-pc img.img-hv:hover,
.ua-pc a.img-hv:hover img {
  opacity: 0.7;
}

/*-----------------------------------------------------------------------------------
  link
-----------------------------------------------------------------------------------*/
a {
  outline: none;
}

a, a:visited, a:hover {
  color: var(--fc-link);
  text-decoration: underline;
}

.ua-pc a:hover,
.ua-pc .js__linkBox:hover a {
  color: var(--fc-link-hover);
  text-decoration: none;
}

.ua-pc a {
  transition: color 0.15s ease-out, opacity 0.15s ease-out, background 0.1s ease-out, border 0.1s ease-out;
}

.ua-pc a[href^="tel:"] {
  pointer-events: none;
  cursor: default;
  color: inherit;
}

.ua-tab a[href^="tel:"][link="uline"],
.ua-sp a[href^="tel:"][link="uline"] {
  text-decoration: underline;
}

a[href^="tel:"], a[href^="tel:"]:visited, a[href^="tel:"]:hover {
  text-decoration: none;
}

/*-----------------------------------------------------------------------------------
  インデント（注釈等）
-----------------------------------------------------------------------------------*/
.f-ind {
  margin-left: 1em;
  text-indent: -1em;
}

.f-ind2 {
  margin-left: 2em;
  text-indent: -2em;
}