@charset "utf-8";
/* CSS Document */
a{
	color: #000;
	text-decoration-line: none;
}
html{
    font-size: 62.5%;
}
.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}
img{
    max-width: 100%;/*その画像がもともと持つ大きさ以上になることはない、以下になると自動縮小*/
    height: auto;/*縦横比を維持*/
    filter: grayscale(100%);
}
.gif{
    filter: grayscale(0);
}
button{
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
}
h1{
    margin-bottom: 20px;
}
h2{
    margin: 0;
    font-family:'Playfair Display',serif;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #F4F4F4;

}
h3{
    color: #F4F4F4;
    font-family:'Playfair Display',serif;
    font-size: 2.5rem;
    line-height: 1.6em;
    margin: 0 auto;
}
h4{
    font-size: 2rem;
    color: #F4F4F4!important;
}
p{
    color: #F4F4F4;
    font-family: 'Playfair Display',serif;
}
ul{
    padding: 0;
}
li:not(:first-of-type){
    padding: 10px 0;
}
.sub-txt{
    color: #F4F4F4;
    list-style: none;
    font-size: 1.2rem;
    font-family: 'Playfair Display',serif;
}
.fab,small{
    color: #ECEBEB;
}
small{
    text-align: center;
}
footer{
    border-top: 1px solid #ECEBEB;
}

/*フォント関連----------------------------------------*/
.font-ss {
    font-size: 1rem;
    line-height: 1.2em;
}
.font-s {
    font-size: 1.2rem;
    line-height: 1.2em;
}
.font-m {
    font-size: 1.4rem;
    line-height: 1.4em;
}
.font-mm {
    font-size: 1.6rem;
    line-height: 1.4em;
}
.font-l {
    font-size: 1.8rem;
    line-height: 1.6em;
}
.font-ll {
    font-size: 3rem;
    line-height: 1.6em;}
.font-lll {
    font-size: 4rem;
    line-height: 1.6em;}
/*utility---------------------------------*/
.wrap{
    max-width: 1260px;
    width: 96%;
    margin: 30px auto;
}
.flex{
    display: flex;
    justify-content: space-between; 
    align-items: center;
}
.flex2{
    display: flex;
    justify-content: space-between; 
    align-items: center;
}
.flex-txt{
    padding: 0;
    margin: 0;
    flex-basis: 40%;
    align-items: center;
}
.flex-img{
    align-self: flex-start;
    flex-basis: 40%;
}
.bg-black{
    background-color: #101010 ;
}
img:hover{
    filter: grayscale(0%);
}
/*ロード画面------------------------------*/
.loading{
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0px;
    left: 0;
    opacity: 1;
    visibility: visible;
    transition: 2s;
    background-color: #000;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;

}
.loading.vanish{
    opacity: 0;
    visibility: hidden;
}
.hidden{
    overflow: hidden;
}
.inherit{
    overflow: inherit;
}
/*ページトップ---------------------------*/
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.6;
  z-index: 7;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;

}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 20px;
  right: 10px;
  left: 0px;
  margin: auto;
  text-align: center;
  transition-delay: 100s;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}
/*タイプライター---------------------------*/
.ityped-cursor {
    font-size: 1em;
    opacity: 1;
    -webkit-animation: blink 0.3s infinite;
    -moz-animation: blink 0.3s infinite;
    animation: blink 0.3s infinite;
    animation-direction: alternate;
}

@keyframes blink {
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes blink {
    100% {
        opacity: 0;
    }
}

@-moz-keyframes blink {
    100% {
        opacity: 0;
    }
}
/*swiper-----------------------------------*/
.swiper-container{
    max-width: 1260px;
    box-sizing: border-box;
    max-height: 400px;
    height: 100%;
}
.swiper-slide{
    box-sizing: border-box;
    padding: 10px;
}
.swiper-slide div{
    height: 300px;
    filter: grayscale(100);
    background-position: center;
}

.swiper-slide p{
    text-align: center;
}
.swiper-slide div:hover{
    filter: grayscale(0);
}
.swiper-pagination{
    position: inherit;
}
.swiper-pagination-bullet{
    width: 30px;
    height: 3px;
    border-radius: 0;
    background-color: #fff;
    text-align: center;
    margin: 0 3px;
}
.swiper-button-next,.swiper-button-prev{
    display: none;    
}
/*swiper更新部分-------------*/
.swiper-01{
    background-image:url("../image/activity/swiper-01.jpg");
    background-size: contain;
}
.swiper-02{
    background-image:url("../image/activity/swiper-02.jpg");
    background-size: contain;
}
.swiper-03{
    background-image:url("../image/activity/swiper-03.jpg");
    background-size: contain;
}
.swiper-04{
    background-image:url("../image/activity/swiper-04.jpg");
    background-size: contain;
}
.swiper-05{
    background-image:url("../image/activity/swiper-05.jpg");
    background-size: contain;
}
.swiper-06{
    background-image:url("../image/activity/swiper-06.jpg");
    background-size: contain;
}
.swiper-07{
    background-image:url("../image/activity/swiper-07.jpg");
    background-size: contain;
}
.swiper-08{
    background-image:url("../image/activity/swiper-08.jpg");
    background-size: contain;
}
.swiper-09{
    background-image:url("../image/activity/swiper-09.jpg");
    background-size: contain;
}
.swiper-10{
    background-image:url("../image/activity/swiper-10.jpg");
    background-size: contain;
}
.swiper-11{
    background-image:url("../image/activity/swiper-11.jpg");
    background-size: contain;
}
/*終わり---------------------------------------------------*/