@charset "utf-8";

/* -------------------------------------------------- */
/* file   : base.css                                  */
/* update : 2019                                      */
/* -------------------------------------------------- */

/* -------------------------------------------------- */
/* 全デバイス共通(PC向け) */
/* --------------------------------------------------- */
/* body */
/* -------------------------------------------------- */
body {
  color: #333;
  -webkit-text-size-adjust: 100%;
}
img {
  width: 100%;
  height: auto;
  nax-width:100%;
}

article{position:relative;}

/* link */
/* -------------------------------------------------- */
a {
  color: #fff;
}

a:hover {
  text-decoration: none;
}
.clear{clear:both;}

.spon{text-align:center; color:#FFF; font-size:130%; line-height:2;margin-top:1.5em;}
.yokoku{font-size:80%;  padding-left:1em;}
.t_center{text-align:center;}

.iframe-wrapper{
	  position: relative;
  padding-bottom: 40%;
  height: 0;
  overflow: hidden;
}

.iframe-wrapper2{
	  position: relative;
  padding-bottom: 56%;
  height: 0;
  overflow: hidden;
}

.iframe-wrapper iframe,.iframe-wrapper2 iframe{ 
position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;}

.bg_pattern {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffe9a7;
  opacity: 0.4;
  z-index: -1000;
}

.stripe {
 background:repeating-linear-gradient(
-45deg,
#F3FFE9,
#F3FFE9 20px,
#9ed772 0,
#9ed772 40px
);
}

/* --YouTubeサイズ調整-- */
.video {
position: relative;
height: 0;
padding: 30px 0 0;
overflow: hidden;
width:80%;
height:400px;
margin:0px auto;
}

.video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.fs_mini{font-size:85%;}
/* h */
/* -------------------------------------------------- */
h1 {
  padding: 40px 0 0;
  margin: 0 auto;
  
  width: 69%;
  box-sizing: border-box;
}

h2 {
  font-size: 48px;
  margin: 30px 0 45px;
  color: #fff;
  font-weight: bold;
  letter-spacing: 10px;
}

/* footer */
/* -------------------------------------------------- */
footer {
  text-align: center;
  padding: 0px ;
  font-size: 15px;
}
footer img {
  width: 100%;
  max-width: 550px;
  height: auto;
}
footer .text01 {
  font-size: 18px;
  font-weight: bold;
  margin: 10px 0;
}

/* layout */
/* -------------------------------------------------- */
.mv_wrap {
  /* background: url(../img/bg_mv.jpg) no-repeat center center;
  height:778px;*/
}
.mv {
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
  height: 100%;
}
.mv_img {
  text-align: center;
  max-width: 1141px;
  width: 87.7%;
  margin: 0 auto;
}
.mv .schedule {
  max-width: 1040px;
  padding: 0 20px;
  box-sizing: border-box;
  position: absolute;
  bottom: 5%;
  left: 0;
  right: 0;
  margin: auto;
}
.mv .schedule_wrap {
  display: flex;
  justify-content: flex-start;
  background-color: #fff;
  border-radius: 54px;
  padding: 17px 40px;
}
.mv .schedule .content_l {
  width: 38%;
  border-right: 4px dotted #3f7842;
  display: flex;
  justify-content: flex-start;
}
.mv .schedule .content_l p {
  display: flex;
  align-items: center;
  font-size: 24px;
  font-weight: bold;
  margin-right: 10px;
}
.mv .schedule .content_l img {
  max-width: 251px;
  width: 100%;
}
.mv .schedule .content_r {
  text-align: center;
  margin: 0 auto;
  padding: 5px 0;
  width: 63%;
}
.mv .schedule .content_r .bold {
  font-weight: bold;
  color: #3f7842;
  font-size: 24px;
  margin-bottom: 5px;
}
.mv .schedule .content_r .text {
  font-size: 14px;
  letter-spacing: -0.08em;
  font-weight: bold;
}
.day {
  text-align: center;
  padding: 3px 0;
  background-color: #3ba912;
}
.day_img {
  max-width: 1040px;
  width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  margin: 0 auto;
  text-align: center;
  margin-top:14px;
}
.day_img img {
  max-width: 650px;
  width: 65%;
}

section {
  background: url(../img/bg_sec.jpg) repeat center / auto; 
  text-align: center;
}
.sec_wrap {
  width: 100%;
  max-width: 1040px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 5em 1em;
  text-align: center;
}
.sec_wrap ul {
  max-width: 1000px;
  margin-bottom: 60px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.sec_wrap ul.guest li {
  max-width: 400px;
  width: 40%;
  margin-right: 10%;
  margin-bottom: 10px;
  text-align: center;
}
ul.guest li:nth-child(5),ul.guest li:last-child {
  margin-right: 0;
}

.bg_blue{background:#0da5d7c7;}
.bg_green{background:#6eb949d4;}
.bg_yellow{background:#ebb617d6;}
.bg_white{background:#fff:}

.yokoku .video{
	width:750px;
	height:480px;
	}

/*
.sec_wrap ul li p {
  font-size: 18px;
  font-weight: bold;
  margin-top: 8px;
  line-height: 1.4;
  letter-spacing: 1px;
}
.sec_wrap ul li p span {
  display: block;
  font-size: 16px;
  color: #3f7842;
}
.sec_wrap ul li p.text01 {
  font-size: 12px;
  margin-top: 0px;
  letter-spacing: -0.05em;
}

*/

.about {
	/*background-color: #fff;
	padding:1em;
  background: url(../img/bg_icon1.png) no-repeat 1.5% 2.5% / 55px,
    url(../img/bg_icon3.png) no-repeat 1.5% 97.5% / 110px,
    url(../img/bg_icon2.png) no-repeat 98.5% 2.5% / 85px,
    url(../img/bg_icon1.png) no-repeat 98.5% 97.5% / 55px;
  
  border: 4px solid #4baf00;
  margin-bottom: 80px;
  */
}
.about h2{
  margin: 40px 0 25px;
}

.about_txt{margin:50px auto;}

.about p{
  font-size: 27px;
  font-weight: bold;
  line-height: 2;
  letter-spacing: 2px;
  padding: 0 ;
  text-align: left;
  color:#fff;
}
.about p span{

}

.center {
  text-align: center;
}
.pc {
  display: block;
}
.sp {
  display: none;
}



.pc_head{width:1240px; margin:0 auto; height:240px;}
.pc_foot{width:100%; height:1020px; margin:0 auto; padding:0;}

.tube{width:100%; height:auto; min-height:450px; margin-bottom:100px;}

.mv h1{padding:0; margin:0; width:100%;}
.mv h1 img{width:100%; height:auto;}

p.name{
	position:relative;
	z-index:1;
	text-align:center;
	margin:0 auto;
	width:300px;
	color:#FFF;
	font-size:20px;
	padding:10px;
	margin:-20px auto 0px auto;
	line-height:1.5;
}
p.name:before{
	transform:skewX(-15deg);
	content:"";
	position: absolute;
	top:0; bottom:0; left:-10px; right:0;
	z-index: -1;
	background:#3333ff;
	
	
}

.bg_pink:before{background:#ff3366 !important;}

.bg_green:before{background:#408110 !important;}
.bg_green2:before{background:#8f4c13 !important;}

.t_shadow{text-shadow:2px 2px 0 #FFF, -3px -1px 0 #FFF,
              4px 3px 0 #FFF, 2px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF}

.mb10{margin-bottom:10px !important;}

.coming{width:80%; margin:0 auto 50px auto;}
.ls0{letter-spacing:0;}


/* ---------------------JS CSS----------------------------- */
 html,body{
	height: 100%;/*高さを100%にして描画エリアをとる*/
}

#particles-js{ 
	position:absolute;/*描画固定*/
	z-index:0;/*描画を一番下に*/
	width: 100%;
	height: 100%;
	
}

#wrapper{
	position: relative;/*描画を#particles-jsよりも上にするためposition:relative;を指定*/
	z-index: 1;/*z-indexの数字を大きくすることで描画を#particles-jsよりも上に*/
	width:100%;
	height: 100%;
}
 .animate{position:relative;}
 
  .flex{
	  display:flex;
	  justify-content: center;
	  margin-bottom:5em;
  }
.kako{width:70%; display:block; margin:50px auto;}

h3{font-size:2em; color:#fff; font-weight:bold; margin-bottom:1em; text-align:left;}
h4{font-size:1.5em; color:#fff; font-weight:bold; margin-top:0.5em;}

.floatbox{float:right; width:300px; margin-left:2em; margin-top:1em;}

/* ---------------.mv_mainimg{position:absolute; z-index:0; top:0; left:0;}全デバイス共通(PC)-end--------------------- */
/*----------------------------------------------------------*/
/* tablet用のCSS */
/*----------------------------------------------------------*/


@media screen and (max-width: 1350px) {
	.car{
	top:50%;
	width:200px;
	}

	
}

@media screen and (max-width: 959px) {
  /* tablet */
  .pc {
    display: block;
  }
  .sp {
    display: none;
  }
  
 

	.kako{width:85%;}
	.iframe-wrapper{padding-bottom:48%;}

  /* header */
  /* -------------------------------------------------- */

  .g_menu li {
    list-style: none;
  }

  /* h */
  /* -------------------------------------------------- */
  h2 {
    font-size: 40px;
    letter-spacing: 5px;
    margin: 25px 0 40px;
  }

  /* layout */
  /* -------------------------------------------------- */
.pc_head{width:100%;}
.car{width:17%; height:100px; top:43%;}
.mejiro{width:200px; height:153px; top:-50px;} 
.tsukushi{width:98px; height:157px; bottom:30%;}
  
  .s_mt0{margin-top:0;}
 .s_mb0{amrgin-bottom:0;}
  
  
  .mv .schedule_wrap {
    padding: 10px 20px;
  }

  .mv .schedule .content_l p {
    font-size: 18px;
  }
  .mv .schedule .content_l p:first-of-type {
    width: 76%;
  }
  .mv .schedule .content_r .bold {
    font-size: 18px;
  }
  .mv .schedule .content_r .text {
    font-size: 13px;
  }
  .day_img{
    padding: 0 15px;
  }
  .about h2{
    margin: 30px 0 25px;
  }
  .about p{
    font-size: 20px
  }
  
  .sec_wrap{padding:3em 2em;}
  .yokoku .video{width:90%; margin-left:auto; margin-right:auto; height:400px;}
  .video{margin:20px 0;}


  /* -------------------tablet END------------------------- */
}

/*----------------------------------------------------------*/
/* SP用のCSS */
/*----------------------------------------------------------*/

@media screen and (max-width: 559px) {
  /* SP */
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  .mv_wrap {
    background-image: none;
    height:auto;
  }

.flex{display:block; margin-bottom:1.5em;}
.kako{width:95%; margin:1.5em auto;}
.iframe-wrapper{padding-bottom:65%;}

.nakabox{width:70%; margin:20px auto 0 auto;}

.spon{font-size:16px;}
.spon span{font-size:12px;}

.yokoku .video{
	width:100%;
	height:auto;
padding:0;
margin:0;
	}
	
	h3{font-size:1.5em; margin-bottom:1em;}
	h4{font-size:1.2em; margin-top:0.3em;}

   .video{width:100%; height:50vw;}

  .sp_head{width:100%; height:60px;}

  h1 {
    padding: 0;
    width: 100%;
    max-width: inherit;
  }
  .day{
    padding: 5px 0;
  }
  .day_img{
    max-width: inherit;
    width: 85%;
  }
  .day_img img{
    width: 100%;
    max-width: inherit;
  }
  .sec_wrap{
    padding: 30px 15px 45px 15px;
  }
  h2{
	  margin:0;
    margin-bottom: 1em;
    padding: 0;
    font-size: 30px;
  }
  .sec_wrap ul{
    flex-wrap: wrap;
    margin-bottom: 15px;
  }

.sec_wrap ul.guest li{
    flex-wrap: wrap;
    width: 45%;
    margin:10px auto;
    max-width: inherit;
    order: 4;
  }
 


.about_txt{margin:20px auto 0 auto;}
 
 .ytube{width:90%; margin:30px auto; }
 
  .sec_wrap ul li p{
    font-size: 13px;
  }
  .sec_wrap ul li p span{
    font-size: 10px;
  }
  .sec_wrap ul li p.text01{
    font-size: 7px;
  }

   .about{

  
  }
  .about h2{
    margin:  0 0;
    padding:  0;
  }
  .about p {
    font-size: 14px;
    letter-spacing: 0;
    padding: 0 ;
  }
  .about p span{
    padding: 3px 0;
  }
  
  .coming{width:100%;}
  
   p.name{width:90%; margin-top:0px; padding:5px;}
 .sec_wrap ul li p.name{font-size:16px; font-weight:bold;}
 p.name:before{}
 


ul.sponser{
	margin-bottom:90px;
}

ul.sponser li{
	width:90%;
	display:block;
	font-size:14px;
	
}

ul.sponser li p.s_adress{
	font-size:16px;
	}
	
.sp_footer{
	width:100%;
	height:486px;
	
}
  footer img {
    width: 75%;
    max-width: 451px;
    height: auto;
  }

  .fs_mini{font-size:80%;}
  /* ---------------------SP END----------------------------- */
}

 /* ---------------------js系----------------------------- */
 
 .slider1 {
  display: flex;
  margin: 0 calc(50% - 50.6vw);
  width: 100vw;
  height:400px;
  overflow: hidden;
}
.slider1 ul{
	display:flex;
	padding: 0;
	margin:0;
	max-width:none; 
	flex-wrap:nowrap;
}
.slider1 li{
	width:400px;
	list-style: none;
}
.slider1 ul:first-child {
  animation: slide1 150s -75s linear infinite;
}

.slider1 ul:last-child {
  animation: slide2 150s linear infinite;
}

@media screen and (max-width:770px) {
	.slider1 {height:250px;}
	.slider1 li{width:250px;}
	
}

@keyframes slide1 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes slide2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

.nores{max-width:780px; display:block; margin-right:auto; margin-left:auto;}