@charset "UTF-8";
body {
  font-size: 2rem;
  line-height: 1.2;
	font-family: YakuHanJP_Noto, 'Noto Serif JP', serif;
}
.tel {
  letter-spacing: 2.5px;
  font-size:2.5rem;
  font-weight: 400;
  color:#222;
  display:inline-block;
  width: 25rem;
  line-height: 5rem;
}

span { letter-spacing: 0.1rem; }

/*				reset
====================================================*/
html{  margin-top: 0 !important;  }
@media only screen and (max-width: 782px) {
  html{  margin-top: 0 !important;  }
}

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, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 62.5%;
  vertical-align: baseline;
  background: transparent;
}
sup.supText {
	font-size: 86%;
	vertical-align: top;
	position: relative;
	top: 0.2em;
}
body {
  line-height: 1;
  background-color:#fafaff
}
/*#body{
  background: url("../img/home/background.png") no-repeat left 50% / 60% 100%;
  position:relative;
}*/
@media only screen and (max-width: 782px) {
  #body{ padding-top: 1rem; }
}
main, article, aside, dialog, figure, footer, header, hgroup, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
/*  background: transparent;*/
  text-decoration: none;
/*  transition: background 0.5s ease;*/
}
a:hover {
  /*animation: flash 0.7s ease;*/
  opacity: 0.6;
  transition : .6s;
  cursor:pointer;
}


ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  zoom: 1;
}

/*div:before, div:after, ul:before, ul:after, dl:before, dl:after, dd:before, dd:after {
  content: "";
  display: table;
}

div:after, ul:after, dl:after, dd:after {
  clear: both;
}

div, ul, dl, dd {
  zoom: 1;
}
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

li {
  list-style: none;
}

img { vertical-align:top;}

*, *::before, *::after {
    box-sizing: content-box;
}
*, *::before, *::after {
    box-sizing: content-box;
}




h5 {
  font-size: 2.4rem;
  line-height: 1.2; /*2;*/
  margin: 3rem 0 2rem; /*2rem 0 1rem;*/
}
p {
  font-size: 1.8rem;
  line-height: 1.2;
}
span{
  font-size: 1.4rem;
}




/* --------ページにフェード追加-------- */
.fade-layer,
body:before{
    content: '';
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#fff;
    z-index:99999;
}
body.fade-layer-off:before{
    content: none;
}




.aligncenter,
div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
   margin-bottom: 2em;
}

.alignright {
   float: right;
   margin-bottom: 2em;
}


@media only screen and (min-width: 783px) {.sp { display: none !important;}}
img { max-width: 100%;}
p { margin-top:2.5rem;}

@keyframes flash {
	 0% { opacity: 1; }
    10% { opacity: 0.6; }
	100% { opacity: 1; }
}
.flash:hover{ animation: flash 1s 1 ease; text-decoration: none;}

@keyframes bright {
	 0% { filter: brightness(115%); }
	100% { filter: brightness(100%); }
}
.bright:hover{ animation: bright 1s 1 ease; text-decoration: none;}

@keyframes bright2 {
	 0% { filter: brightness(250%); }
	100% { filter: brightness(100%); }
}
.bright2:hover{ animation: bright2 1s 1 ease; text-decoration: none;}

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

@media only screen and (max-width: 782px) {
	body {font-size: 1.4rem; line-height: 180%;}
	.pc { display: none !important;} 
	.sp:not(.contact-table label.sp) { display: block !important;}
	span.sp { display: inline;}
  .sp-block { display: inline-block; } 
}

@media only screen and (max-width: 782px) {
  #body {
     min-width: inherit;
     width: 100%;
     position:relative;
  }
  .jp {word-wrap: break-word;}
}

#body > main {
  position: relative;
  z-index: 1;

}


#footer {
  position: relative;
  z-index: 2;
  color: #fff;
  background-color: #000;
  width: 100%;
}

