@charset "utf-8";

/* header style ここから */
body {
  position: relative;
}

html {
  scroll-behavior: smooth;
}
#top-head {
    width: 100%;
    height: 90px;
    /* opacity: 0.9; */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    /* position: fixed;を外すとハンバーガーメニューが動作しなくなるので注意 */
    z-index: 999;
  }
  #top-head .inner {
    float: left;
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }

  #top-head nav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style-type: none;
    margin-top: 1.5rem;
  }
  /*nav link style*/
  #top-head nav ul li a {
    text-decoration: none;
    padding: 6px;
    font-size: 1rem;
  }
  #top-head nav ul li a:hover {
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
  }
  /* hamburger menu ここから*/
  #nav_toggle {
    display: none;
  }
  /* hamburger menu ここまで*/

  /*logo style*/
  .inner h1 a {
    text-decoration: none;
    font-weight: bold;
      height: 60px;
      margin-top: 0;
  }
  .logo {
    margin-top: 1rem;
    width: 83%;
  }

  /* header style ここまで */

/* スクロールエフェクト ここから */

/* 画面外にいる状態 */
.fadein {
	opacity : 0;
	transform : translate(0px, 100px);
	transition : all 500ms;
	}
/* 画面内に入った状態 */
.fadein.scrollin {
	opacity : 1;
	transform : translate(0px, 0px);
	}

#effect2 .fadein:nth-of-type(2) {
  transition-delay:100ms;
	-moz-transition-delay:100ms;
	-webkit-transition-delay:100ms;
	-o-transition-delay:100ms;
	-ms-transition-delay:100ms;
	}
#effect2 .fadein:nth-of-type(3) {
	transition-delay:200ms;
	-moz-transition-delay:200ms;
	-webkit-transition-delay:200ms;
	-o-transition-delay:200ms;
	-ms-transition-delay:200ms;
	}
#effect2 .fadein:nth-of-type(4) {
	transition-delay:300ms;
	-moz-transition-delay:300ms;
	-webkit-transition-delay:300ms;
	-o-transition-delay:300ms;
	-ms-transition-delay:300ms;
	}
#effect2 .fadein:nth-of-type(5) {
	transition-delay:400ms;
	-moz-transition-delay:400ms;
	-webkit-transition-delay:400ms;
	-o-transition-delay:400ms;
	-ms-transition-delay:400ms;
	}
#effect2 .fadein:nth-of-type(6) {
  transition-delay:500ms;
	-moz-transition-delay:500ms;
	-webkit-transition-delay:500ms;
	-o-transition-delay:500ms;
	-ms-transition-delay:500ms;
	}
#effect2 .fadein:nth-of-type(7) {
	transition-delay:600ms;
	-moz-transition-delay:600ms;
	-webkit-transition-delay:600ms;
	-o-transition-delay:600ms;
	-ms-transition-delay:600ms;
	}
#effect2 .fadein:nth-of-type(8) {
	transition-delay:700ms;
	-moz-transition-delay:700ms;
	-webkit-transition-delay:700ms;
	-o-transition-delay:700ms;
	-ms-transition-delay:700ms;
	}
#effect2 .fadein:nth-of-type(9) {
	transition-delay:800ms;
	-moz-transition-delay:800ms;
	-webkit-transition-delay:800ms;
	-o-transition-delay:800ms;
	-ms-transition-delay:800ms;
	}
#effect2 .fadein:nth-of-type(10) {
	transition-delay:900ms;
	-moz-transition-delay:900ms;
	-webkit-transition-delay:900ms;
	-o-transition-delay:900ms;
	-ms-transition-delay:900ms;
	}

/* スクロールエフェクト ここまで */


/*footerここから*/
/* article,
footer {
    -webkit-box-sizing : border-box;
            box-sizing : border-box;
      margin : 0 auto;
      } */


/*フッターここから */

footer {
  width: 100%;
  margin-top : 15em;
  margin-bottom : 5em;
  text-align:center;
}

footer ul{
	width:100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
	list-style: none;
	margin: 0 auto;
}

footer ul li{

}

footer a{
	text-decoration: none;
    padding: 20px;
	font-size: 14px;
	font-weight: 500;
    display: block;
}

footer a:hover {
    transition: 1s;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
  }

footer > p{
	padding: 20px;
	font-size: 12px;
}

/* フッターここまで */

/*footerここまで*/

/*styles*/

.row{
  margin-bottom: 10px;
}
img{
	width: 100%;
    max-width: 100%;
	height: auto;
}
ul{
	list-style: none;
	padding-inline-start: 0;
}
p{
	margin-bottom: 0;
}
a{
	color:inherit;
}
a:hover{
	text-decoration: none;
	color: inherit;
}

.indent{
    padding-left:1em;
    text-indent:-1em;
}




/* TOPへ戻るここから */
#js-pagetop {
  position: fixed;
  width: 60px;
  height: 60px;
  /*bottom: 50px;
  */right: 50px;
  cursor: pointer;
  z-index: 100;
  background: #fff;
  border: #A5A5A5 5px solid;
  border-radius: 90px;
  -webkit-border-radius: 90px;
  -moz-border-radius: 90px;
  -ms-border-radius: 90px;
  -o-border-radius: 90px;
}

#js-pagetop span img{
  display: block;
  width: 100%;
  color: #fff;
  padding: .6rem;
  margin: 0 auto;
}
#js-pagetop span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 100%;
  transition-duration: 0.5s;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}

#js-pagetop span :hover {
  transform: scale(1.1);
  transition-duration: 0.5s;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
/* TOPへ戻るここまで */

/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 767.98px) {
  #js-pagetop {
    width: 55px;
    height: 55px;
    /* bottom: 70px; */
    right: 9px;
  }
  #js-pagetop span :hover {
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
}
}

/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {

}

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {

}
/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { ... }

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) { ... }

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { ... }