@charset "utf-8";
/* CSS Document */

.jumbotron { /*background:url(../images/main.jpg) center no-repeat; background-size: cover;*/}
.main_v{
	text-align: center;
}
.container{margin-bottom: 5vh;}

body{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}


#main_title{
	font-size: 6rem;
	font-weight: 700;
	font-family: "Arial", "メイリオ";
	line-height: 100%;
	margin-top: 10vh;
	color: white;
	text-align: center;
}


#main_date{
	font-size: 4em;
	font-weight: 700;
	font-family: "Times New Roman", Times, "serif";
	text-align: right;
	/*text-align: left;*/
	margin-left: 50vw;
	margin-top: 10vh;
	line-height: 100%;
}

footer{
	background-image:url("../images/people.jpg");
background-repeat:repeat-x;
	height: 300px;
}

h1{
	font-weight: 700;
}

.row{
	padding-bottom: 10vh;
}

.caption{
	font-size: 2em;
	font-weight: 700;
}

.lead{
	color: darkblue;
	font-weight:700;
}


.sub-title{
	font-size:1.2rem;
	color: #777;
}

.under {
  background: linear-gradient(transparent 50%, #a8eaff 50%);
}

.btn-main{color:#fff;background-color:#f01565;border-color:#f01565;}
.btn-main:hover{color:#fff;background-color:#e30254;border-color:#e30254;}

.modal-content{border-bottom: #f01565 10px solid;}
.modal-backdrop{background: rgba(255,255,255,0.4);}


/*cssのみフェードイン*/
.fade{
   opacity: 0;
   animation-name: fadeIn;
   animation-duration: 2s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;

}

@keyframes fadeIn { 

    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
}



/*cssのみ下からフェードイン*/
.fade-bottom{
   opacity: 0;
   animation-name: fadeIn_b;
   animation-duration: 2s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;

}

@keyframes fadeIn_b { 

  0% {
      opacity: 0;
      transform: translate3d(0, 20px, 0);
    }
    100% {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
}


/*cssのみ左からフェードイン*/
.fade-left{
   opacity: 0;
   animation-name: fadeIn_L;
   animation-duration: 2s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;

}

@keyframes fadeIn_L { 

  0% {
      opacity: 0;
      transform: translate3d(-20px, 0, 0);
    }
    100% {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
}



.scroll_set{
    margin-top: 2vh;
    margin-bottom: 10vh;
    padding-top: 2vh;
    overflow: scroll;
    height: 50vh;
    scrollbar-color: #f01565 #e0e0e0;
    scrollbar-width: thin;
    background-color: #FDDBF8;
}

.scroll_set::-webkit-scrollbar {
  width: 15px;
}
 
 
.scroll_set::-webkit-scrollbar-thumb {
  background: #f01565;
  border-radius:50px;
}


/* スクロール後下からフェードイン（jquery）*/
.slide-bottom {
   opacity: 0;
   transform: translate(0, 20px);
   transition: all 1s ease-out;
 }


/*スクロール後左からフェードイン（jquery）*/
.slide-left {
   opacity: 0;
   transform: translate(-20px, 0);
   transition: all 1s ease-out;
}



@media screen and (max-width: 800px){
	
#main_title{
	font-size: 3rem;
	
}
	
#main_date{
	text-align: right;
	margin-top: 5vh;
	margin-bottom: 10vh;
	font-size: 2.5rem;
	line-height: 120%;
}


	
}