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;
	list-style: none;
}

body {
    line-height:1;
				word-break: break-all;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,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;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	color: #000;
	text-decoration: none;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
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;
    cursor:help;
}

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

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}
html{
  scroll-behavior: smooth;
}
* {-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box
  }
		
a {
	-webkit-transition: all .6s ease;
	transition: all .6s ease;
}
a:hover {
	-webkit-transition: all .6s ease;
	transition: all .6s ease;
}

  @keyframes animButtonSpan {
    0% {
      transform: translateX(0);
      opacity: 1
    }
    35% {
      transform: translateX(20px);
      opacity: 0
    }
    50.001% {
      transform: translateX(-20px)
    }
    60% {
      transform: translateX(0)
    }
  }
@keyframes zoomUp {
  0% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
@-webkit-keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-1 {
  -webkit-animation: animate-svg-fill-1 0.5s ease 0s both;
  animation: animate-svg-fill-1 0.5s ease 0s both;
}
@-webkit-keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-2 {
  -webkit-animation: animate-svg-fill-2 0.5s ease 0.1s both;
  animation: animate-svg-fill-2 0.5s ease 0.1s both;
}
@-webkit-keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-3 {
  -webkit-animation: animate-svg-fill-3 0.5s ease 0.2s both;
  animation: animate-svg-fill-3 0.5s ease 0.2s both;
}
@-webkit-keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-4 {
  -webkit-animation: animate-svg-fill-4 0.5s ease 0.30000000000000004s both;
  animation: animate-svg-fill-4 0.5s ease 0.30000000000000004s both;
}
@-webkit-keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-5 {
  -webkit-animation: animate-svg-fill-5 0.5s ease 0.4s both;
  animation: animate-svg-fill-5 0.5s ease 0.4s both;
}
@-webkit-keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-6 {
  -webkit-animation: animate-svg-fill-6 0.5s ease 0.5s both;
  animation: animate-svg-fill-6 0.5s ease 0.5s both;
}
@-webkit-keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-7 {
  -webkit-animation: animate-svg-fill-7 0.5s ease 0.6000000000000001s both;
  animation: animate-svg-fill-7 0.5s ease 0.6000000000000001s both;
}
@-webkit-keyframes animate-svg-fill-8 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-8 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-8 {
  -webkit-animation: animate-svg-fill-8 0.5s ease 0.7000000000000001s both;
  animation: animate-svg-fill-8 0.5s ease 0.7000000000000001s both;
}
@-webkit-keyframes animate-svg-fill-9 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-9 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-9 {
  -webkit-animation: animate-svg-fill-9 0.5s ease 0.8s both;
  animation: animate-svg-fill-9 0.5s ease 0.8s both;
}
@-webkit-keyframes animate-svg-fill-10 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
@keyframes animate-svg-fill-10 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(125, 125, 125);
  }
}
.svg-elem-10 {
  -webkit-animation: animate-svg-fill-10 0.5s ease 0.9s both;
  animation: animate-svg-fill-10 0.5s ease 0.9s both;
}
@-webkit-keyframes animate-svg-fill-11 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
@keyframes animate-svg-fill-11 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
.svg-elem-11 {
  -webkit-animation: animate-svg-fill-11 0.5s ease 1s both;
  animation: animate-svg-fill-11 0.5s ease 1s both;
}
@-webkit-keyframes animate-svg-fill-12 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
@keyframes animate-svg-fill-12 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
.svg-elem-12 {
  -webkit-animation: animate-svg-fill-12 0.5s ease 1.1s both;
  animation: animate-svg-fill-12 0.5s ease 1.1s both;
}
@-webkit-keyframes animate-svg-fill-13 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
@keyframes animate-svg-fill-13 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
.svg-elem-13 {
  -webkit-animation: animate-svg-fill-13 0.5s ease 1.2000000000000002s both;
  animation: animate-svg-fill-13 0.5s ease 1.2000000000000002s both;
}
@-webkit-keyframes animate-svg-fill-14 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
@keyframes animate-svg-fill-14 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(21, 172, 193);
  }
}
.svg-elem-14 {
  -webkit-animation: animate-svg-fill-14 0.5s ease 1.3s both;
  animation: animate-svg-fill-14 0.5s ease 1.3s both;
}
@-webkit-keyframes animate-svg-fill-15 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
@keyframes animate-svg-fill-15 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
.svg-elem-15 {
  -webkit-animation: animate-svg-fill-15 0.5s ease 1.4000000000000001s both;
  animation: animate-svg-fill-15 0.5s ease 1.4000000000000001s both;
}
@-webkit-keyframes animate-svg-fill-16 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
@keyframes animate-svg-fill-16 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
.svg-elem-16 {
  -webkit-animation: animate-svg-fill-16 0.5s ease 1.5s both;
  animation: animate-svg-fill-16 0.5s ease 1.5s both;
}
@-webkit-keyframes animate-svg-fill-17 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
@keyframes animate-svg-fill-17 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
.svg-elem-17 {
  -webkit-animation: animate-svg-fill-17 0.5s ease 1.6s both;
  animation: animate-svg-fill-17 0.5s ease 1.6s both;
}
@-webkit-keyframes animate-svg-fill-18 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
@keyframes animate-svg-fill-18 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
.svg-elem-18 {
  -webkit-animation: animate-svg-fill-18 0.5s ease 1.7000000000000002s both;
  animation: animate-svg-fill-18 0.5s ease 1.7000000000000002s both;
}
@-webkit-keyframes animate-svg-fill-19 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
@keyframes animate-svg-fill-19 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(227, 141, 0);
  }
}
.svg-elem-19 {
  -webkit-animation: animate-svg-fill-19 0.5s ease 1.8s both;
  animation: animate-svg-fill-19 0.5s ease 1.8s both;
}




html{
	font-size: 100%;
	overflow-y:scroll;
}

.loading {
  width: 100vw;
  height: 100vh;
		height: -webkit-fill-available;
  transition: all 1s;
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  opacity: 1;
  visibility: visible;
}

.loading.is-active {
  opacity: 0;
  visibility: hidden;
}

.loading-animation {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #fff;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
}

.loading-animation.is-active {
  opacity: 1;
  visibility: visible;
}
/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
}

/*----------------------------
scroll_left ｜左から出現
----------------------------*/
.scroll_left {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(-30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
}
.scroll_left.on {
    opacity: 1.0;
    filter: alpha(opacity=100);
    -moz-opacity: 1.0;
    transform: translateX(0);
}

/*----------------------------
scroll_right ｜右から出現
----------------------------*/
.scroll_right {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
}
.scroll_right.on {
    opacity: 1.0;
    filter: alpha(opacity=100);
    -moz-opacity: 1.0;
    transform: translateX(0);
}
	
.ti02 {transition-delay: .2s;}
.ti03 {transition-delay: .4s;}
.ti04 {transition-delay: .6s;}
.ti05 {transition-delay: .8s;}
.ti06 {transition-delay: 1s;}
.ti07 {transition-delay: 1.2s;}
.ti08 {transition-delay: 1.4s;}
.ti09 {transition-delay: 1.6s;}
	
@keyframes loop-slide {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
