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

.sp_only{display: none;}
.pc_mvonly{display:block;}
.sp_mvonly{display: none;}

  @import 'https://fonts.googleapis.com/css?family=M+PLUS+1p:400,900&display=swap&subset=japanese';

:root {
  --this-site-bold: 900;
}

.element {
  font-weight: var(--this-site-bold);
}


.hover1:hover{opacity: 0.5;}

.hover2:hover {
  animation: bounce 2s ease-in-out;
}
@keyframes bounce {
  5%  { transform: scale(1.1, .8); }
  10% { transform: scale(.8, 1.1) translateY(-5px); }
  15% { transform: scale(1, 1); }
}

	body{margin: 0;
		width: 100%;
　　　　　overflow: hidden;}


   .wrap {
}

	p {
		font-family: "UD新ゴNT H","ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
		font-size:1.5rem;
		font-weight:bold;
		}




    .container{
				width: 100%;
				max-width: 973px;
				margin: 0 auto;}


	#titleImg{width: 100%;
				max-width: 1456px;
				margin: 0 auto;
				display: block;
				height: auto;}



	.legofooter{background-color: #000000;
				color: #ffffff;
		　　　　　width: 100%;
		        height: 166px;
			   position: relative;}

	.legofooter p{  line-height: 1rem;
		            width: 100%;
		            font-size: 11px;
					text-align: center;
					font-weight: normal;
					position: absolute;
					top: 47%; /*親要素を起点に上から50%*/
					left: 50%;  /*親要素を起点に左から50%*/
					transform: translateY(-50%) translateX(-50%); /*要素の大きさの半分ずつを戻す*/
					-webkit-transform: translateY(-50%) translateX(-50%);}

	/*メニュー固定*/

	#global-nav {
	 
	  width: 100%;
	  max-width: 973px;
	position: -webkit-sticky!important;
	position: sticky;
	top: 0;
	padding-top: 5px;	
	 margin: 0 auto;
	z-index: 1000;
	background-color: #ffffff;
	}

	#global-nav .inner {
	  padding-bottom: 0;
	  padding-top: 0;
	  margin: 0 auto;
	  max-width: 100%;
	  padding:0;
	  width: 981px;
	z-index: 1000;	
	}

	.global-list {
	  display: flex;
	  list-style: none;
	  margin: 0;
	  padding: 0;
	}

	
	.global-item:last-child {

	  margin-right: 0;
	}

	.global-item a {
	  display: block;
	  text-align: center;
	  text-decoration: none;
	}


  /*お手本をみよう*/


	#otehon{  margin: 0 auto;
			  padding-top:5.5rem;
				display: block;
	}

   .moviebg img { display: block; margin: 0 auto;}

   .caption{margin-top: 0.5rem;
	        text-align: center;
            font-size: 14px;
            font-weight: normal;
			line-height: 1.5rem;}

  .caption2{margin-top: 0.1rem;
	        text-align: center;
			font-size: 14px;
			font-weight: normal;
			line-height: 1.3rem;}
.caption3{margin-top: 0.1rem;
	        text-align: center;
			font-size: 14px;
			font-weight: normal;
			line-height: 1.3rem;}

	.Txt_img{margin: 1.5rem auto 1rem;
			 display: block;
             }


	img {
		max-width: 100%;
		 height: auto;
	}