/*a[target='_blank'] {
  display: inline-block;
  position: relative;
  padding-right: 3rem;
}
a[target='_blank']::before {
  content: "";
  position: absolute;
  right: 0.3rem;
  top: calc(50% - 0.35rem);
  width: 1.4rem;
  height: 1rem;
  border-left: #011b56 0.1rem solid;
  border-bottom: #011b56 0.1rem solid;
  box-sizing: border-box;
}
a[target='_blank']::after {
  content: "";
  position: absolute;
  right: 0;
  top: calc(50% - 0.65rem);
  width: 1.4rem;
  height: 1rem;
  border: #011b56 0.1rem solid;
  box-sizing: border-box;
}*/

.anchor {
  display: inline-block;
	margin-top:-160px;
	padding-top:160px;
}

a.tel,
.tel a { pointer-events: none;}
@media only screen and (max-width: 782px) {
	.anchor {
		margin-top:-5rem;
		padding-top:5rem;
	}
  a.tel, .tel a  { pointer-events: auto;}
}

.flinks {
  padding: 0;
  padding-top: 20rem;
  width: 80%;
  margin: 0 auto;
  max-width: 80rem;
}
.flinks>img {
  margin-top: -75rem;
  transform: translate(0, 50%);
}
.flinks a { color: #fff; font-size: 1.2rem;}

.flinks .bottom {
  display: block;
  font-size: 1.2rem;
  letter-spacing: 0.1rem;
  padding: 0rem 7rem 10rem;
  color: #fff;
  text-align: center;
}
.flinks .footer {
  display: flex;
  justify-content: center;
  margin: 4rem 0 3rem;
}
.flinks .footer li { margin-right: 2rem;}
.flinks p {
  font-size: 1.2rem;
  margin-top: 1rem;
}
.flinks .copy {  transform: none; margin-top: 3rem;}

@media only screen and (max-width: 782px) {
  .flinks {
    padding-top: 0;
  }
  .flinks>img {
    margin-top: -38vw;
    transform: translate(0);
  }
  
  .flinks .bottom {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding: 0 0 18vw;
    font-size: 0.9rem;
    letter-spacing: 0;
  }
  .flinks .footer {
    display: block;
  }
  .flinks .footer li { margin-right: 0;}
  .flinks .footer li + li { margin-left: 1.5rem;}
  .flinks .copy {
    margin-top: 1.5rem;
    text-align: center;
    line-height: 1.5rem;
  }
  .flinks .copy span{
    display: inline-block;
  }
}

/*.flinks a:hover { animation: flash 0.5s ease;text-decoration: underline;}*/



#page-top{
  position: fixed;
  bottom: 5%;
}
.scroll {
  display: inline-block;
  right: 7rem;
  z-index: 3;
  padding: 10px 10px 70px;
  color: #fff;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  opacity: 0;
  animation: fadeIn 2s linear;
  animation-fill-mode: both;
  animation-delay: 3s;
}
.scroll::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0.2rem;
    height: 8rem;
    background: #fff;
/*    animation: sdl 3s ease infinite;*/
}
.scroll::before {
    transition: all 1s ease 0s;
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 2rem;
    height: 0.2rem;
    background: #fff;
    transform-origin: 0 0;
    transform: rotate(-45deg);
/*    animation: arrow1 3s ease infinite;*/
}
.scroll a {
  font-weight: bold;
  position: relative;
  top: -2rem;
  color: #fff;
  font-size: 2rem;
  animation: bound-anim 0.8s infinite;
}
@keyframes bound-anim {
	0%,100% {top: -2rem;}
	30% {top: -5rem;}
	90% {top: -2rem;}
}

.scroll.on {
  display: none;
}
/*
.scroll.on {
    cursor: pointer;
    transform: rotateX(180deg);
}
.scroll.on::after {
    animation: none; 
    background: #152d5f;
}
.scroll.on::before {
    animation: none; 
    background: #152d5f;
}*/
@keyframes fadeIn{
	0%{	opacity: 0;	}
	100%{ opacity: 1;	}
}
@media only screen and (max-width: 782px) {
.scroll {
  right: 2rem;
  bottom: 3rem;
}
.scroll::after{
  height: 5rem;
}
}

/*----     base.css      ↑                           ------*/