/*スライダー*/
	.slide_img{width: 100%;
		margin: 0 auto;
		max-width:380px;
		border: red solid 4px;
		padding-left: 0px;
		display: block;
		border-radius: 20px;
        object-fit: cover;
}

    .swiper-container {
      width: 100%;
	  max-width: 470px;	
      height: 100%;
	  margin-bottom: 4rem;
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }

	.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
		bottom: 145px;
		left: 0;
		width: 100%;}



	.swiper-pagination-bullet-active {
	background: #FF0004;
	}


	   /* 前ページ、次ページボタン共通のスタイル */
	.swiper-button-prev,
	.swiper-button-next {
		width: 33px!important; /* ボタンの幅 */
		height: 33px!important; /* ボタンの高さ */
		background-size: 33px 33px; /* 背景画像としてのサイズ（＝表示したい画像サイズ） */
		top: 40%!important; /* 縦中央配置用：ボタンの高さの半分のネガティブマージン（top:50%がすでに設定されている） */
	}
	/* 次ページボタンのスタイル */
	.swiper-button-next {
		background-image: url("../img/slide_right.jpg");
		right:5px!important;    
	}
	/* 前ページボタンのスタイル */
	.swiper-button-prev {
		background-image:url("../img/slide_left.jpg");
		left:5px!important;    
		
	}




		.swiper-button-prev,
		.swiper-button-next  :hover {
		}


	   .swiper-button-prev:after,
	.swiper-button-next:after {
	 font-family: swiper-icons;
	 font-size: var(--swiper-navigation-size);
	 text-transform: none !important;
	 letter-spacing: 0;
	 text-transform: none;
	 font-variant: initial;display: none;

	}

	.swiper-button-prev:after,
	.swiper-container-rtl .swiper-button-next:after {
	 content: "prev";display: none;
	}

	.swiper-button-next:after,
	.swiper-container-rtl .swiper-button-prev:after {
	 content: "next";display: none;
	}


 .mv_otehon{ 
	 width:100%;
	 max-width: 1000px;
 margin-right: auto;
  margin-left: auto;}

  .mv_otehon li{
        display: inline-block;
	  width: 49.7%;
    vertical-align: top;
    }

  
	/*スライダーEND*/


    /*概要　ルール*/
	#rule{    margin: 0 auto;
		    display: block;
          padding-top: 5.5rem;}

	.rule-box{
		      height: auto;
		      padding: 5px;
		      padding-bottom: 4rem;
		      background-image: url("../img/bg1.jpg");
			  background-repeat: repeat;
			  background-size:auto;}

     .rule-box img{  margin: 0 auto;
		display: block;}

     .box_white{ 
		   width: 100%;
		   height: auto;
		   margin:2rem auto ;
		   padding: 1px;
		   max-width: 864px;
           background-color: #ffffff;
            box-shadow: 4px 4px #adadad;}



		.mizu_title{background-color: #22a9e0;
				max-width: 712px;
				display: block;
				margin: 3rem auto;
				top: 50%;
				border-radius: 15px;
				padding: 15px;}


		.form_box{position: relative;}


		.linkBtn{position: absolute;
				top: 44px;
				right: 180px;
				}


		.saiten-box{display: block; position: relative;}


		.kirotitle{background-color: #fdd000;
				max-width: 858px;
				height: 86px;
				position: relative;
				margin: 3rem auto;
				top: 50%;
				border-radius: 15px;
				padding: 1px;}


		.saitenImg{  display: block;
					position: absolute;
					right: 265px;
					bottom: -17px;}



      /*スケジュール*/

       
	#schedule{  margin: 0 auto;
			  padding-top: 5.5rem;
				display: block;
	           }

     .schedule-box{padding-bottom: 4rem;}

     .sc_img{margin: 3.5rem auto 0.5rem;display: block;}


     .tyusyaku{text-align: left;
				margin: 0 auto;
				display: table;
            font-size: 16px;
            font-weight: bold;
			line-height: 1.5rem;}


	.entryBtn{display: block;
			  margin: 2rem auto 5rem;}

   /*予選通過者*/

   #yosen{   margin: 0 auto;
		     display: block;
             padding-top: 5.5rem;
             margin-top: -4.5rem;}

	.yosen-box{
		      height: auto;
		      padding: 5px 5px 6.5rem 5px ;
		      background-image: url("../img/bg1.jpg");
			  background-repeat: repeat;
			  background-size:auto;}

    .font-mini{font-size: 1.2rem;}


	.mv_box {   
		max-width: 864px;
		margin: 1rem auto 3rem;
		padding-bottom: 1.5rem;
	}

	.titleBox {
	  display:flex;
	  flex-direction: row;
	  margin-bottom: 0.5rem;
	}

	.mv_pict{
	 
	  margin-left:15%;
	}


	  .yosen_pro{width: 100%;
				 max-width: 120px;}


	 .mv_text h3{background-color: #fdd000;
			    color: #000;
		 font-family: "UD新ゴNT H","ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
				font-weight: 600;
				font-size: 1.7rem;
		        text-align: center;
				width: 432px;
				padding: 1rem;
				margin-left: 3%;
				margin-top: 17%;
		        position: relative;
				}


		.mv_img1,.mv_img2{width: 100%;
				  height: auto;
				  position: absolute;}

		.mv_img1{max-width: 58px; 
		bottom: 0px;
		left: 0;}

		.mv_img2{max-width: 117px;
		 bottom: 3px;
		  right: -25px;}

	  .yosenmv_con{
		  width: 100%;
		  max-width: 1000px;	
		  height: 100%;
		  margin-bottom: 4rem;
		}


		.yosenSlide_img{width: 100%;
				margin: 0 auto;
				max-width:700px;
				border: red solid 5px;
				padding-left: 0px;
				display: block;
				border-radius: 20px;
				object-fit: cover;
		}

.yosen-page{   
	position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0,0,0);
    z-index: 10;
        margin: 0% auto -11%;}


   
	.swiper-container-horizontal>.yosen-page-bullets, .yosen-page-custom, .yosen-page-fraction {
		bottom: 180px!important;
		left: 0;
		width: 100%;}

	.yosen-prev,
	.yosen-next {
		width: 45px!important; /* ボタンの幅 */
		height: 45px!important; /* ボタンの高さ */
		background-size: 45px 45px; /* 背景画像としてのサイズ（＝表示したい画像サイズ） */
		top: 45%!important; /* 縦中央配置用：ボタンの高さの半分のネガティブマージン（top:50%がすでに設定されている） */
	}

	.yosen-next {
		background-image: url("../img/slide_right.jpg");
		right:25px!important;    
	}

	.yosen-prev {
		background-image:url("../img/slide_left.jpg");
		left:25px!important;    
		
	}

.dashBr{max-width: 864px;
	    margin: 0 auto 3rem;
        border-top: 1px solid #bbb;
}


    .award_img {
		        display: block;
		        margin: 0 auto;}

.flink{    font-size: 1.2rem;
    color: #ffffff;
    font-weight: 700;
    line-height: 2rem;}


@media screen and (max-width: 1024px) {

 .swiper-button-next {
    right: 88px;
	} 
	
	.swiper-button-prev {
		left: 88px;    
		
	}
	
	.mv_otehon {
    width: 95%;
    margin-right: auto;
    margin-left: auto;
    max-width: 925px;
}
	
	.yosen-page{bottom: 3.5rem;}
	
		/* 次ページボタンのスタイル */
	.swiper-button-next {
		display: none!important;
	}
	/* 前ページボタンのスタイル */
	.swiper-button-prev {
	display: none!important;
	}

	.schedule-box {margin-bottom: 3rem;}
	
	.slide_img {width: 96%;}
	
.yosen-slide{margin-right: 2vw!important;
              margin-left: 2vw!important;}
}
	
@media screen and (max-width: 768px) {
	
	.pc_mvonly{display: none;}
	.sp_mvonly{display: block;}
	
	.box_white {
    width: 85%;
		padding: 4%;}
	
		/*ボックス全体*/
	.accbox {position: -webkit-sticky;
				position: sticky;
				top: 0;
				z-index: 2000;	
				margin: 2.5em 0;
				background-color: #ffffff;
				padding: 0;
				max-width: 400px;/*最大幅*/
	}


	
	
	
	 /*お手本をみよう*/
	 .otehon-box{padding: 15px;}
	 
	 .slide_img {
		         max-width: 320px;}
	 
	 .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
		bottom: 133px;
		left: 0;
		width: 100%;}

	.swiper-container {
	  max-width: 375px;	
    }
	 
	.mv_otehon {
    width: 95%;
    margin-right: auto;
    margin-left: auto;
    max-width: 800px;
}
	
	   .mv_otehon li{
	  width: 49%;
    }

	.caption2 {
    margin-top: 1rem;
    font-size: 14.5px;
}
	
		 
	.caption3{
    margin-top: 1rem;
    }

	 
	 .rule-box{padding: 15px;
		      background-image: url("../img/bg1_sp.jpg");
			 }
	 
	
	 .box_white{
				width: 96%;
				padding: 2%;
			}
	 
	 .mizu_title {padding: 10px;margin: 1.5rem auto; }
	 
	 .linkBtn{right: 100px;
				}

	 
	 .rule_p {width: 20%!important;}
	 
	 
	 .kirotitle {
		 height: 60px;}
		.saitenImg{   
		right: 55px;
		width: 70%;
		bottom: -8px;
			}
	 .point{width: 90%;}
	 
	 .schedule-box{padding: 15px;
	               }
	 .sc_img {
    margin: 1.5rem auto 1rem;}

	
	.mv_pict{
	 
	  margin-left:10%;
	}
	
	.yosenmv_con{
		 
		  max-width: 650px;	
		
		}


		.yosenSlide_img{
			     width: 94%;
			     margin-right: 0.5rem;
				
		}

	
	.yosen-page{ 
    
    margin: 0% auto -6.5rem;
    padding: 1px;}
}
	
 @media screen and (max-width: 720px) {
	 
	 
	
	 
	  .slide_img {width: 280px;}
	    .mv_otehon li{
	  width: 49.5%;
    }
	 
	 
	 
	 	
	.mv_box {
			padding:0 1rem ;
			margin: 0 auto 2rem;}

		 .mv_pict { 
					margin-left: 10%;
					margin-right: 0%;
					padding-top: 23px;
					}

		 .yosen_pro {max-width: 80px;
		             width: 90%;}	 
		 
		 .mv_text h3 {
					font-size: 1.2rem;
					width: 350px;
                    padding: 0.8rem;
			        margin-top: 18%;
					}
		 .mv_img1{max-width: 40px;}		
		 
		 .mv_img2{    
			 max-width: 70px;
             right: -5px;}
		 
		 .font-mini{font-size: 1rem;}
		 
		 
		 .award_img{width: 76%;}
		

	}
	
	
	 @media screen and (max-width: 640px) {
		 
		 
		 	  .pc_only{display: none;}
	.sp_only{display: block;}
   
		 
		 
		/* bager menu */

	header{background: url("../img/sp_header.jpg") no-repeat #fed52f;
    display: flex;
    padding: 30px 20px;
    position: fixed;
    justify-content: space-between;
    width: 100%;
  z-index: 200;background-size: 100%;background-position: center;}
		 
		#header #navi {
		margin-top: 0;
		transition: all .6s;
		overflow-y: auto;
		padding-top: 40px;
		width: 300px;
		height: 100vh;
		z-index: 1000;
		top: 0;
		right: -420px;
		background-color: #fff;
		position: fixed;
		}

		#header .nav_btn {
		width: 44px;
		height: 44px;
		z-index: 3000;
		top: 7px;
		right: 50px;
		cursor: pointer;
		position: absolute;
		background-color: #fed52f;	
		transition: all .3s;
		}
		 .nav_open #header .nav_btn {
			 background-color: #fff;
			 transition: all .3s;
		 }

		.hamburger_line {
		transition: all .6s;
		width: 34px;
		height: 2px;
		left: 5px;
		background-color: #000;
		position: absolute;
		}

		.hamburger_line1 { top: 10px; }
		.hamburger_line2 { top: 21px; }
		.hamburger_line3 { top: 32px; }

		.nav_bg {
		opacity: 0;
		transition: all .6s;
		width: 100vw;
		height: 100vh;
		z-index: 500;
		top: 0;
		left: 0;
		visibility: hidden;
		background-color: #000;
		cursor: pointer;
		position: fixed;
		}

	
		    
		/* 表示された時用のCSS */
		.nav_open #header #navi { right: -50px; }

		.nav_open .nav_bg {
		opacity: .8;
		visibility: visible;
		}

		.nav_open .hamburger_line1 {
		transform: rotate(45deg);
		top: 20px;
		}

		.nav_open .hamburger_line2 {
		width: 0;
		left: 50%;
		}

		.nav_open .hamburger_line3 {
		transform: rotate(-45deg);
		top: 20px;
		} 
		 
		 #navi li{max-width: 150px;
				margin: 10px auto;
				list-style-type : none;
				padding: 5px 127px 0 23px;
				border-bottom:4px solid red;
} 


		 #titleImg{padding-top:  60px;}
		 
	 #otehon,#rule,#schedule{padding-top: 4rem; margin-top: -4rem;}
	 

		.caption {
			font-size: 14px;
			line-height: 1.3rem;}
	
		 
		 .linkBtn{    top: 20px;
					right: 40px;
			 width: 60px;
		margin-right: 2px;
		margin-top: 1px;
		 }
		 
		 .tyusyaku {
					font-size: 14px;
					line-height: 1.3rem;
					}


		 
	
}
	
	
	


	 @media screen and (max-width: 530px) {
		 
	  .slide_img {width: 98%;
		          width: 400px;}	
		 
     .swiper-container {
	  width:368px;	
    }

		 .linkBtn{    top: 22px;
					right: 45px;
			 width: 65px;
		 }
		 
	
		 	   .mv_otehon li{display: block;   
		                    width: 100%;}
		 
		 .yosenSlide_img{
			     width: 93%;}
		 
		 
		
		 
		 .mv_text h3 {width: 253px;}
		 
		 
		 .mv_pict {
				margin-left: 0%;
				margin-right: 0%;
				padding-top: 23px;
			}
		 
		 .mv_img1 {
				max-width: 35px;
				left: -10px;
}
		 
		 .mv_img2 {
					max-width: 60px;
					right: -20px;
}

}

@media screen and (max-width: 414px) {
	
	 .swiper-container {
	  width:370px;	
      right: 0.8rem;
    }
	
	 .kebtn2{top: 256px;}
	
	.kebtn{top: 200px;} 
	
	 .yosenmv_con{
		 
		  max-width: 363px;	
		 padding: 10px;
		
		}
	
	 .mv_text h3 {width: 200px;}
}


 @media screen and (max-width: 380px) {
 .swiper-container {
	  width:350px;	
      right: 0.8rem;
    }
	 
}
	
		


	 @media screen and (max-width: 365px) {

		.linkBtn{    top: 20px;
				right: 40px;
		 width: 60px;
		}

		.swiper-container {
		width:330px;	
		}
		 
		.mv_text h3 {
			width: 188px;
			margin-top: 21%;
} 
		 
		 .mv_img1 {
			max-width: 33px;
		}

		 
		 .mv_img2 {
			max-width: 50px;
            right: -22px;
		}
		 
		 .mv_pict {
			 margin-left: 5%;}
		 
		.kebtn{top: 190px;}

	}

		 
	  @media screen and (max-width: 320px) {
		  
		  
		  .swiper-container{max-width:290px;}
		  

		.mv_text h3{width: 200px;
				   font-size: 1rem; }

		   .mv_img1{max-width: 30px;}		

	 .mv_img2{max-width: 63px;
		    right: -5px;}


	 }