@charset "utf-8";

*{
	margin:0;
	padding:0;
}

*, *:before, *:after { 
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

/* Firefox */
* {
	scrollbar-width: thin;
	scrollbar-color: #397524 #DFE9EB;
}

/* Chrome, Edge and Safari */
*::-webkit-scrollbar {
width: 1.8rem;
width: 1.8rem;
}
*::-webkit-scrollbar-track {
border-radius: 10px;
background-color: #DFE9EB;
}

*::-webkit-scrollbar-track:hover {
background-color: #B8C0C2;
}

*::-webkit-scrollbar-track:active {
background-color: #B8C0C2;
}

*::-webkit-scrollbar-thumb {
border-radius: 10px;
height: 10rem;
background-color: #195005e0;
}

*::-webkit-scrollbar-thumb:hover {
background-color: #62A34B;
}

*::-webkit-scrollbar-thumb:active {
background-color: #62A34B;
}


body{
	background-color: #fefff7;
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */	background-attachment: fixed; */
	color: #000000;
	font-size: 20px;
	line-height: 1.6;
	font-family: "メイリオ","Meiryo","Osaka","MS Pゴシック","MSゴシック",Helvetica,verdana,arial;
	
}

body::before {
	background-color: #fefefe;
	/* background-image: url("https://www.transparenttextures.com/patterns/green-dust-and-scratches.png"); */
	background-image:url(../../../../images/mediatest/bg2.png);
	background-repeat:no-repeat no-repeat;
	background-position:center center;

	background-size: cover;
	content: "";

	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: -1;
	height: 100vh;

	/* -webkit-animation: zoom 20s 1;
	animation: zoom 20s 1;
	animation-fill-mode: forwards;
	animation-iteration-count:infinite;
	animation-timing-function:ease-in;
	animation-direction:alternate; */
}

@keyframes zoom {
	0% {
	   transform: scale(1);
	}
	100% {
	   transform: scale(1.1);
	}
 }


.yu{font-family:"游ゴシック Medium","游ゴシック体","Yu Gothic Medium",YuGothic,"ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;	}
.mr{font-family: "メイリオ","Meiryo","Osaka","MS Pゴシック","MSゴシック",Helvetica,verdana,arial;}
.nt{font-family: 'Noto Sans JP','Roboto', "メイリオ","Meiryo","Osaka","MS Pゴシック","MSゴシック",Helvetica,verdana,arial,sans-serif;}
.mc{font-family: 'Noto Serif JP', serif, "メイリオ","Meiryo","Osaka","MS Pゴシック","MSゴシック",Helvetica,verdana,arial,sans-serif;}


img{vertical-align:bottom;}

br{letter-spacing:0;}
br.sb{display: none;}
@media screen and (min-width: 568px) {
a:hover{opacity: 0.8;}
/* button:hover{opacity: 0.8;} */
/* input[type="submit"]:hover{opacity: 0.8;} */
    /* ホバースタイルは横幅が大きなデバイスだけ */
}
.sv{display: none;}
.tv{display: none;}
.ma{margin: 0 auto;}

/* a:link{text-decoration:none; color: #fffb00;} */
/* a:visited{text-decoration:none; color: #fffb00;} */
a:hover{text-decoration:none; color: #fffb00;}
a:active{text-decoration:none; color: #fffb00;}


/*　head
*********************************************************/

/*========= ローディング画面のためのCSS ===============*/
#splash {
	position: fixed;
	width: 100%;
	height: 100%;
	background: #581247;
	z-index: 9999999;
	text-align:center;
	color:#fff;
  }
  
  #splash-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
  }
  
  
  /*========= 画面遷移のためのCSS ===============*/
  
  
  body.appear{
	  z-index: 99;
  }
  
  /*画面遷移アニメーション*/
  .splashbg1,
  .splashbg2{
	  display: none;
  }
  
  /*bodyにappearクラスがついたら出現*/
  body.appear .splashbg1,
  body.appear .splashbg2{
	display:block;
  }
  
  /*右に消えるエリア*/
  body.appear .splashbg1{
	animation-name:PageAnime;
	animation-duration:1.2s;
	animation-timing-function:ease-in-out;
	animation-fill-mode:forwards;
	  content: "";
	  position:fixed;
	z-index: 999;
	  width: 100%;
	  height: 100vh;
	  top: 0;
	left:50%;
	  transform: scaleX(1);
	  background-color: #581247;/*伸びる背景色の設定*/
  }
  
  @keyframes PageAnime{
	0% {
	  transform-origin:left;
	  transform:scaleX(1);
	}
	50% {
	  transform-origin:right;
	}
	100% {
	  transform-origin:right;
	  transform:scaleX(0);
	}
  }
  
  /*左に消えるエリア*/
  body.appear .splashbg2{
	animation-name:PageAnime2;
	animation-duration:1.2s;
	animation-timing-function:ease-in-out;
	animation-fill-mode:forwards;
	  content: "";
	  position:fixed;
	z-index: 999;
	  width: 100%;
	  height: 100vh;
	  top: 0;
	right:50%;
	  transform: scaleX(1);
	  background-color: #581247;/*伸びる背景色の設定*/
  }
  
  @keyframes PageAnime2{
	0% {
	  transform-origin:right;
	  transform:scaleX(1);
	}
  
	50% {
	  transform-origin:left;
	}
	100% {
	  transform-origin:left;
	  transform:scaleX(0);
	}
  }
  
  /*画面遷移の後現れるコンテンツ設定*/
  /* #wrapper{
	opacity: 0;
  } */
  
  /*bodyにappearクラスがついたら出現*/
  /* body.appear #wrapper{
	animation-name:PageAnimeAppear;
	animation-duration:1s;
	animation-delay:0.2s;
	animation-fill-mode:forwards;
	opacity: 0;
  }
  
  @keyframes PageAnimeAppear{
	0% {
	opacity: 0;
	}
	100% {
	opacity: 1;
  }
  } */



.bg-wrap {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}


.light-line{

	margin-right: auto;
	margin-left: auto;
	animation-name: light-line;
	animation-duration: 0.5s;
	animation-iteration-count:1;
	animation-direction:alternate;
	animation-fill-mode:forwards;
	animation-delay: 0s;

}

@keyframes light-line {
    0% {
    	border-top: 0.5rem solid #ffffff;
    	width: 1%;
        opacity:1;
    }
    100% {
    	border-top: 0.5rem solid #ffffff;
    	width: 100%;
        opacity:1;
    }
}



.bg-wrap .light-line{

	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	
	margin-right: auto;
	margin-left: auto;
	animation-name: light-line;
	animation-duration: 0.5s;
	animation-iteration-count:1;
	animation-direction:alternate;
	animation-fill-mode:forwards;
	animation-delay: 0s;

}

@keyframes light-line {
    0% {
    	border-top: 0.5rem solid #ffffff;
    	width: 1%;
        opacity:1;
    }
    100% {
    	border-top: 0.5rem solid #ffffff;
    	width: 100%;
        opacity:1;
    }
}

@keyframes light-line-r {
    0% {
		background: linear-gradient(to right, Magenta, yellow, Cyan, Magenta) 0% center/200%;
    	width: 1%;
    	height: 1rem;
        opacity:1;
    }
    100% {
		background: linear-gradient(to right, Magenta, yellow, Cyan, Magenta) 0% center/200%;
    	width: 100%;
    	height: 1rem;
        opacity:1;
    }
}


.bg-wrap .bg-head{
	position: relative;
	width: 100%;
	height: 100vh;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	background-image: url(../../images/a-shiden/hit_head_waku.png);
	background-position: top center;
	background-size:cover;
	background-attachment: fixed;
	opacity:0;

	animation-name: wrap-fadein;
	animation-duration: 1.5s;
	animation-iteration-count:1;
	animation-direction:alternate;
	animation-fill-mode:forwards;
	animation-delay: 0.7s;
}


.fuji{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-image: url(../../images/a-shiden/hit_head_waku.png);
	background-position: top center;
	background-size:cover;
	z-index: -2;

	animation-name: fuji-fadein;
	animation-duration: 3s;
	animation-iteration-count:1;
	animation-direction:alternate;
	animation-fill-mode:forwards;
	animation-delay: 1s;

}

@keyframes fuji-fadein{
    0% {
        opacity:0;
        transform: scale(1.8, 1.8);
    }

    100% {
        opacity:1;
        transform: scale(1, 1);
    }
}



@keyframes wrap-fadein {
    0% {
        opacity:0;
        transform: scale(1.3, 1.3);
    }
    100% {
        opacity:1;
        transform: scale(1, 1);
    }
}


.loop_wrap {
	position: absolute;
	bottom: 10%;
	left: auto;
	right:  auto;

	display: flex;
	width: 100%;
	height: 480px;
	overflow: hidden;
}

.loop_wrap img {
  width: auto;
  height: 100%;
}

.loop_wrap img:first-child {
  animation: loop 300s -25s linear infinite;
}

.loop_wrap img:last-child {
  animation: loop2 300s linear infinite;
}

@keyframes loop {
  0% {
	transform: translateX(0%);
  }


  to {
    transform: translateX(-100%);
  }
}

@keyframes loop2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}
.loop_wrap2 {
	position: absolute;
	bottom: 0;
	left: auto;
	right:  auto;
	display: flex;
	width: 100%;
	height: 480px;
	overflow: hidden;
}

.loop_wrap2 img {
  width: auto;
  height: 100%;
}

.loop_wrap2 img:first-child {
  animation: loop3 120s -25s linear infinite;
}

.loop_wrap2 img:last-child {
  animation: loop4 120s linear infinite;
}

@keyframes loop3 {
  0% {
	transform: translateX(0%);
  }

  to {
    transform: translateX(-100%);
  }
}

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



.overlay {
  width: 100%;
  height: 90rem;
  position: absolute;
  top: 0;
  left: 0;
  background-image: linear-gradient(45deg, rgba(0,0,0,.2) 50%, rgba(0,0,0,.4) 50%);
  background-size: 3px 3px;
  z-index: 2;
}

.overlay-wt {
  width: 100%;
  height: 90rem;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #ffffff;
  z-index: 2;

}

/*　layout
*********************************************************/

#particles-js{ 
	position:fixed;/*描画固定*/
	z-index:1;/*描画を一番下に*/
	width: 100%;
	height: 100%;
	/*background-color:#FEE7E7;*//*背景色*/
}

#wrapper{
	width: 100%;
	height: auto;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.wrapper-sumup{
	width: 100%;
	height: auto;
	background-image: url(../../../../images/auto/sal/body4.jpg);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.wrapper-sky{
	width: 100%;
	height: auto;
	background-image: url(../../../../images/auto/sal/body5.jpg);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.wrapper-presal{
	width: 100%;
	height: auto;
	background-image: url(../../../../images/book/mae/mae2_main_bg2.png);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.wrap-last{
	width: 100%;
	height: auto;
	background-image: url(../../../../images/king/sal/sal_bg_last.jpg);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

#header {
	width: 100%;
	height: auto;
	margin: 0 auto;
	text-align: center;
/*	background-image: url("../images/header3.jpg");
	background-position: top center;
*/	position:relative;
	/*overflow: hidden;*/
	/* z-index: -2; */
}

#header2 {
	width: 100%;
	height: auto;
	margin: 8rem auto 1rem;
	text-align: center;
/*	background-image: url("../images/header3.jpg");
	background-position: top center;
*/	position:relative;
	/*overflow: hidden;*/
}

.z-flont{
	position: relative;
	z-index: 1000;
}

#header img.head{
	opacity: 0;
	position: relative;
	z-index: 9999;
}


.hd-1 {
  animation-delay: 0.2s; /* アニメーション開始時間 */
  animation-duration: 1s;
}
.hd-2 {
  animation-delay: 2s; /* アニメーション開始時間 */
  animation-duration: 3.5s;
}
.hd-3 {
  animation-delay: 3.5s; /* アニメーション開始時間 */
  animation-duration: 4.5s;
}


/*=====================================================
	回転　回る　くるくる
=====================================================*/

.bg-roll{
	background:url(../../../../images/book/sal/sal_header_gear50.png) center no-repeat;
	filter: drop-shadow(0px 0px 20px rgb(178, 239, 11));
	position: absolute;
	width: 100%;
	height: 84rem;
	top:0;
	left:0;
	right:0;
	z-index: 0;
	opacity: 0.7;

	margin: 0 auto;
	text-align: center;
    animation-name: roll;
    animation-timing-function:linear;
    animation-iteration-count:infinite;    
    animation-duration: 80s;
}

@keyframes roll {
    0% {
		transform:rotate(0);
    }
    100% {
    	transform:rotate(360deg);
   }
}

@media screen and (max-width: 480px) {
	.bg-roll {
		background: url(../../../../images/book/sal/sal_header_gear50.png) center no-repeat;
		filter: drop-shadow(0px 0px 20px rgba(178,239,11,1));
		position: absolute;
		width: 30rem;
		height: 30rem;
		left: 0;
		background-size: 100%;
		background-position: center;
	}
}


/*=====================================================
nav
=====================================================*/


.hd-1 {
	animation-delay: 0.2s; /* アニメーション開始時間 */
	animation-duration: 1s;
  }
  .hd-2 {
	animation-delay: 0.8s; /* アニメーション開始時間 */
	animation-duration: 1.8s;
  }
  .hd-3 {
	animation-delay: 3.5s; /* アニメーション開始時間 */
	animation-duration: 4.5s;
  }
  #global-nav{
	  /* background-image: url(../../../../images/auto/surv/bg-globalmenu.png); */
	  background-color: #8E2536;
	  background-position: center bottom;
	  background-repeat: no-repeat;
	  width: 100%;
	  height: 8rem;
	  margin-left: auto;
	  margin-right: auto;
	  color: #ffffff;
	  z-index: 999999;
	  position: fixed;
	  border-top: 0.2rem solid #fff;
	  border-bottom: 0.2rem solid #fff;
  }
  
  #global-nav.m_fixed {
	left: 0;
	right: 0;
	position: fixed;
	top: 0;
  }
  
  ul.menu{
	  margin: 0 auto;
	  width: auto;
	  height: 100%;
	  font-size: 1.7rem;
	  line-height: 1.5;
	  display: flex;
	  flex-wrap: nowrap;
	  justify-content:center;
	  list-style: none;
  
  }
  
  ul.menu li{
	  width: auto;
	  vertical-align: middle;
	  color: #ffffff;
	  font-weight: bold;
  
  }
  
  ul.menu li:first-child{
	  border-left: none;
  }
  
  ul.menu li:last-child{
	  border-right: none;
  }
  
  ul.menu li a{
	  padding: 1.5rem 0.5rem 1rem 0.5rem;
	  margin-right: 2rem;
	  color: #fff;
	  display: block;
	  text-align: center;
	  vertical-align: middle;
	  border-bottom: 0.1rem solid  #ffffff;
  }
  
  @media screen and (min-width: 568px) {
	  ul.menu li a:hover {
	  border-bottom: 0.1rem solid #FF0000;
	  text-decoration: none;
	  transition: 0.2s ;
  }
  }
  
  ul.menu li a i{
	  font-size: 3rem;
	  margin-right: 1rem;
	  display: inline-block;
  }
  
  /**********************************************************/


/**********************************************************/


.container{
	width:89rem;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,f8b500+22,f8b500+49,f8b500+77,fbdf93+100 */
	background: #fceabb; /* Old browsers */
	background: -moz-linear-gradient(left,  #fceabb 0%, #f8b500 22%, #f8b500 49%, #f8b500 77%, #fbdf93 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #fceabb 0%,#f8b500 22%,#f8b500 49%,#f8b500 77%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #fceabb 0%,#f8b500 22%,#f8b500 49%,#f8b500 77%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 */

	box-shadow: 0 0px 25px #ffffff;
}

.container-comet{
	max-width:89rem;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,f8b500+22,f8b500+49,f8b500+77,fbdf93+100 */
	background: rgba(0, 0, 20, 0.75); /* Old browsers */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 */

	box-shadow: 0 0px 25px #ffffff;
}

.container-future{
	max-width:89rem;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,f8b500+22,f8b500+49,f8b500+77,fbdf93+100 */
	background: rgba(20, 0, 10, 0.75); /* Old browsers */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 */

	box-shadow: 0 0px 25px #ffffff;
}

.container-harvest{
	max-width:89rem;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,f8b500+22,f8b500+49,f8b500+77,fbdf93+100 */
	background: rgba(20, 20, 20, 0.75); /* Old browsers */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 */

	box-shadow: 0 0px 25px #ffffff;
}


.main{
	background-color: #fbfbfb;
	background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
	color: #111111;
	background-attachment: fixed;
	width:88.5rem;
	height: 100%;
	margin:0 auto;
	padding-right : 1rem;
	padding-left: 1rem;
	/* padding-bottom: 1rem; */
}

.area-main{
	max-width:95rem;
	margin-left:auto;
	margin-right: auto;
}

.main-cwt{
	background-color: rgba(255,255,255,0.7);
	background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");
	color: #332008;
	background-attachment: fixed;
	max-width:88.5rem;
	height: 100%;
	margin:0 auto;
	padding-right : 1rem;
	padding-left: 1rem;
}

.main-wt{
	background-color: #F9F9F9;
	color: #030100;
}

.main-gre{
	background-color: #212900;
	background-image: url("https://www.transparenttextures.com/patterns/classy-fabric.png");
	color: #F9F9F9;
}

.main-bl{
	background-image: linear-gradient(to top, #cc208e 0%, #6713d2 100%);
	color: #ffffff;
}
.main-pk{
	background-image: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
	color: #ffffff;
}

.main-bk{
	background-color: #222;
	background-image: url("https://www.transparenttextures.com/patterns/classy-fabric.png");
	color: #F9F9F9;
}

.text{
	width: 65rem;
	margin: 0px auto  0 auto;
	text-align: left;
	padding-top: 5rem;
	padding-bottom: 5rem;
}

p{padding-top:8rem; }

.flash {
    animation: flash 2.5s linear infinite;
}
.flash2 {
    animation: flash 1.5s linear infinite;
}
@keyframes flash {
	0%,100% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}
}


/*=======================================*/


section.bace{
	width: 100%;
	height:auto;
	background-image: url(../../../../images/auto/sal/bg-cwt.png);
	background-position: center;
	position: relative;
}


/*=======================================
area
=======================================*/

.area-wall{
background-image: url("https://www.transparenttextures.com/patterns/concrete-wall.png");
}

.area-wall-y{
background-color: #f0e511;
background-image: url("https://www.transparenttextures.com/patterns/circles.png");
}

.area-box{
background-color: #1d1042;
background-image: url("https://www.transparenttextures.com/patterns/gplay.png");
}

.area-box-g{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f3e2c7+1,c19e67+50,b68d4c+51,f3e2c7+94,f3e2c7+94,e9d4b3+100 */
background: #f3e2c7; /* Old browsers */
background: -moz-linear-gradient(top,  #f3e2c7 1%, #c19e67 50%, #b68d4c 51%, #f3e2c7 94%, #f3e2c7 94%, #e9d4b3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f3e2c7 1%,#c19e67 50%,#b68d4c 51%,#f3e2c7 94%,#f3e2c7 94%,#e9d4b3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f3e2c7 1%,#c19e67 50%,#b68d4c 51%,#f3e2c7 94%,#f3e2c7 94%,#e9d4b3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3e2c7', endColorstr='#e9d4b3',GradientType=0 ); /* IE6-9 */
/*background-attachment: fixed;
*/border: 0.4rem ridge #E6D2B0;

}
.area-box-gg{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#dd9802+0,f4e493+51,461101+57,f9b804+67,fbdf93+100 */
background: #dd9802; /* Old browsers */
background: -moz-linear-gradient(top,  #dd9802 0%, #f4e493 51%,  #f9b804 67%, #fbdf93 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #dd9802 0%,#f4e493 51%,#f9b804 67%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #dd9802 0%,#f4e493 51%,#f9b804 67%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dd9802', endColorstr='#fbdf93',GradientType=0 ); /* IE6-9 */
}

.area-box-ggg{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#dd9802+0,f4e493+51,461101+57,f9b804+67,fbdf93+100 */
	background: #dd9802; /* Old browsers */
	background: -moz-linear-gradient(top,  #dd9802 0%, #f4e493 51%, #461101 57%, #f9b804 67%, #fbdf93 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #dd9802 0%,#f4e493 51%,#461101 57%,#f9b804 67%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #dd9802 0%,#f4e493 51%,#461101 57%,#f9b804 67%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dd9802', endColorstr='#fbdf93',GradientType=0 ); /* IE6-9 */
	}


.area-box-s{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
border: 0.4rem ridge #b5bdc8;
}

.area-box-ss{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebe9f9+0,d8d0ef+50,cec7ec+51,c1bfea+100;Purple+3D+%231 */
background: #ebe9f9; /* Old browsers */
background: -moz-linear-gradient(top,  #ebe9f9 0%, #d8d0ef 50%, #cec7ec 51%, #c1bfea 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ebe9f9 0%,#d8d0ef 50%,#cec7ec 51%,#c1bfea 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ebe9f9 0%,#d8d0ef 50%,#cec7ec 51%,#c1bfea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebe9f9', endColorstr='#c1bfea',GradientType=0 ); /* IE6-9 */
}

.area-box-b{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f0b7a1+0,8c3310+50,752201+51,bf6e4e+100;Brown+Gloss */
background: #f0b7a1; /* Old browsers */
background: -moz-linear-gradient(top,  #f0b7a1 0%, #8c3310 50%, #752201 51%, #bf6e4e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f0b7a1 0%,#8c3310 50%,#752201 51%,#bf6e4e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f0b7a1 0%,#8c3310 50%,#752201 51%,#bf6e4e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0b7a1', endColorstr='#bf6e4e',GradientType=0 ); /* IE6-9 */
border: 0.4rem ridge #f0b7a1;
}


.area-box-rd{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cf0404+0,9f0c0c+100 */
background: #cf0404; /* Old browsers */
background: -moz-linear-gradient(top,  #cf0404 0%, #9f0c0c 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #cf0404 0%,#9f0c0c 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #cf0404 0%,#9f0c0c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf0404', endColorstr='#9f0c0c',GradientType=0 ); /* IE6-9 */
}

.area-box-y{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fefcea+0,f1da36+100;Gold+3D */
background: #fefcea; /* Old browsers */
background: -moz-linear-gradient(top,  #fefcea 0%, #f1da36 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fefcea 0%,#f1da36 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fefcea 0%,#f1da36 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 ); /* IE6-9 */
}




.area-box-o{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+51,fbdf93+100;Orange+3D+%235 */
background: #fceabb; /* Old browsers */
background: -moz-linear-gradient(top,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 ); /* IE6-9 */

}

.area-box-gr{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ed356+0,6cc92e+50,53c900+51,67ce2f+100 */
background: #8ed356; /* Old browsers */
background: -moz-linear-gradient(top,  #8ed356 0%, #6cc92e 50%, #53c900 51%, #67ce2f 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #8ed356 0%,#6cc92e 50%,#53c900 51%,#67ce2f 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #8ed356 0%,#6cc92e 50%,#53c900 51%,#67ce2f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ed356', endColorstr='#67ce2f',GradientType=0 ); /* IE6-9 */
}

.area-box-dgr{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ed356+0,6cc92e+50,53c900+51,67ce2f+100 */
	background: #387c00; /* Old browsers */
}

.area-box-bl{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1e5799+0,2989d8+50,207cca+51,7db9e8+100;Blue+Gloss+Default */
background: #1e5799; /* Old browsers */
background: -moz-linear-gradient(top,  #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */

}


.area-box-v{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cb60b3+0,ad1283+50,de47ac+100;Pink+3D */
background: #cb60b3; /* Old browsers */
background: -moz-linear-gradient(top,  #cb60b3 0%, #ad1283 50%, #de47ac 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #cb60b3 0%,#ad1283 50%,#de47ac 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #cb60b3 0%,#ad1283 50%,#de47ac 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb60b3', endColorstr='#de47ac',GradientType=0 ); /* IE6-9 */
}


.area-box-pk{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff146e+1,d60225+100 */
background: #ff146e; /* Old browsers */
background: -moz-linear-gradient(top,  #ff146e 1%, #d60225 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ff146e 1%,#d60225 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ff146e 1%,#d60225 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff146e', endColorstr='#d60225',GradientType=0 ); /* IE6-9 */
}

.area-box-a{
	background-image: linear-gradient(to top, #7028e4 0%, #e5b2ca 100%);
}

.area-box-t{
background-image: url("https://www.transparenttextures.com/patterns/gplay.png");
}


.area-woven{
	background-color: #1c1c1c;
	background-image: url("https://www.transparenttextures.com/patterns/woven.png");
}

.area-woven-t{
	background-image: url("https://www.transparenttextures.com/patterns/woven.png");
}

.area-woven-y{
	background-color: #efe164;
	background-image: url("https://www.transparenttextures.com/patterns/woven-light.png");
}


.area-grad-bk{
background: #7d7e7d; /* Old browsers */
background: -moz-linear-gradient(top,  #7d7e7d 0%, #0e0e0e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #7d7e7d 0%,#0e0e0e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */

}


.area-cube{
	background-image: url("https://www.transparenttextures.com/patterns/cubes.png");
}

.area-cube-y{
	background-color: #d6b200;
	background-image: url("https://www.transparenttextures.com/patterns/cubes.png");
}

.area-bg{
	background-image: url(../../../../images/auto/mae/bg-sparkle.jpg);
	background-size: cover;
	background-position: center;
}

.area-bg2{
	background-image: url(../../../../images/auto/sal/body3.jpg);
	background-size: cover;
	background-position: center;
}

.area-dm{
	background-image: url("https://www.transparenttextures.com/patterns/diagmonds.png");
}



.area-y{background-image: url(../../../../images/auto/sal/bg-section.jpg);}
.area-lty{background-color:#F9F0A9;}
.area-be{background-color: #FAF7ED;}
.area-o{background-color: #FBB117;}
.area-rd{background-color:#C83231;}
/* .area-rd{background-image: url(../../../../images/auto/mae/bg-section-rd.jpg);} */
.area-bj{background-color: #F8EBB5;}
.area-pk{background-image: url(../../../../images/auto/mae/bg-section-pk.jpg);}
.area-bl{background-image: url(../../../../images/auto/mae/bg-section-bl.jpg);}
.area-vio{background-image: url(../../../../images/auto/mae/bg-section-vio.jpg);}

.area-b{background-color: #221714;}

.area-gr{
	color: #fff;
	background-color: #45ad00;
	background-image: url("https://www.transparenttextures.com/patterns/black-linen.png");
}

.area-emerald{
	background-image: url(../../../../images/book/sal/sal_sub_bg.png);
	background-size: cover;
	background-position: center;
}

.area-warning{
	background-image: url(../../../../images/auto/mae/bg-warning.png);
	position: relative;
	z-index: 99999;
}

.area-wa01{
	background-image: url(../../../../images/book/etel/bg_wa01.jpg);
	background-size: cover;
	background-position: center;
	position: relative;
}

.area-wa02{
	background-image: url(../../../../images/book/etel/bg_wa02.jpg);
	background-size: cover;
	background-position: center;
	position: relative;
}

.area-xmas{
	background-image: url(../../../../images/newb/mae1/section_bg_xmas.png);
	background-size: cover;
	background-position: center;
}

.area-wtgd{
	background-image: url(../../../../images/newb/sal/section_bg_wtgd.png);
	background-size: cover;
	background-position: center;
}

.area-wa03{
	background-image: url(../../../../images/newb/sal/section_bg_wa03.png);
	background-size: cover;
	background-position: center;
}

.area-system{
	background-image: url(../../../../images/lps/nop/newop_bg.png);
	background-size: cover;
	background-position: center;
}

.area-clip-bk{
	background-image: url(../../../../images/king/mae/mae_main_bg.png);
	background-size: cover;
	background-position: center;
	position: relative;
	clip-path: polygon(100% 0%, 95% 50%, 100% 100%, 0 100%, 5% 50%, 0 0);
}

.area-note{
	background-color: #fafa96;
	background-image: url("https://www.transparenttextures.com/patterns/lined-paper-2.png");
	}

.area-note_n{
	background-image: url("https://www.transparenttextures.com/patterns/lined-paper-2.png");
}


.area-bo{
	border:0.2rem solid #bc1c00;
}
.area-bo-grn{
	border:0.2rem solid #006331;
}
.area-bo-bl{
	border:0.2rem solid #0036cc;
}
.area-bo-sky{
	border:0.2rem solid #00b0e6;
}

.area-bo-wt{
	border: 0.4rem ridge #ffffff;
}

.area-bo-g{
	border: 0.4rem ridge #E6D2B0;
}

.area-bo-s{
	border: 0.4rem ridge #b5bdc8;
}

.area-bo-b{
	border: 0.4rem ridge #f0b7a1;
}

.area-db{
	background-color: #131821;
}

.area-overlay {
  width: 100%;
  background-image: linear-gradient(45deg, rgba(0,0,0,.2) 50%, rgba(0,0,0,.4) 50%);
  background-size: 3px 3px;
  z-index: 2;
}


.area-overlay_wt {
  width: 100%;
  background-image: linear-gradient(45deg, rgba(255,255,255,.2) 50%, rgba(255,255,255,.4) 50%);
  background-size: 3px 3px;
  z-index: 2;
}


.area-overlay_y {
	width: 100%;
	background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.2) 50%, rgba(255,255,0,.4) 50%);
	background-size: 10px 10px;
	z-index: 2;
  }

.area-overlay-bk {
	background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 95%, rgba(0, 0, 0, 0.4) 95%);
	background-size: 5px 5px;
}

.area-overlay-bl {
	background-image: linear-gradient(45deg, rgba(0, 20, 255, 0.2) 50%, rgba(0,20,255,0.4) 50%);
	background-size: 5px 5px;
}

.area-overlay-db {
	background-image: linear-gradient(45deg, rgba(0, 6, 90, 0.2) 50%, rgba(0,6,90,0.4) 50%);
	background-size: 3px 3px;
}

.area-overlay-gr {
	background-image: linear-gradient(45deg, rgba(100, 255, 0, 0.2) 50%, rgba(100,255,0,.4) 50%);
	background-size: 5px 5px;
}

.area-overlay-yl {
	background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.2) 50%, rgba(255,255,0,.4) 50%);
	background-size: 5px 5px;
}

.area-overlay-rd {
	background-image: linear-gradient(45deg, rgba(255, 0, 0, 0.2) 50%, rgba(255,0,0,.4) 50%);
	background-size: 5px 5px;
}


.area-box-p{
	background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.area-super{
	background-color: #baa912;
	background-image: url("https://www.transparenttextures.com/patterns/woven.png");
}

.area-special{
	background-color: #ad4420;
	background-image: url("https://www.transparenttextures.com/patterns/woven.png");
}

.area-dhorse{
	background-color: #5878bc;
	background-image: url("https://www.transparenttextures.com/patterns/woven.png");
}

.area-sepia{
color: #ffffff;
background-color: #a30303;
background-image: url("https://www.transparenttextures.com/patterns/ps-neutral.png");
/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

.area-sepia-top{
	height: 5rem;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#101111+18,8e897a+68,f2ead0+100 */
background: #101111; /* Old browsers */
background: -moz-linear-gradient(top,  #101111 18%, #8e897a 68%, #f2ead0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #101111 18%,#8e897a 68%,#f2ead0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #101111 18%,#8e897a 68%,#f2ead0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#101111', endColorstr='#f2ead0',GradientType=0 ); /* IE6-9 */
}

.area-sepia-bottom{
	height: 5rem;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f2ead0+0,8e897a+32,101111+100 */
background: #f2ead0; /* Old browsers */
background: -moz-linear-gradient(top,  #f2ead0 0%, #8e897a 32%, #101111 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f2ead0 0%,#8e897a 32%,#101111 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f2ead0 0%,#8e897a 32%,#101111 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2ead0', endColorstr='#101111',GradientType=0 ); /* IE6-9 */
}


.area-tile{
color: #000000;
background-color: #f4f7f6;
background-image: url("https://www.transparenttextures.com/patterns/rocky-wall.png");
/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */

}

.area-tree{
color: #ffffff;
background-color: #332222;
background-image: url("https://www.transparenttextures.com/patterns/shley-tree-1.png");
/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}


.area-xv{
	background-color: #000000;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-wt{
	background-color: #ffffff;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-t{
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-b{
	background-color: #57626b;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-y{
	background-color: #ffea2b;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-gr{
	background-color: #1f4d00;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-bl{
	background-color: #001f4d;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-xv-rd{
	background-color: #4d0000;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

.area-arg{
	background-image: url("https://www.transparenttextures.com/patterns/argyle.png");
}

.area-mlpd{
background-color: #000000;
background-image: url("https://www.transparenttextures.com/patterns/my-little-plaid-dark.png");
}

.area-off{
background-color: #000000;
background-image: url("https://www.transparenttextures.com/patterns/office.png");
}

.area-sd{
background-color: #000000;
background-image: url("https://www.transparenttextures.com/patterns/shattered-dark.png");
}

.area-star{
background-color: #000000;
background-image: url("https://www.transparenttextures.com/patterns/stardust.png");
}

.area-dance{
background: linear-gradient(to right, #c21500 80%, #ffc500 100%);
color: white;
}

.area-counter{
	background: rgb(228,0,112);
	background: linear-gradient(110deg, rgba(228,0,112,1) 0%, rgba(74,0,0,1) 10%, rgba(10,0,74,1) 90%, rgba(0,185,255,1) 100%);
	color: white;
}

.area-exa{
	background-color: #382413;
	background-image: url("https://www.transparenttextures.com/patterns/dark-exa.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

.area-exa-t{
	background-image: url("https://www.transparenttextures.com/patterns/dark-exa.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}




.area-bor{
	border: 0.7rem solid #fcca5d;
}


.area-bp{
	border:0.2rem solid #bcb3bb;
}

.area-rainbow{
	background: linear-gradient(to bottom, Magenta, yellow, Cyan, Magenta) ;
	/* padding: 1rem; */
}

.shadow{
	box-shadow: 0 0px 15px rgba(0, 0, 0, 0.5);
}

.shadow-wt{
	box-shadow: 0 0px 20px rgba(255, 255, 255, 0.75);
}

.t-shadow-s{
	  text-shadow: -1px -1px 1px rgba(100, 100, 100, .5),
               1px 1px 1px rgba(255, 255, 255, .7);
}

.flash-rd{
	filter: drop-shadow(0px 0px 20px rgba(222,32,36,1));
}

.flash-gr{
	filter: drop-shadow(0px 0px 20px rgb(203, 222, 32));
}

.flash-wt-s{
	filter: drop-shadow(0px 0px 3px rgb(255, 255, 255));
}

.ltred{color: #ffa3a3;}
.pink{color: #EF0D51;}
.vio{color: #3c0a5b;}
.bg-y{background-color: #fff89b;}
.tr{color: #ff0000;}
.sky{color: #009CA8;}

.area-sky{background-color: #009CA8;}
.area-aqua{background-color: #c8fbff;}


/*==========================================*/


.box{
	display: inline-flex;
	width: 100%;
}

.box p{
	padding: 1rem;
}

.box i{
	margin-top: 0.3rem;
/*	color: #ff0000;
*/}



.box-table{
	display: table;
}

.box-table div{
	display: table-cell;
	/* width: auto; */
}

.jfc-se{
	justify-content: space-evenly;
}



/*==========================================*/

.bg-flash{
	position: relative;
	overflow: hidden;
	height: 50rem;
	margin-right:auto;
	margin-left: auto;
}

.bg-flash div{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);

}


/* result
**********************************************************/




/*=====================================================
result
=====================================================*/

.result{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 1rem;
}

.result li{
	width: calc(100% / 2 - 0.5rem);
	display: inline-block;
	font-size: 1.6rem;
	text-align: left;
	background-color: rgba(0,0,0,0.5);
	padding: 1rem;
	border: 0.1rem solid #009CA8;
	margin-bottom: 2rem;
}

.result li .data{
	display: flex;
	flex-wrap: nowrap;
}

.result li .data .hdd{
	padding: 0.5rem;
	width: 40%;
	text-align: center;
}

.result li .data .num{
	padding: 0.5rem;
	width: 60%;
	background-color: #ffffff;
	color: #DE2024;
	font-weight: bold;
	text-align: center;
}

.result-allrace{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 4rem;
}

.result li .hit{
	display: flex;
	flex-wrap: wrap;
}


.result li .hit .hdd{
	padding: 0.5rem;
	width: 40%;
	margin-bottom: 0.5rem;
	text-align: center;
}

.result li .hit .money{
	padding: 0.5rem;
	width: 60%;
	background-image: url(../../../../images/auto/sal/bg-section.jpg);
	color: #DE2024;
	font-weight: bold;
	margin-bottom: 0.5rem;
	font-size: 2.5rem;
	text-align: right;
}


/* result
**********************************************************/


.result-data{
	padding: 1rem;
	color: #ffffff;
	background-color: #000000;
	text-align: left;
}

.result-data br{
	display: block;
}

.result-data br.sb{
	display: none;
}


.result-box{
	width: 100%;
	margin-bottom: 3rem;
	/* display: grid;
	grid-template-columns: 50% 1fr ; */
	font-size: 1.6rem;
}

.result-box2{
	width: 100%;
	color: #ffffff;
	padding: 1rem;
	margin-bottom: 3rem;
	display: grid;
	grid-template-columns: 30% 1fr 30% 1fr ;
	font-size: 1.6rem;
}


.l-box{
	text-align: left;
	margin-right: 1rem;
}

.l-number{
	display: inline-flex;
	flex-wrap: wrap;
}


.l-number p.hdd{
	flex-basis: 40%;
	font-size: 1.5rem;
	color: #ffffff;
	background-color: #474747;
	font-weight: normal;
	background-image: none;
	margin-right: 0.2rem;
}

.l-number p.colspan{
	width: 100%;
}



.l-number p.hdd-omega{
	flex-basis: 40%;
	font-size: 1.5rem;
	color: #ffffff;
	background-color: #272266;
	font-weight: normal;
	background-image: none;
	margin-right: 0.2rem;
}


.l-number p.hdd-alpha{
	flex-basis: 40%;
	font-size: 1.5rem;
	color: #ffffff;
	background-color: #A8150B;
	font-weight: normal;
	background-image: none;
	margin-right: 0.2rem;

}

.l-number p{
	width: 58%;
	padding: 1rem;
	margin-bottom: 0.1rem;
	text-align: left;
	background-color: #000000;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
}



.r-number{
	display: inline-flex;
	flex-wrap: wrap;
	text-align: left;
}


.r-number p.hdd{
	flex-basis: 40%;
	font-size: 1.5rem;
	color: #ffffff;
	background-color: #474747;
	font-weight: normal;
	background-image: none;
	margin-right: 0.2rem;
	text-align: left;
}



.r-number p{
	width: 59%;
	text-align: left;
	padding: 1rem;
	margin-bottom: 0.1rem;
	background-color: #000000;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
}


p.omega{
	font-size: 1.6rem;
	color: #ffffff;
	background-color: #272266;
	font-weight: bold;
	background-image: none;
	margin-right: 0.2rem;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
}


p.alpha{
	font-size: 2rem;
	color: #fff94c;

	background-color: #A8150B;
	font-weight: bold;
	background-image: none;
	margin-right: 0.2rem;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
}



p.money{
	background-color: #dddddd;
	font-weight:normal;
	text-align: left;
	font-size: 2rem;
}

p.hit{
	background-color: #ffee3a;
	color: #FF0000;
	font-weight: bold;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");
}

/* p.fs25{
	font-size: 2rem;
} */

p.omega span{
	color: #fff94c;
	font-size: 2rem;
}


p.alpha span{
	color: #ffffff;
	font-size: 1.6rem;
}



.result-alpha .result-data{
	background-color: #010101;
	background-image: url("https://www.transparenttextures.com/patterns/argyle.png");
}

.result-alpha  p.hdd{
	background-color: #4e4600;
	background-image: url("https://www.transparenttextures.com/patterns/starring.png");
}
/*　
*********************************************************/


/*　
*********************************************************/
.note4{
	width: 90%;
  color: #010427;
  margin-left: auto;
  margin-right: auto;
  border: solid 1px #e6e6e6;
  padding: 1rem;
  box-shadow:2px 2px 0 rgba(0,0,0,.1);
}
.sen4{
  background-color: #fff;
  text-align: left;
  background-image:
  linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
  background-size: 8px 100%,100% 2em;
  line-height: 2;
  padding: 2em 1em 1.8em 1em;
}

.note{
	background-color: #ffffff;
	margin: 1rem;
	box-shadow: 2px 2px 13px #dddddd;
	border: 0.1rem solid #cccccc;
	transform:rotate(3deg);
}

.sen4 p{
  padding: 2em 1em 1.8em 1em;
}



ul.comment{
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

.note3{
	width: 100%;
  color: #010427;
  margin-left: auto;
  margin-right: auto;
  border: solid 1px #e6e6e6;
  padding: 1rem;
  box-shadow:2px 2px 0 rgba(0,0,0,.1);
}

ul.comment li.sen4{
  background-color: #fff;
  text-align: left;
  background-image:
  linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
  background-size: 8px 100%,100% 2em;
  line-height: 2;
  padding:2em 1em 1.8em 1em;
}

ul.comment li.sen4 p{
  padding: 1.8em 1em 1.8em 1em;
}


ul.comment li{
	display: block;
	width: 100%;
	font-size: 1.6rem;
	font-weight: bold;
	color:#000000;
/*	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
*/	background-color: #fffef0;
	padding: 2rem 2rem;
	margin-top: 1rem;
	border-radius: 1rem;
	border: 0.2rem dotted #ccbb20;
}


ul.comment li:nth-child(even){
	background-color: #fffacb;
}

ul.comment li:nth-child(even).sen4{
  background-image:
  linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #e9e6f7 0%, #e9e6f7 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
}



ul.comment li .c-date{
	display: block;
	font-size: 1.4rem;
	color: #999999;
	font-weight: normal;
	margin-bottom: 1rem;
}
/* 全体の枠 */
ul.talk {
	width: 100%;
	background:#fff493;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
	padding: 3rem 0;
/*	overflow:auto;
*/	display: block;
	list-style: none;
	text-align: left;
	color: #000000;
	font-size: 1.7rem;
	font-family: "メイリオ","Meiryo","Osaka","MS Pゴシック","MSゴシック",Helvetica,verdana,arial;
}


ul.talk li{
	width: 100%;
	margin-bottom:3rem;
}


ul.talk li p{
	width: 75%;
	min-height: 3rem;
}

/* 左のトークボックス */
ul.talk li:nth-child(odd):after { /* 左のスペース */
	content:'';
	display:inline-block;
	width: 15%;
}

ul.talk li:nth-child(odd):before { /* 左の丸アイコン */

	display:inline-block;
	vertical-align:top;
	text-align: right;
	padding: 0 2rem 0 0;
	width: 10%;
}

ul.talk li:nth-child(odd) p:before {  /* 左ふきだしの左三角を描画 */
	content: '';
	position:absolute;
	top:8px;
	left:-20px;
	border: 12px solid transparent;
	border-right:12px solid white;
}
ul.talk li:nth-child(odd) p { /* 左ふきだしの本体 */
	display:inline-block;
	position:relative;
	background-color:white;
	border-radius:10px;
	margin:0 0 0 0;
	padding: 2rem;
}
/* 右のトークボックス */
ul.talk li:nth-child(even):before { /* 左のスペース */
	content:'';
	display:inline-block;
	width: 15%;
}

ul.talk li:nth-child(even):after { /* 右の丸アイコン */
	content:'\f59a';
	font-family: FontAwesome;
	font-size: 3rem;
	color: #C83231;
	display:inline-block;
	vertical-align:top;
	text-align: left;
	padding: 0 0 0 2rem;
	width: 10%;
}


ul.talk li:nth-child(even) p:after { /* 右ふきだしの右三角を描画 */
	content: '';
	position:absolute;
	top:8px;
	right:-20px;
	border: 12px solid transparent;
	border-left:12px solid #343434;
}
ul.talk li:nth-child(even) p { /* 右ふきだしの本体 */
	display:inline-block;
	position:relative;
	background-color:#343434;
	color: #ffffff;
	border-radius:10px;
	margin:0 0 0 0;
	padding: 2rem;
}


ul.last-number{
	display: flex;
	flex-wrap:wrap;
	justify-content:center;
	overflow: hidden;
}

ul.last-number li{
	display: inline-block;
	color: #000000;
	background-color: #ffffff;
	padding: 1.5rem 3rem;
	margin: 0.2rem;
	font-size: 2.3rem;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");

}

ul.last-number2{
	display: block;
	overflow: hidden;
}

ul.last-number2 li{
	display: block;
	color: #ff0000;
	background-color: rgb(255, 255, 255);
	padding: 1.5rem 3rem;
	margin: 10rem 3rem 3rem;
	font-size: 3rem;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
}

ul.last-number2 li:first-of-type{
	margin-top:3rem;
}

ul.last-number li:nth-child(2n){
	background-color: #e7ffd5;
	color: #333000;
}

ul.last-number li:nth-child(2n+1){
	color: #ffffff;
	background-color: #003019;
}


/*===========================================*/



/*--アコーディオン--*/

.accbox {
	width: 100%;
    padding: 0;
}


.accbox label {
	width:90%;
	display: block;
	margin:0 auto;
	padding: 2rem 1rem;
	font-weight: bold;
	cursor :pointer;
	text-align:center;
	border-radius: 1.5rem;
	background-color: #aa1111;
	vertical-align: middle;
	color: #ffffff;
}



.accbox input {
    display: none;
}

.accbox .accshow {
	width:100%;
	height: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0;
	transition: 0.8s;
}

.cssacc:checked + .accshow {
    height: auto;
    padding: 5px;
    background: #;
    opacity: 1;
}

.accordion-click{
	border: #dcdcdc solid 0.2rem;
    padding: 1% 1%;
    font-size: 170%;
    line-height: 1.6;
    margin:2% auto;
    width:90%;
    cursor:pointer;
}
.accordion-click span{
	border-bottom:2px #B0B0AF solid;
}
.accordion-click:hover{
	opacity:0.8;
	background:#FBF7DF;
}




#sampleBox {
    width: 100%;
    height: 40rem;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
    border-radius: 10px;
    font-weight: bold;
}
#sampleText {
    margin: 40rem 0;
}

#sampleText li{
    display: inline-block;
    padding: 0.5rem;
    color: #000000;
    background-color: #ffffff;
    margin: 0.2rem;
    background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
    backface-visibility:hidden;
}


ul.monitor {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
/*	align-items: flex-start;
*/}


ul.monitor li{
	width: calc(100% / 2 - 1%);
	display: inline-block;
	background-color: #ffffff;
	padding: 2rem;
	color: #000000;
	position: relative;
	text-align: left;
	font-size: 1.6rem;
	margin-bottom: 3rem;
}


ul.monitor li img.icon{
	width: 10rem;
	height: 10rem;
	background-color: #ffffff;
	object-fit: contain;
	border-radius: 8rem;
	border: 0.2rem solid #000000;

}


ul.monitor {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
    height:300vw;
}

ul.monitor .item {
	width: calc(100% / 2 - 2%);
	display: inline-block;
	background-color: #ffffff;
	padding: 2rem;
	color: #000000;
	position: relative;
	text-align: left;
	font-size: 1.6rem;
	margin-bottom: 3rem;
}



@media (max-width: 667px) {
	.flexbox {
	  height: auto;
	}
	.flexbox .item {
	  width: 100%;
	}
  }
  

/*****************************************
	ユーザー声　吹き出し
******************************************/
.balloon5 {
	width: 100%;
	margin: 1.5em 0;
	/* overflow: hidden; */
  }
  .balloon5 .chatting {
	width: 100%;
  }
  
  .says {
	/* display: inline-block; */
	position: relative; 
	margin: 10px 0 0 20px;
	padding: 17px 13px;
	border-radius: 12px;
	background: #d4d4d4;
  }
  
  .says:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 10px; 
	left: -24px;
	border: 12px solid transparent;
	border-right: 12px solid #d4d4d4;
  }

  .says2 {
	/* display: inline-block; */
	position: relative; 
	margin: 10px 0 0 20px;
	padding: 17px 13px;
	border-radius: 12px;
	background: #ffeaea;
  }
  
  .says2:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 18px; 
	left: -24px;
	border: 12px solid transparent;
	border-right: 12px solid #ffeaea;
  }
  
  .says p {
	margin: 0;
	padding: 0;
  }

  /* 吹き出し本体 */
.balloon01{
	position: relative;
	box-shadow: 6px 6px 0px 0px #8c8a30;         /* 吹き出し本体の影 */
  }
  /* 三角アイコン */
  .balloon01::before{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: 27px;
	bottom: -18px;
	border-top: 15px solid #8c8a30;
	border-right: 15px solid transparent;
	border-left: 15px solid transparent;
  }
  /* 三角アイコンの影 */
  .balloon01::after{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: 20px;
	bottom: -15px;
	border-top: 15px solid #d19900;
	border-right: 15px solid transparent;
	border-left: 15px solid transparent;
  }

/*****************
  バルーン左
*****************/
.balloon-left {
    display: flex;
    justify-content: center;
    align-items: start;
    gap: 0 22px;
}

.balloon-left img {
    max-width: 10%;
    height: 100%;
    border: 3px solid #f6fbff;
    border-radius: 50%;
}

.balloon-left p.says3 {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 1rem;
    border-radius: 5px;
    background-color: #f6fbff;
    color: #333333;
}
.balloon-left p.says3 span.name {
    display: block;
	padding-bottom: 0.2rem;
	border: none;
	border-bottom: #333 dotted 0.2rem;
	text-align: left;
}

.balloon-left p.says3::before {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 30px;
    background-color: #f6fbff;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    content: '';
}


/*****************
  バルーン右
*****************/
.balloon-right {
    display: flex;
    justify-content: center;
    align-items: start;
    gap: 0 22px;
}

.balloon-right img.icon {
    max-width: 10%;
    height: 100%;
    border: 3px solid #a10000;
    border-radius: 50%;
}

.balloon-right p.says4 {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 1rem;
    border-radius: 5px;
    background-color: #ffe6e6;
    color: #333333;
}
.balloon-right p.says4 span.name {
    display: block;
	padding-bottom: 0.2rem;
	border: none;
	border-bottom: #333 dotted 0.2rem;
	text-align: right;
}
.balloon-right p.says4::before {
    position: absolute;
    right: -15px;
    width: 15px;
    height: 30px;
    background-color: #ffe6e6;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    content: '';
}

.balloon-right div.says4 {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 1rem;
    border-radius: 5px;
    background-color: #ffe6e6;
    color: #333333;
}
.balloon-right div.says4 span.name {
    display: block;
	padding-bottom: 0.2rem;
	border: none;
	border-bottom: #333 dotted 0.2rem;
	text-align: right;
}
.balloon-right div.says4::before {
    position: absolute;
    right: -15px;
    width: 15px;
    height: 30px;
    background-color: #ffe6e6;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    content: '';
}


.balloon-right img.isshiki {
    max-width: 15%;
    height: 100%;
    border: 3px solid #d6d7ff;
    border-radius: 50%;
}
.balloon-right p.says5 {
    position: relative;
    width: 100%;
    margin: 3px 0 0;
    padding: 1.4rem;
    border-radius: 5px;
    background-color: #d6d7ff;
    color: #333333;
}
.balloon-right p.says5 span.name {
    display: block;
	padding-bottom: 0.2rem;
	border-bottom: #333 dotted 0.2rem;
	text-align: right;
}
.balloon-right p.says5::before {
    position: absolute;
    right: -15px;
    width: 15px;
    height: 30px;
    background-color: #d6d7ff;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    content: '';
}



/*****************************************
	ユーザー声　エアメール
******************************************/

.air-mail {
    position: relative;
    padding: 14px;
    width: 100%;
    background: -webkit-repeating-linear-gradient(135deg, #d43 0px, #d43 20px, #fec 20px, #fec 40px, #226 40px, #226 60px, #fec 60px, #fec 80px);
    background: repeating-linear-gradient(135deg, #d43 0px, #d43 20px, #fec 20px, #fec 40px, #226 40px, #226 60px, #fec 60px, #fec 80px);
    -webkit-box-shadow: 0 0 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 0 0 6px rgba(0,0,0,0.6);
    box-shadow: 0 0 6px rgba(0,0,0,0.6);
}
.air-mail section{
    padding: 20px;
    background: #fec;
    color: #430;
}
.air-mail h2{
    margin: 0;
}
.air-mail h2 a{
    margin: 0;
    color: #430;
}
.air-mail section p{
    margin: 16px 0 0;
    line-height: 1.61;
}
.air-mail time{
    position: absolute;
    bottom: 5%;
    right: 5%;
    display: inline-block;
    padding: 10px;
    width: 120px;
    height: 120px;
    border: 5px double rgba(68, 51, 0,0.5);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: rgba(68, 51, 0,0.5);
    text-align: center;
    font-size: 20px;
    font-family: 'Bree Serif', serif;
    line-height: 100px;
    -webkit-transform: rotate(-16deg);
    -ms-transform: rotate(-16deg);
    transform: rotate(-16deg);
}
.air-mail time:before{
    position: absolute;
    top: 14%;
    display: block;
    padding: 0 0 8px;
    width: 82%;
    border-bottom:1px solid rgba(68, 51, 0,0.5);
    content: 'Posted at :';
    font-size: 16px;
    line-height: 1;
}
.air-mail time:after{
    position: absolute;
    bottom: 16%;
    display: block;
    padding: 6px 0 0;
    width: 82%;
    border-top: 1px solid rgba(68, 51, 0,0.5);
    content: 'from JAPAN';
    font-size: 13px;
    line-height: 1;
}


/*===========================================*/

/*折り畳み*/
.hidden_box {
    padding: 0;
}

.hidden_box label {
	width: 80%;
    padding: 2rem;
    text-align: center;
    font-weight: bold;
    cursor :pointer;
    color: #ffffff;

	background-color: #44858c;
	background-image: url("https://www.transparenttextures.com/patterns/inflicted.png");
}

/*ボタンホバー時*/
.hidden_box label:hover {
	background-color:#8dddcb;
	color:#253654;
	background-image: none;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
    padding: 10px 0;
    height: auto;
    opacity: 1;
}


/*********************************************************
/* form
*********************************************************/

.area-form{
	width: 100%;
	margin: 0 auto;
}

.form {
	width: 100%;	
	margin: 0rem auto;
/*	padding: 2rem;
*/	text-align: center;
	color: #000000;
}

.form-deux{
	display: flex;
    justify-content: space-between;
    align-items: center;
}


label {
	margin: 0.5rem auto;
	width: 50%;
	font-weight: bold;
	text-align: left;
	cursor:pointer;
	color: #000000;
	background-color: #dddddd;
	padding: 1.5rem 2rem;
	border-radius: 0.5rem;
	display: inline-block;
}

label:hover {
	border: none;
}


input[type="text"]{
	width: 75%;
	padding:1.5rem 1rem;
	font-size:2rem;
/*	color:#000000;
	font-weight:bold;
	text-align: center;
	background-color: #dddddd;
	border-radius: 0.5rem;
	border: none;*/
	color:#000000;
	font-weight:bold;
	background-color: #ffffff;
	border: 0.5rem solid #bfbfbf;
	border-radius: 0.5rem;

}

input[type="email"]{
	width: 75%;
	padding:1.5rem 1rem;
	font-size:2rem;
/*	color:#000000;
	font-weight:bold;
	text-align: center;
	background-color: #dddddd;
	border-radius: 0.5rem;
	border: none;*/
	color:#000000;
	font-weight:bold;
	background-color: #ffffff;
	border: 0.5rem solid #bfbfbf;
	border-radius: 0.5rem;

}

/* input[type="submit"]{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	display: block;
	padding: 2rem;
	font-size: 3rem;
	background-color: #00B000;
	border-radius: 10rem;
	color: #ffffff;
	border: none;
	cursor: pointer;
} */


button{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	display: block;
	padding: 2rem;
	font-size: 2rem;
	font-weight: bold;
	/* background-color: rgb(255, 80, 20); */
	background: transparent;
	color: #ffffff;
	border: 0.3rem solid #ffffff;
	/* background-image: url("https://www.transparenttextures.com/patterns/blizzard.png"); */
	border: none;
	cursor: pointer;
}


button.agree {
	background-color: rgb(102, 102, 102);
	cursor: pointer;
}

select{
	padding:1.5rem;
	font-size:1.6rem;
	color:#000000;
	font-weight:bold;
	border-radius: 0.5rem;
	margin: 0 0 2rem 0;
	background-color: #ffffff;
	cursor: pointer;
}

option{
	cursor: pointer;
}



textarea{
	padding:1.5rem;
	font-size:1.8rem;
	width:100%;
	height: 20rem;
	border:0.2rem solid #dddddd;
	font-family: "メイリオ","Meiryo","Osaka","MS Pゴシック","MSゴシック",Helvetica,verdana,arial;
}



a.p-link{
	width: 90%;
	margin: 0 auto;
	display: block;
	padding: 2rem;
	background-color: #FF2B74;
	color: #ffffff;
	cursor: pointer;
}


a.rd-link{
	width: 90%;
	margin: 0 auto;
	display: block;
	padding: 2rem;
	background-color: #FF1D00;
	color: #ffffff;
	cursor: pointer;
}


a.v-link{
	width: 90%;
	margin: 0 auto;
	display: block;
	padding: 2rem;
	background-image: linear-gradient(-225deg, #AC32E4 0%, #7918F2 48%, #4801FF 100%);
	color: #ffffff;
	border-radius: 5rem;
	cursor: pointer;
}

a.g-link{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	display: block;
	padding: 2rem;
	border-radius: 1rem;
	border: none;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f5f6f6+0,dbdce2+21,b8bac6+49,dddfe3+80,f5f6f6+100;Grey+Pipe */
	background: #f5f6f6; /* Old browsers */
	background: -moz-linear-gradient(top,  #f5f6f6 0%, #dbdce2 21%, #b8bac6 49%, #dddfe3 80%, #f5f6f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); /* IE6-9 */
	color: #000000;
	font-weight: bold;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
	cursor: pointer;
}

@media screen and (min-width: 568px) {
a.g-link:hover{
	text-decoration: none;
	opacity: 0.7;
}
}


.brick {
	margin: 0 auto;
	padding: 1rem;
	width: 100%;
	column-count: 3;
	column-gap: 0;
  }
  
  @media (max-width: 800px) {
	.brick {
	  column-count: 2;
	}
  }
  
  @media (max-width: 480px) {
	.brick {
	  column-count: 1;
	}
  }
  
  .grid {
	  -webkit-column-break-inside: avoid;
	  page-break-inside: avoid;
	  break-inside: avoid;
	  background: #ffffff;
	  text-align: left;
	  margin: 1rem 0.5rem;
	  border-radius: 0.5rem;
	  box-shadow: 0 0px 10px #9e9e9e;
	  font-size: 1.6rem;
	  color: #ED486A;
  }
  
  .grid p{
	  padding: 1.4rem;
  }


/*===========================================*/

table.beta{
	width: 100%;
	margin: 0 auto;
	border-spacing: 0.1rem;
	line-height: 1.2;
	border: #1f4d00 1px solid;
}
th {
	padding: 0.5rem 0;
}
td{
	padding: 0.2rem 0;
	font-size: 1.8rem;
}
table.beta th {
	background: #54c282;
	color: rgb(255, 251, 217);
}

table.beta td.hit{
	background-color: yellow;
	font-weight: bold;
	color: red;
}

table.beta tr.even {
	background: #efffe6;
}

table.beta tr.odd {
	background: #fbfef9;
}

@media screen and (max-width: 640px) {
	table.beta th{
		font-size: 1.2rem;
	}
	table.beta th.day{
		font-size: 1.6rem;
	}
	
	table.beta td{
		font-size: 1.0rem;
	}
}



table.list{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	border-spacing: 0.1rem;
	line-height: 1.5;
}


table.list th{
	padding:1rem;
	text-align: center;
	width: 25%;
	font-size: 2rem;
	vertical-align: middle;
	font-weight: bold;
	border-bottom: 0.1rem solid #ffffff;
	color: #ffffff;
	background-color: #7e0f00;
	background-image: url("https://www.transparenttextures.com/patterns/batthern.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}


table.list td{
	text-align: left;
	background-color: #ffffff;
	padding:1rem;
	border-bottom: 0.1rem solid #dddddd;
}

table.tokuten{
	width: 80%;
	margin:0 auto;
	border-spacing: 0.1rem;
	line-height: 1.5;
	border: #d6b200 groove 2px;
	font-size: 1.8rem;
}
table.tokuten th{
	padding:1rem 0;
	width: 100%;
	text-align: center;
	font-weight: bold;
	border-bottom: 0.1rem solid #ffffff;
	background-color: maroon;
	color: #fff;
}

/* table.tokuten tr.kako{
	text-decoration: line-through double #380000;
} */

table.tokuten td{
	text-align: center;
	background-color: #ffffff;
	padding:1rem 0;
	border-bottom: 0.1rem solid #dddddd;
}

table.tokuten td.day{
	background-color: #af4949;
	color: #fff;
	font-weight: bold;
}

table.tokuten td.pt{
	background-color: #fde8e8;
	font-weight: bold;
	color: #380000;
}


table.list hr{
	border-top: 1px dotted #394046;
	border-bottom: 1px dotted #fff;
	margin: 0.5rem 0;
}



table.list .gray{
	color: #6d6d6d;
}



table.gouka{
	width: 100%;
	margin: 0 auto;
	border-spacing: 0;
	line-height: 1.5;
	border: #001e57 groove 2px;
	background-color: #fff;
}

table.gouka tr:nth-child(odd){
	background-color: #eef2ff;
	color: #00042c;
}

table.gouka th{
	width: 30%;
	padding: 1rem 0;
	text-align: center;
	vertical-align: middle;
	border: #001e57 solid 1px;
	color: #303030;
	background-color: #ffaa2b;
	background-image: url("https://www.transparenttextures.com/patterns/batthern.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

table.gouka td{
	width: 30%;
	padding: 1rem;
	text-align: center;
	border: #001e57 solid 1px;
}

table.gouka td.umu{
	width: 30%;
	padding: 1rem;
}



/* @media screen and (max-width: 768px) {
	table.gouka th{
		width: 100%;
		display: block;
		padding: 0.5rem 0;
		text-align: center;
		vertical-align: middle;
	}
	
	table.gouka td{
		width: 50%;
		display: inline-block;
		padding: 0.5rem;
	}
	table.gouka td.umu{
		width: 50%;
		display: inline-block;
		padding: 0.5rem;
	}
} */







table.point{
	width:100%;
	margin-left: auto;
	margin-right: auto;
	font-size: 1.6rem;
	border-spacing: 0;

}


table.point th{
	width:22%;
	padding: 3rem 1rem;
	font-weight: normal;
	text-align: center;
	vertical-align: top;
	background-color: #f2266a;
	color: #ffffff;
	font-size: 1.6rem;
	letter-spacing: 0.2rem;
	border-bottom: 1px solid #ffffff;
}


table.point td{
	padding:1rem 1rem 4rem 1rem;
	overflow: hidden;
	text-align: left;
	background: #ffffff;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
	border-bottom: 1px solid #ffffff;
}


span.hissu{
	display: inline-block;
	min-width:5rem;
	text-align: center;
	background-color: #ff0000;
	color: #ffffff;
	font-weight: bold;
	margin-left: 1rem;
	padding: 0 0.2rem;
}

span.jiyu{
	display: inline-block;
	min-width:5rem;
	text-align: center;
	background-color: #2179FC;
	color: #ffffff;
	font-weight: bold;
	margin-left: 1rem;
	padding: 0 0.2rem;
}






.heading{
	position: relative;
	font-size: 1.8rem;
	font-weight: bold;
	text-align: left;
	padding: 1.5rem;
	background-color: #1B2940;
}



.radio-input{
  display: none;
}
.radio-input + label{
  padding-left: 30px;
  position:relative;
  margin-right: 20px;
}
.radio-input + label::before{
  content: "";
/*  display: block;
*/  display: none;
  position: absolute;
  top: 15px;
  left: 5px;
  bottom: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  border-radius: 50%;
}
.radio-input:checked + label{
	background-color: #F9E54A;
}
.radio-input:checked + label::after{
  content: "";
/*  display: block;
*/
  display: none;
  position: absolute;
  top: 17px;
  left: 7px;
  width: 11px;
  height: 11px;
  background: #5e5e5e;
  border-radius: 50%;
}




/*===========================================*/


/*===========================================*/

/****************************
	カウントダウン
*****************************/
.timer{
	max-width: 900px;
	height: auto;
	margin: 20px auto;
	background: rgb(255, 255, 0,0.9);
	box-shadow: 0 0 20px rgb(255, 255, 161);
	padding: 20px 0;
}

#CDT {
	font-feature-settings: "palt" 1, "trad" 1;
	/* width: 100%;
	text-align: center;
	font-size: 7rem;
	font-weight: bold; */
	/* font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; */
    /* position: absolute;
    top: 75%;
    left: 50%; */
    /* transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%); */
    /* color: #ff4800; */
}

#CDT01 {
	/* width: 100%;
	text-align: center;
	font-size: 7rem;
	font-weight: bold; */
	/* font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; */
    /* position: absolute;
    top: 75%;
    left: 50%; */
    /* transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%); */
    /* color:#ff4800; */
}

#CDT02 {
	/* width: 100%;
	text-align: center;
	font-size: 7rem;
	font-weight: bold;
	color: #ffffff; */
	/* font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; */
    /* position: absolute;
    top: 75%;
    left: 50%; */
    /* transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%); */
    /* color:#ff4800; */
}

@media screen and (max-width: 480px) {
	#CDT{
		/* font-size: 4rem; */
	}

	#CDT01{
		/* font-size: 4rem; */
	}

	#CDT02{
		/* font-size: 4rem; */
	}
}






/*********************************************************
	フッター
*********************************************************/


footer {
	width: 100%;
	background-color: #000000;
	padding: 2rem 0rem;
	color: #ffffff;
}
.footer{
	background-color: #000000;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.footer ul{
	text-align: center;
	font-size: 1.2rem;
}

.footer ul li{
	display: inline-block;
	padding: 0.5rem;
	text-align: center;
	font-weight: normal;
}

.footer ul li a{
	color: #ffffff;
}


.footer .copy{
	font-size: 1.4rem;
	color: #dddddd;
	padding: 1rem 0.5rem;
	text-align: center;
}


/*=========================================*/


/*=========================================*/



.fadeinout {
    animation-name: fadeinout;
    animation-duration: 1.5s;
    animation-iteration-count:infinite;
    animation-direction:alternate;
}
@keyframes fadeinout {
    0% {
        opacity:0;
    }
    100% {
        opacity:0.4;
    }
}


@keyframes zoomin {
    0% {
        opacity:0;
        transform: scale(5, 5);
		filter: drop-shadow(0px 0px 40px rgba(255,255,255,0));
    }

    20% {
        opacity:0.5;
        transform: scale(1.4, 1.4);
    }
    100% {
        opacity:1;
        transform: scale(1.2, 1.2);
		filter: drop-shadow(0px 0px 30px rgba(255,255,255,1));
    }
}



.zoomin {
	margin: auto;
	text-align: center;
    animation-name: zoomin;
    animation-iteration-count:1;
	animation-fill-mode:forwards;
	opacity: 0;
}


@keyframes zoomin2 {
    0% {
        opacity:0;
        transform: scale(5, 5);
    }

    20% {
        opacity:0.5;
        transform: scale(1.4, 1.4);
    }
    100% {
        opacity:1;
        transform: scale(1, 1);
    }
}



.zoomin2 {
	margin: auto;
	text-align: center;
    animation-name: zoomin2;
    /* animation-duration: 1s; */
    animation-iteration-count:1;
	animation-fill-mode:forwards;
}



@keyframes zoomUp {
    0% {
        opacity:0.2;
        transform: scale(0.2, 0.2);
    }
    100% {
        opacity:1;
        transform: scale(1, 1);
    }
}

.zoomUp {
	margin: auto;
	text-align: center;
    animation-name: zoomUp;
    animation-duration: 1s;
    animation-iteration-count:1;
	animation-delay: 0.5s;
	animation-fill-mode:forwards;
}

.rotate-diagonal-1 {
	-webkit-animation: rotate-diagonal-1;
	        animation: rotate-diagonal-1;
    animation-duration: 1s;
    animation-iteration-count:1;
	animation-delay: 0.5s;
	animation-fill-mode:forwards;
}

@-webkit-keyframes rotate-diagonal-1 {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
            transform: rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, -180deg);
            transform: rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
            transform: rotate3d(1, 1, 0, -360deg);
  }
}
@keyframes rotate-diagonal-1 {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
            transform: rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, -180deg);
            transform: rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
            transform: rotate3d(1, 1, 0, -360deg);
  }
}

.flip-2-ver-left-fwd {
	margin: auto;
	text-align: center;
    animation-name: flip-2-ver-left-fwd;
    animation-iteration-count:1;
	animation-fill-mode:forwards;
}

@-webkit-keyframes flip-2-ver-left-fwd {
  0% {
    -webkit-transform: translateX(-100%) translateZ(160px) rotateY(180deg);
            transform: translateX(-100%) translateZ(160px) rotateY(180deg);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
        opacity:0;
  }

  100% {
    -webkit-transform: translateX(0) translateZ(0) rotateY(0);
            transform: translateX(0) translateZ(0) rotateY(0);
    -webkit-transform-origin: 0% 50%;
            transform-origin: 0% 50%;
        opacity:1;
  }

}
@keyframes flip-2-ver-left-fwd {
  0% {
    -webkit-transform: translateX(-100%) translateZ(160px) rotateY(180deg);
            transform: translateX(-100%) translateZ(160px) rotateY(180deg);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
        opacity:0;
    }
  100% {
    -webkit-transform: translateX(0) translateZ(0) rotateY(0);
            transform: translateX(0) translateZ(0) rotateY(0);
    -webkit-transform-origin: 0% 50%;
            transform-origin: 0% 50%;
        opacity:1;
  }

}



.flash-f {
	filter: drop-shadow(0px 0px 20px rgba(255,255,255,1));
	margin-left: auto;
	margin-right: auto;
	text-align: center;
    animation-name: flash-f;
    animation-iteration-count:infinite;    
    animation-duration: 2s;
	transition-timing-function: ease-out;
	animation-direction:alternate;
}

@keyframes flash-f {
    0% {
		filter: drop-shadow(0px 0px 40px rgba(255,255,255,1));
    }

    100% {
		filter: drop-shadow(0px 0px 5px rgba(255,255,255,1));
    }
}


.flash-y {
	filter: drop-shadow(0px 0px 10px rgb(255, 255, 0));
	margin-left: auto;
	margin-right: auto;
	text-align: center;
    animation-name: flash-y;
    animation-iteration-count:infinite;    
    animation-duration: 1s;
	transition-timing-function: ease-out;
	animation-direction:alternate;
}

@keyframes flash-y {
    0% {
		filter: drop-shadow(0px 0px 30px rgba(255, 255, 0,1));
    }

    100% {
		filter: drop-shadow(0px 0px 5px rgba(255, 255, 0,1));
    }
}


.flash-g {
	filter: drop-shadow(0px 0px 10px rgb(211, 255, 88));
	margin-left: auto;
	margin-right: auto;
	text-align: center;
    animation-name: flash-g;
    animation-iteration-count:infinite;    
    animation-duration: 2s;
	transition-timing-function: ease-out;
	animation-direction:alternate;
}

@keyframes flash-g {
    0% {
		filter: drop-shadow(0px 0px 30px rgba(200, 255, 50,1));
    }

    100% {
		filter: drop-shadow(0px 0px 5px rgba(200, 255, 50,1));
    }
}


.fuwa {
    animation-name: fuwa;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-duration: 1.5s;
}

@keyframes fuwa {
    0% {
        transform: translate(0,0px);
    }

    100% {
        transform: translate(0,-15px)
    }
}

.rotate-center {
	-webkit-animation: rotate-center 20s linear infinite both;
	        animation: rotate-center 20s linear infinite both;
}


@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);

  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);

  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

.shadow-drop-2-center {
	-webkit-animation: shadow-drop-2-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: shadow-drop-2-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes shadow-drop-2-center {
  0% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  100% {
    -webkit-transform: translateZ(50px);
            transform: translateZ(50px);
    -webkit-box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
            box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
  }
}
@keyframes shadow-drop-2-center {
  0% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  100% {
    -webkit-transform: translateZ(50px);
            transform: translateZ(50px);
    -webkit-box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
            box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
  }
}


.slide-in-elliptic-bottom-bck {
	-webkit-animation: slide-in-elliptic-bottom-bck 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-elliptic-bottom-bck 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
/* ----------------------------------------------
 * Generated by Animista on 2021-6-16 17:32:54
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-elliptic-bottom-bck
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-elliptic-bottom-bck {
  0% {
    -webkit-transform: translateY(600px) rotateX(-30deg) scale(6.5);
            transform: translateY(600px) rotateX(-30deg) scale(6.5);
    -webkit-transform-origin: 50% -100%;
            transform-origin: 50% -100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
            transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 500px;
            transform-origin: 50% 500px;
    opacity: 1;
  }
}
@keyframes slide-in-elliptic-bottom-bck {
  0% {
    -webkit-transform: translateY(600px) rotateX(-30deg) scale(6.5);
            transform: translateY(600px) rotateX(-30deg) scale(6.5);
    -webkit-transform-origin: 50% -100%;
            transform-origin: 50% -100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
            transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 500px;
            transform-origin: 50% 500px;
    opacity: 1;
  }
}

.puff-in-center {
	-webkit-animation: puff-in-center 0.7s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
	        animation: puff-in-center 0.7s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
}

@-webkit-keyframes puff-in-center {
  0% {
    -webkit-transform: scale(2);
            transform: scale(2);
    -webkit-filter: blur(4px);
            filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}
@keyframes puff-in-center {
  0% {
    -webkit-transform: scale(2);
            transform: scale(2);
    -webkit-filter: blur(4px);
            filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}


/*===========================================*/

/*===========================================*/

.balloon1-left {
  position: relative;
  display: inline-block;
  padding: 20px;
  min-width: 120px;
  max-width: 100%;
  border-radius: 1rem;
  color: #000000;
  background: #E0E0E0;
}

.balloon1-left:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -30px;
  margin-top: -15px;
  border: 15px solid transparent;
  border-right: 15px solid #E0E0E0;
}

.balloon1-left p {
  margin: 0;
  padding: 0;
}

/*===========================================*/

.area-timer{
	border-top: 0.1rem solid #dddddd;
	border-bottom: 0.1rem solid #dddddd;
	font-family: YuGothic,'游ゴシック','メイリオ','Meiryo','ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN',sans-serif;
}

.timer{
	font-size: 3rem;
}


.timer .time{
	font-size: 6rem;
	margin-left: 0.5rem;
	display: inline-block;
	width: 8rem;
	font-weight: bold;
}

.shadow-bk{
	box-shadow: 2px 2px 10px rgba(0, 0, 0,0.8);
}




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


img.img100{width: 100%;}
img.img90{width: 90%;}
img.img80{width: 80%;}
img.img70{width: 70%;}
img.img60{width: 60%;}
img.img50{width: 50%;}
img.img40{width: 40%;}
img.img30{width: 30%;}
img.img20{width: 20%;}
img.w100{width: 100%;}


.container{width: 100%;}
.main{width: 100%;}
.footer{width: 100%;}

}


@media (orientation: landscape){

/*body{
	background-image: none;
background-color: #000000;
}*/

/*body:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background:url(../../../../images/auto/mae/body.jpg) center no-repeat;
  background-size:cover;
}*/

}


/**********************************
	video
***********************************/
.video {
	position: relative;
	height: 0;
	padding: 0 0 56.25%;
	overflow: hidden;
	/* transform: translate(-50%, -50%);
	opacity: 0.5; */
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*　video
*********************************************************/
.bg-video-wrap {
	position: relative;
	width: 100%;
	height: 100%;
	background: url(../images/body1.jpg) no-repeat center center/cover;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
  }
  
  video.bg-video {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 100%;
	min-height: 100%;
	z-index: -2;

  }
  .overlay {
	width: 100%;
	height: 60rem;
	position: absolute;
	top: 0;
	left: 0;
	background-image: linear-gradient(45deg, rgba(0,0,0,.2) 50%, rgba(0,0,0,.4) 50%);
	background-size: 3px 3px;
	z-index: 2;
  }
  .video-wrap {
	text-align: center;
	color: #fff;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 3;
	width: 100%;
  }
  video.first {
	  position: fixed;
	  right: 0;
	  left: 0;
	  bottom: 0;
  
	  width: 100%;
	  height: 100vh;
	min-width: 100%;
	min-height: 100vh;
	  z-index: 0;
	  opacity: 0.7;
	  margin: 0;
	  background-color: #000000;
  }

/*========= 背景動画設定のCSS ===============*/
#video-area{
    position: absolute;/*h1の中央寄せ配置の起点とするためのrelative*/
    z-index: -1;/*最背面に設定*/
    top: 0;
    right:0;
    left:0;
    bottom:0;
    overflow: hidden;
}
#video {
    /*天地中央配置*/
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
    /* opacity:.1; */
}
.header_line{
    position: absolute;
    z-index:1;
    bottom:0;
    width:100%;
}
.header_sl_top {
	width: 100%;
	max-width:840px;
	margin: 0 auto;
	position:absolute;
	padding:1px 0;
	z-index:0;
	left: 0;
	right: 0;
	padding:0 5% 20% 5%;

/*	background: -moz-linear-gradient(left, rgba(255,250,221,0) 0%, rgba(255,252,237,0.7) 11%, rgba(255,252,237,0.7) 89%, rgba(255,252,237,0.64) 90%, rgba(255,250,221,0) 100%);	background: -webkit-linear-gradient(left, rgba(255,250,221,0) 0%,rgba(255,252,237,0.7) 11%,rgba(255,252,237,0.7) 89%,rgba(255,252,237,0.64) 90%,rgba(255,250,221,0) 100%);
	background: linear-gradient(to right, rgba(255,250,221,0) 0%,rgba(255,252,237,0.7) 11%,rgba(255,252,237,0.7) 89%,rgba(255,252,237,0.64) 90%,rgba(255,250,221,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fffadd', endColorstr='#00fffadd',GradientType=1 );*/
}

/*-------------------------------------------*/



/********************************************
	ユーザーの声table
********************************************/
table.user_voice{
	border-collapse: collapse;
	margin: 2rem auto;
	font-weight: bold;
}

table.user_voice tr{
	margin: 1rem auto;
	border: #ff007a 2px solid;
	background-color: #252525;
	color: #fff;
}

table.user_voice tr:nth-child(odd){
	background-color: #ffffff;
	color: #0c0c0c;
}

table.user_voice tr th{
	width: 25%;
}

table.user_voice tr th img{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

table.user_voice tr td{
	padding: 1rem;
}


/********************************************
	jisseki table
********************************************/
div.jisseki_bg{
	background: -webkit-linear-gradient(top left, Magenta,yellow,Cyan,Magenta);
	background: linear-gradient(to right bottom, Magenta,yellow,Cyan,Magenta);
}

table.jisseki{
	border-collapse: collapse;
	margin: 2rem auto;
	font-weight: bold;
	width: 100%;
	border: transparent solid 6px;
	text-align: center;
}

table.jisseki tr th{
	background-color: #ff007a;
	background-image: url("https://www.transparenttextures.com/patterns/diagmonds-light.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
	border: #131821 1px solid;
	padding: 0.2rem 0;
	color: white;
}

table.jisseki tr th.day{
	background-color: #000052;
	background-image: url("https://www.transparenttextures.com/patterns/cubes.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
	color: white;
	font-size: 3rem;
	padding: 0.4rem 0;
}

table.jisseki tr td{
	border: rgba(48, 48, 48, 0.3) 2px solid;
	padding: 0.2rem 0;
	background: rgba(255,255,255,0.6);
	color: #000052;
}

table.jisseki tr td.tekichu{
	color: red;
	background-color: rgb(255,255,0);
}


/********************************************
	更新ボタン
********************************************/
.btn_reload {
	margin-bottom: 20px;
}

.btn_reload a {
	margin: 0 auto;
	text-decoration: none;
	transition: .3s ease;
}

.btn_reload a:hover {
	background: #016839;
	/* transition: .3s ease; */
	cursor: pointer;
}

.btn_reload a i {
	margin-right: 0.5rem;
}



/*◆を降らせる201911*/
.star {
	animation: kirakira 12s linear , hadou2 2s linear infinite;
	/*background: linear-gradient(to right, #FFFFFF 0%, #FFFFFF 25%, #FFFFFF 50%, #FFFFFF 75%, #FFFFFF 100%) 0% center / 200% auto;
	background-clip: text;
	-webkit-background-clip: text;
	text-fill-color: transparent;
	-webkit-text-fill-color: transparent;*/
	/*color: #00e7ff;*/
	color: pink;
	display: inline-block;
	height: 1em;
	line-height: 1em;
	position: absolute;
	top: -1em;
	z-index: 1000;
	pointer-events: none;
}

@keyframes kirakira {
	0% {
		transform:translateY(0) scale(1));
	}
	100% {
		/*transform:translateY(calc(100vh + 1em)) rotateY(3600deg);*/
		transform:translateY(1000px) scale(0);
		opacity:0;
	}
}

@keyframes hadou2 {
	0% {
	text-shadow: 
	0 0 0 rgba(0, 0, 0, 0);
	}

	/*
	50% {
	  text-shadow    : 
	       5px  5px 10px rgba(255, 253, 239, 0.70),
	      -5px  5px 10px rgba(255, 253, 239, 0.70),
	       5px -5px 10px rgba(255, 253, 239, 0.70),
	      -5px -5px 10px rgba(255, 253, 239, 0.70),
	       5px  0px 10px rgba(255, 253, 239, 0.70),
	       0px  5px 10px rgba(255, 253, 239, 0.70),
	      -5px  0px 10px rgba(255, 253, 239, 0.70),
	       0px -5px 10px rgba(255, 253, 239, 0.70);
	}*/

	50% {
		text-shadow    : 
			 5px  5px 10px rgba(255, 240, 255, 0.7),
			-5px  5px 10px rgba(255, 240, 255, 0.7),
			 5px -5px 10px rgba(255, 240, 255, 0.7),
			-5px -5px 10px rgba(255, 240, 255, 0.7),
			 5px  0px 10px rgba(255, 240, 255, 0.7),
			 0px  5px 10px rgba(255, 240, 255, 0.7),
			-5px  0px 10px rgba(255, 240, 255, 0.7),
			 0px -5px 10px rgba(255, 240, 255, 0.7);
	  }

	100% {
	0 0 0 rgba(0, 0, 0, 0);
	}
}
/*◆を降らせる*/


/********************************************
	流れるコメント
********************************************/


.place1_link_com_bg{
	width:100%;
	border: 1px ridge #e7c3f7;
	height:220px;
	overflow: hidden;
	overflow-y: scroll;
	transform: translateZ(0);
	/* border-radius: 1rem; */
	/*IE(Internet Explorer)・Microsoft Edgeへの対応*/
	-ms-overflow-style: none;
	/*Firefoxへの対応*/
	scrollbar-width: none;
}

/*Google Chrome、Safariへの対応*/
.place1_link_com_bg::-webkit-scrollbar{
	display: none;
}

.place1_link_com_bg.bigss{
	width:100%;
	height:240px;
	border:3px outset goldenrod;
	background-color: rgba(255, 255, 255, 0.7);
}

.place1_link_com_bg.bigss .mx_place1_com_text{
	font-size:16px;
}

.place1_link_com_bg.bigss .mx_place1_com_name{
	font-size:12px;
}

.mx_place1_com_list{
	border-bottom:0.1rem dashed goldenrod;
	padding:10px;
	width:100%;
}

.mx_place1_com_name{
	font-size:14px;
}

.mx_place1_com_text{
	font-size:12px;
	color: #333333;
	text-align-last: left;
}


/********************************************
	omega simulation
********************************************/

.simu{}

.w1,.w2,.w3,.w4,.w5,.w6,.w7 {
	position: relative;
	display: block;
	width: 100%;
}

.horse img{
	width: 100px;
	vertical-align: middle;
}

.simu .horse{
	display: block;
	padding: 0;
	text-align: right;
	margin: auto;
    animation-duration: 2.5s;
    animation-iteration-count:infinite;
	animation-fill-mode:forwards;
	animation-direction:alternate;
	z-index: 999999;
}

.simu .line{
	position: absolute;
	right: 0;
	top:1rem;
	padding: 0.8rem 1rem 1rem 6rem;
	height: 4rem;
	font-size: 1.6rem;
	display: block;
	text-align: left;
	margin: auto;
    animation-duration: 2.5s;
    animation-iteration-count:infinite;
	animation-fill-mode:forwards;
	animation-direction:alternate;

    transform-origin :100%;
    transform: translateX(0%);
 	z-index: 0;
   opacity: 0;
}

.simu .w1 .horse{
    animation-name: w1-h;
}

.simu .w1 .line{
    animation-name: w1-l;
    background-color: #aaaaaa;
}

.simu .w2 .horse{
    animation-name: w2-h;
}
.simu .w2 .line{
    animation-name: w2-l;
    background-color: #4c4c4c;
}

.simu .w3 .horse{
    animation-name: w3-h;
}
.simu .w3 .line{
    animation-name: w3-l;
    background-color: #934738;
}
.simu .w4 .horse{
    animation-name: w4-h;
}
.simu .w4 .line{
    animation-name: w4-l;
    background-color: #385593;
}
.simu .w5 .horse{
    animation-name: w5-h;
}
.simu .w5 .line{
    animation-name: w5-l;
    background-color: #939038;
}
.simu .w6 .horse{
    animation-name: w6-h;
}
.simu .w6 .line{
    animation-name: w6-l;
    background-color: #a07c2e;
}
.simu .w7 .horse{
    animation-name: w7-h;
}
.simu .w7 .line{
    animation-name: w7-l;
    background-color: #a56fa0;
}

@keyframes w1-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-65%);}
    100% {transform: translateX(-65%);}
}

@keyframes w1-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 72%;opacity: 1;}
    100% {width: 72%;opacity: 1;}
}

@keyframes w2-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-75%);}
    100% {transform: translateX(-75%);}
}
@keyframes w2-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 82%;opacity: 1;}
    100% {width: 82%;opacity: 1;}
}

@keyframes w3-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-70%);}
    100% {transform: translateX(-70%);}
}
@keyframes w3-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 77%;opacity: 1;}
    100% {width: 77%;opacity: 1;}
}
@keyframes w4-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-68%);}
    100% {transform: translateX(-68%);}
}
@keyframes w4-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 75%;opacity: 1;}
    100% {width: 75%;opacity: 1;}
}
@keyframes w5-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-60%);}
    100% {transform: translateX(-60%);}
}
@keyframes w5-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 67%;opacity: 1;}
    100% {width: 67%;opacity: 1;}
}
@keyframes w6-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-85%);}
    100% {transform: translateX(-85%);}
}
@keyframes w6-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 93%;opacity: 1;}
    100% {width: 93%;opacity: 1;}
}
@keyframes w7-h {
    0% {transform: translateX(0%);}
    20% {transform: translateX(0%);}
    50% {transform: translateX(-50%);}
    100% {transform: translateX(-50%);}
}
@keyframes w7-l {
    0% {width: 0;opacity: 0;}
    20% {width: 0;opacity: 0;}
    50% {width: 57%;opacity: 1;}
    100% {width: 57%;opacity: 1;}
}




/****************************
	eyecatch
*****************************/


#eyecatch ul {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

#eyecatch li {
    width: 31%;
    margin-bottom: 10px;
    list-style: none;
}

#eyecatch li img {
	max-width: 100%;
    margin-bottom: 10px;
    /* box-shadow: 5px 5px 15px 0px #ccc; */
    transition: 0.3s
}

#eyecatch .content-title {
    display: inline-block;
    border: solid 2px black;
    background-color: #fff;
    font-weight: bold;
    padding: 2px 10px;
}

#eyecatch p {
    font-size: 90%;
    letter-spacing: 0.07em;
    text-align: middle;
	padding: 0 10px;
    font-weight: bold;
	font-size: 1.4rem;
}

#eyecatch img:hover {
    opacity: 0.5;
    transition: 0.2s;
}

#eyecatch .viewmore {
    margin-top: 10px;
    text-align: center;
}

#eyecatch .viewmore a {
    display: inline-block;
    border: 1px solid #484e4d;
    padding: 7px 25px 7px;
    text-decoration: none;
    transition: all 0.35x;
    color: #000;
    background-color: transparent;
    transition: 0.35s;
}

#eyecatch .viewmore a:hover {
    background-color: #000;
    color: #fff;
    transition: 0.35s;
}




/*===========================================*/

/*===========================================*/
/*===========================================

	Hit

===========================================*/
/*===========================================*/

/****************************************/
.letter{
	background: #fff;
	box-shadow: 0 0 10px rgba(0,0,0,0.3);
	width:100%;
	margin:3rem auto 0 auto;
	padding:2rem 3rem;
	transform: rotate(-.5deg);
}
.letter p{
	border-bottom:0.1rem dotted #555555;
	padding:0;
	color: rgb(19, 18, 18);
}
.main .letter p{
	border-bottom:0.1rem dotted #555555;
	padding:0;
	color: rgb(19, 18, 18);
}
/****************************************/
/****************************************/
.letter2{
	background: #efefef;
	color:#222;
	box-shadow: 0 0 10px rgba(0,0,0,0.3);
	width:90%;
	margin:3rem auto 0 auto;
	padding:2rem 3rem;
}
.main .letter2 p{
	border-bottom:0.1rem dotted #555555;
	padding:0;
}
/****************************************/


textarea.text02 {
	padding: 10px;
	font-size:2rem;
	width:100%;
	height: 120px;
	border:0.2rem double #7D342E;
	background-color: #fcfcfc;
	border-radius: 0.5rem;
	/*background-image: url("https://www.transparenttextures.com/patterns/ecailles.png");*/
}

.a-form {
	/* background:#fff1b7; */
	background:lightgoldenrodyellow;
		background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
}

#form{
	width: 90%;
	margin: 2em auto;
	text-align: left;
}


input[type="text"]{
	width:100%;
	padding:2rem 1rem;
	font-size:2.3rem;
	color:#000000;
	font-weight:bold;
	border:0.2rem double #7D342E;
	background-color: #fcfcfc;
	border-radius: 0.5rem;
}

input[type="email"]{
	width:100%;
	padding:2rem 1rem;
	font-size:2.3rem;
	color:#000000;
	font-weight:bold;
	border:0.2rem double #7D342E;
	background-color: #fcfcfc;
	border-radius: 0.5rem;
}

/*===========================================*/



.footer {
	width:100%;
	/* max-width:700px; */
	overflow: hidden;
	margin:0px auto;
	text-align: center;
	line-height:1;
}

.footer a{
	font-weight:800;
}



.footer ul.link {
	margin:auto;
	text-align:center;
}

	
.footer ul.link  li {
	list-style: none;
	display:inline-block;
	text-align: center;
	padding: 1.2rem;
}



button{
	margin: 0 auto ;
	width:100%;
	font-size:4rem;
	font-weight:bold;
	padding:3rem 1rem;
	border-radius: 7rem;
	cursor:pointer;
	color:#ffffff;
	/* border:#FDBDAE groove 0.5rem;
	background: #dd3032; */
	text-align: center;
	transition: all .5s;
}

/* button:hover{
	transform: scale(1.1,1.1); */
	/* border:transparent groove 0.5rem; */

/* button a:hover{
	opacity:1;
} */
button a:visited{
	color:#fcfcfc;
}

.button2{
	margin: 0 auto ;
	/*max-width:720px;*/
	max-width:650px;
	width:100%;
	font-size:4rem;
	font-weight:bold;
	padding:3rem 1rem;
	border-radius: 7rem;
	border:#FDBDAE groove 0.5rem;
	cursor:pointer;
	color:#ffffff;
	background: #dd3032;
	text-align: center;
	transition: all .5s;
}

.button2:hover{
	transform: scale(1.1,1.1);
	border:transparent groove 0.5rem;
}


.hittsu{
	display: inline-block;
    min-width: 5rem;
    text-align: center;
    background-color: #d82424;
    color: #fff6d7;
    font-weight: bold;
    padding: 0 5px;
    font-size: 14px;
	margin: 0.5rem 1rem 0.5rem 0;
    vertical-align:middle;
}

.nini{
	display: inline-block;
    min-width: 5rem;
    text-align: center;
    background-color: darkblue;
    color: #fff6d7;
    font-weight: bold;
    padding: 0 5px;
    margin: 0.5rem 1rem 0.5rem 0;
    font-size: 14px;
    vertical-align:middle;
}


/****************************************/

/*直近実績*/
.result_t2{
	margin:0 auto;
	/*width:100%;*/
	width: 100%;
	border-collapse:collapse;
	border: 0.3rem solid #047b03;
	text-align: center;
}
.result_t2 th{
/*background-color: #156b53;*/
background-color: #047b03;
/*background-image: url("https://www.transparenttextures.com/patterns/60-lines.png");*/
	color:#fcfcfc;
	text-align:center;
	border:0.1rem dotted #fcfcfc;
}
.result_t2 td{
	/* text-align:left; */
	padding:0 1rem;
/*background-color: #cef5ee;*/
/* background-color:#fbe3ea; */
background-color:#e3fbe8;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	border:0.2rem dotted #fcfcfc;
	font-size:1.5rem;
}
.result_t2 td.teki{
	text-align:center;
}
.result_t2 td.teki2{
	text-align:right;
	font-family: 'Noto Serif JP', sans-serif;
	font-weight:700;
	font-size:2.5rem;
	max-width:110px;
	background-color: #fcfcfc;
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	/*color:#027556;*/
	/* color: #e03931; */
	color:#237102;
}
.result_t2 td.rate{
	text-align:right;
}
.result_t2 td.hit{
	text-align:right;
	font-family: 'Noto Serif JP', sans-serif;
	font-weight:700;
	font-size:2.5rem;
	max-width:110px;
	background-color: rgb(255, 255, 0);
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	/*color:#027556;*/
	/* color: #e03931; */
	color:rgb(222,32,36);
}

/****************************/

/************オリジナル馬券***********************/

.baken_grid p{
	padding:0;
}
.baken_grid {
	display: grid; 
	grid-auto-columns: 1fr; 
	grid-template-columns: 1.5fr 1fr 1.5fr; 
	gap: 2px 0px; 
	grid-template-areas: 
		"area01 area02 area02"
		"area01 area03 area03"; 
	width:100%;
	max-width:400px;
	margin:2rem auto;
	background:#fcfcfc;
	text-align:center;
    background-image: url(../../images/a-done/baken_bg.png);
	background-size: cover;
    line-height:1.2;
    min-height:210px;
    text-align:middle;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
.area01 { grid-area: area01;text-align:left;padding:2.5rem 0 0 2rem;font-weight:700;color: #222222; }
.baken_grid .area01 p{padding-top:2rem;font-weight:700;color: #222222;}
.area02 { grid-area: area02;padding-top:3rem;font-size:2rem;margin:0 auto;color: #c2182b;font-weight:700; }
.area03 { grid-area: area03;padding:0 1rem 3rem 0;font-size:2.3rem;font-weight:700;color: #c2182b;text-align:right;letter-spacing:-2px; }
.baken_grid .tekichu{
	text-align:center;
	background: #c2182b;
	border-radius:2rem;
	color:#fcfcfc;
	font-weight:900;
	padding:0.5rem 2rem;
	margin-bottom:0.5rem;
}
.bd{border:0.1rem solid #444;padding:0.5rem;text-align:center;max-width:80px;}

.baken_grid .white_bg{
	background:rgba(255,255,255,0.8);
	border:#444 solid 0.1rem;
	padding:1rem;
}



/*横に二つ並べる*/
.baken_grid2 {
	display: grid; 
	grid-auto-columns: 1fr; 
	grid-template-columns: 1.5fr 1fr 1.5fr; 
	gap: 2px 0px; 
	grid-template-areas: 
	  "area01 area02 area02"
	  "area01 area03 area03"; 
	width:100%;
	/* max-width:350px; */
	max-width:340px;
	/*margin:2rem auto;*/
	background:#fcfcfc;
	text-align:center;
	  background-image: url(../../images/a-done/baken_bg.png);
	  background-size: cover;
	  line-height:1.2;
	  min-height:200px;
	  text-align:middle;
	  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  }

.baken_grid2 .tekichu{
	text-align:center;
	background: #c2182b;
	border-radius:2rem;
	color:#fcfcfc;
	font-weight:900;
	padding:0.5rem 2rem;
	margin-bottom:0.5rem;
}

.baken_grid2 .white_bg{
	background:rgba(255,255,255,0.8);
	border:#444 solid 0.1rem;
	padding:1rem;
}

.flex_sb{
	display: flex;
	justify-content: space-between;
}

.flex_se{
	display: flex;
	justify-content: space-evenly;
}

.flex_sbmd{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.flex_ce{
	display: flex;
	justify-content: center;
}


/**/
.baken_grid3 {
	display: grid; 
	grid-auto-columns: 1fr; 
	grid-template-columns: 1.5fr 1fr 1.5fr; 
	gap: 2px 0px; 
	grid-template-areas: 
	  "area01 area02 area02"
	  "area01 area03 area03"; 
	width:100%;
	max-width:350px;
	/*margin:2rem auto;*/
	background:#fcfcfc;
	text-align:center;
	  background-image: url(../../images/a-done/baken_bg.png);
	  background-size: cover;
	  line-height:1.2;
	  min-height:200px;
	  text-align:middle;
	  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  }

.baken_grid3 .tekichu{
	text-align:center;
	background: #c2182b;
	border-radius:2rem;
	color:#fcfcfc;
	font-weight:900;
	padding:0.5rem 2rem;
	margin-bottom:0.5rem;
}

.baken_grid3 .white_bg{
	background:rgba(255,255,255,0.8);
	border:#444 solid 0.1rem;
	padding:1rem;
}

/**/
.baken_grid4 {
	display: grid; 
	grid-auto-columns: 1fr; 
	grid-template-columns: 1.5fr 1fr 1.5fr; 
	gap: 2px 0px; 
	grid-template-areas: 
	  "area01 area02 area02"
	  "area01 area03 area03"; 
	width:100%;
	max-width:320px;
	/*margin:2rem auto;*/
	background:#fcfcfc;
	text-align:center;
	  background-image: url(../../images/a-done/baken_bg.png);
	  background-size: cover;
	  line-height:1.2;
	  min-height:200px;
	  text-align:middle;
	  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  }

.baken_grid4 .tekichu{
	text-align:center;
	background: #c2182b;
	border-radius:2rem;
	color:#fcfcfc;
	font-weight:900;
	padding:0.5rem 2rem;
	margin-bottom:0.5rem;
}

.baken_grid4 .white_bg{
	background:rgba(255,255,255,0.8);
	border:#444 solid 0.1rem;
	padding:1rem;
}

/************オリジナル馬券end***********************/

.container_fm2{
	/* background-color: #ffecb2; */
	background-color: #ffdddd;
	background-image: url("https://www.transparenttextures.com/patterns/brilliant.png");
	/* max-width:720px; */
	width:100%;
	overflow: hidden;
	margin:0 auto;
	padding:0;
	color:#222;
}


/********** 特典ゾーン *******************************************
*****************************************************************/
.bene_num{
	border-radius:4rem 4rem 0 0;
/*background-color: #ed1123;*/
background-color: #ad000e;
background-image: url("https://www.transparenttextures.com/patterns/az-subtle.png");
	padding:.5rem 1rem;
	font-size:3rem;
	color:#fcfcfc;
	text-align:center;
	width:100%;
	/* max-width:600px; */
	margin:0 auto;
}
.bene_num2{
	border-radius:4rem 4rem 0 0;
/*background-color: #098058;*/
background-color:#cf0101;
background-image: url("https://www.transparenttextures.com/patterns/az-subtle.png");
	padding:.5rem 1rem;
	font-size:3rem;
	color:#fcfcfc;
	text-align:center;
	width:100%;
	/* max-width:600px; */
	margin:0 auto;
}


.bene_wrap{
	margin:0 auto;
	border:groove #BC9300 0.4rem;
	width:100%;
	max-width:680px;
}
.bene_title{
	text-align:center;
	position:relative;
	padding:2rem 0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#edc536+0,f9edb1+21,fefcea+48,f9edb1+79,edc536+100 */
background: rgb(237,197,54); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(237,197,54,1) 0%, rgba(249,237,177,1) 21%, rgba(254,252,234,1) 48%, rgba(249,237,177,1) 79%, rgba(237,197,54,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(237,197,54,1) 0%,rgba(249,237,177,1) 21%,rgba(254,252,234,1) 48%,rgba(249,237,177,1) 79%,rgba(237,197,54,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(237,197,54,1) 0%,rgba(249,237,177,1) 21%,rgba(254,252,234,1) 48%,rgba(249,237,177,1) 79%,rgba(237,197,54,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edc536', endColorstr='#edc536',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	color:#201900;
}
.bene_title span{
    position: relative;
    z-index: 99999;
}
.bene_title .ribbon{
	position:absolute;
	top:0;
	left:0;
	max-width:15%;
}
.bene_title .ribbon2{
	position:absolute;
	bottom:0;
	right:0;
	max-width:15%;
}

.bene_con{
/*background-color: #300f03;*/
background-color: #040a2d;
background-image: url("https://www.transparenttextures.com/patterns/fake-brick.png");
	color:#fcfcfc;
}

.wt_box{
	background:rgba(255,255,255,0.8);
	width:90%;
	margin:0 auto;
}
/********** 特典ゾーン end*******************************************
*****************************************************************/

/********** 要項　*******************************************
*****************************************************************/
.guide{
	margin:0 auto;
	width:100%;
  border-image: linear-gradient(to right, #DDA242 0%, #FFE791 30%, #F7EAC3 50%, #FFE884 80%, #FFF5C9 100%);
  border-image-slice: 1;
  border:#DDA242 solid 0.3rem;
}

.guide_t{
	width:100%;
	color:#222;
}
.guide_t th{
	width:25%;
/*background-color: #fa4c0d;*/
background-color: #111111;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	color:#fcfcfc;
	padding:.5rem;
	font-size:2rem;
}
.guide_t th.title{
	padding:2rem 0;
}
.guide_t td{
	padding:1rem;
	font-size:18px;
	text-align: left;
	background-color: #fcf7e8;
	background-image: url("https://www.transparenttextures.com/patterns/greyzz.png");
}

/****************************************************************/

.guide_t2{
	width:100%;
}
.guide_t2 th{
	width:25%;
background-color: #e62922;
background-image: url("https://www.transparenttextures.com/patterns/dark-dotted-2.png");
	color:#fcfcfc;
	padding:.5rem;
	font-size:2rem;
}
.guide_t2 th.title{
	padding:2rem 0;
}
.guide_t2 td{
	padding:1rem;
	font-size:18px;
	background-color: #fcf7e8;
	background-image: url("https://www.transparenttextures.com/patterns/greyzz.png");
}


/********** 要項　end*******************************************
*****************************************************************/
/********** フォーム　*******************************************
*****************************************************************/
.main p.midashi{
	padding:1rem 0;
}

/*******************************************/
.pay_fm label {
	margin: 2px auto;
	width:40%;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	font-size: 2.4rem;
	color: #fcfcfc;
	padding: 2rem 2rem;
	border-radius: 4rem;
	display: inline-block;
	background-color: #818282;
	border: dashed 1px #cccccc;
}

.pay_fm label:hover {
	border: none;
	background: #094F37;
	border: dashed 1px;
}

.pay_fm input[type=radio] {
    width:2rem;
    height:2rem;
    margin-right:1rem;
}

.pay_fm input[type=radio]:checked+label {
	background-color: #20A073;
	border: groove 0.4rem #049B66;
	color:#fcfcfc;
}

.pay_fm .midashi{
	margin-bottom:1rem;
}

/********** フォーム　end*******************************************
*****************************************************************/
.s_box{
	padding:0rem;
	border: solid 1px;
	margin:2rem;
}

a:link.maillink{
color:#4665D7;

}

/*******************************************/
/****************************************/
.paybtn .btn{
	margin: 0 auto ;
	width:90%;
	font-size:4rem;
	font-weight:bold;
	padding:3rem 1rem;
	border-radius: 4rem;
	border: none;
	cursor:pointer;
	color:#ffffff;
/* background-color: #119e4a; */
background-color: #dd3032;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	text-align: center;
	/* border:0.5rem groove #0F8623; */
	border:0.5rem groove #8b1012;
}

.paybtn .btn:hover{
/* background-color: #0D801F; */
background-color: #ffdddd;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	border-bottom:0.5rem groove transparent;
	border-right:0.5rem groove transparent;
	border-left:0.5rem groove transparent;
	border-top:0.5rem groove transparent;
    box-shadow: rgba(0, 17, 4, 0.2) 0px 12px 14px 0px inset;
}

.apply .btn{
	margin: 0 auto ;
	width:90%;
	font-size:4rem;
	font-weight:bold;
	padding:3rem 1rem;
	border-radius: 4rem;
	border: none;
	cursor:pointer;
	color:#ffffff;
/* background-color: #119e4a; */
background-color: #dd3032;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	text-align: center;
	/* border:0.5rem groove #0F8623; */
	border:0.5rem groove #8b1012;
}

.apply .btn:hover{
/* background-color: #0D801F; */
background-color: #ffdddd;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	border-bottom:0.5rem groove transparent;
	border-right:0.5rem groove transparent;
	border-left:0.5rem groove transparent;
	border-top:0.5rem groove transparent;
    box-shadow: rgba(0, 17, 4, 0.2) 0px 12px 14px 0px inset;
}
/*******************************************/
.upsl_box{
	background-color: #e62922;
	background-image: url("https://www.transparenttextures.com/patterns/dark-dotted-2.png");
	padding:1.5rem;
	border:#F0DE90 solid 0.2rem;
	width:94%;
	margin:0 auto;
}
/**************** アニメ ****************************/

/*************サブヘッド ***************************/
/* .box{
  width: 100%;
	/*background-color: #c2182b;
	background-color: #000000f7;
	background-image: url("https://www.transparenttextures.com/patterns/dark-matter.png");
  box-sizing: border-box;
  overflow: hidden;
  box-shadow: 0 10px 20px rgb(126, 24, 30);
  border-top: 0.4rem solid #F5CC6D;
  border-bottom: 0.4rem solid #F5CC6D;
  color: white;
  padding: 1rem 2rem 2rem 2rem;
  margin-bottom:3rem;
} */


/* .box .content{
  /*border:1px solid #f0a591;
  border:1px solid #ffe297;
  background-color: #00000030;
  background-image: url("https://www.transparenttextures.com/patterns/dark-matter.png");
  padding:3rem 0;
  text-align:center;
  box-shadow: 0 5px 10px rgba(9,0,0,0.5);
  line-height:1.4;
} */

.box{
	width: 100%;
	  /* background-color: #c2182b;
	  background-color: #000000f7;
	  background-image: url("https://www.transparenttextures.com/patterns/dark-matter.png"); */
	  /* background-color: #520000;
	  opacity: 1;
	  background-image:  linear-gradient(135deg, #5f0000 25%, transparent 25%), linear-gradient(225deg, #5f0000 25%, transparent 25%), linear-gradient(45deg, #5f0000 25%, transparent 25%), linear-gradient(315deg, #5f0000 25%, #520000 25%);
	  background-position:  4px 0, 4px 0, 0 0, 0 0;
	  background-size: 4px 4px;
	  background-repeat: repeat; */
  
	  background-color: #2c2600;
	  opacity: 1;
	  background-image:  linear-gradient(135deg, #000000 25%, transparent 25%), linear-gradient(225deg, #000000 25%, transparent 25%), linear-gradient(45deg, #000000 25%, transparent 25%), linear-gradient(315deg, #000000 25%, #2c2600 25%);
	  background-position:  4px 0, 4px 0, 0 0, 0 0;
	  background-size: 4px 4px;
	  background-repeat: repeat;
  
	  /* background-image: url("../../images/a-draft/flowering_pink.jpg"); */
	  /* background: rgb(224,178,51);
	  background: linear-gradient(50deg, rgba(224,178,51,1) 0%, rgba(255,219,119,1) 20%, rgba(255,235,181,1) 48%, rgba(255,219,119,1) 85%, rgba(218,160,0,1) 100%); */
	  background-size: 100%;
  
	box-sizing: border-box;
	overflow: hidden;
	/* box-shadow: 0 10px 20px rgb(126, 24, 30); */
	box-shadow: 0 5px 15px #F5CC6D;
	border-top: 0.4rem solid #F5CC6D;
	border-bottom: 0.4rem solid #F5CC6D;
	color: white;
	padding: 2rem;
	margin-bottom:3rem;
  }
  
  .box .content{
	/*border:1px solid #f0a591;*/
	border:1px solid #ffe297;
	background-color: #000000cf;
	padding:3rem 0;
	text-align:center;
	box-shadow: 0 5px 10px rgba(9,0,0,0.5);
	line-height:1.4;
  }
  
  
  .box .sheadtop{
	padding:1rem 0.5rem;
	text-align:left;
	font-size:1.4rem;
	/*color:#FBD0C5;*/
	/* color: #ffe5b2; */
	color: #916000;
  /*  background:rgba(126,24,28,0.4);*/
  }

.sub_red {
	display: inline-block;
	background: linear-gradient(180deg, #ffcec2 0%, #c62601 72%, #a31300 100%);
	background: -webkit-linear-gradient(-90deg, #ffcec2 0%, #c62601 72%, #a31300 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.sub_blue {
	display: inline-block;
	background: linear-gradient(180deg, #d8e9ff 0%, #2a3ed8 72%, #1f194f 100%);
	background: -webkit-linear-gradient(-90deg, #d8e9ff 0%, #2a3ed8 72%, #1f194f 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-shadow: 2px 2px 2px 5px #fff;
	filter: drop-shadow(2px 1px 0px rgb(245, 247, 255));
}

  /**********************************************************/
  
  /**********************************************************/
  .box2wrap{
	  width:100%;
	  margin:2rem auto;
  }
  
  
  .box2{
	width: 100%;
	border: 0.3rem solid #DDA242;
	border-image: linear-gradient(to right, #DDA242 0%, #FFE791 30%, #F7EAC3 50%, #FFE884 80%, #FFF5C9 100%);
	border-image-slice: 1;
  -moz-box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
  -webkit-box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
  -ms-box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
  box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
	color: #271A02;
	text-shadow: 2px 2px 2px #FDF0D9, 0 0 #060400;
	padding:2rem;
  background-color: #1f0600;
  background-image: url("https://www.transparenttextures.com/patterns/brilliant.png");
  }
  
  
  .box3{
	width: 100%;
	border: 0.3rem solid #DDA242;
	border-image: linear-gradient(to right, #DDA242 0%, #FFE791 30%, #F7EAC3 50%, #FFE884 80%, #FFF5C9 100%);
	border-image-slice: 1;
  -moz-box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
  -webkit-box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
  -ms-box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
  box-shadow: 0px 0px 28px 19px rgba(240, 71, 34, 0.8);
	color: #FCF2B7;
	text-shadow: 2px 2px 2px #FF5942, 0 0 #060400;
	padding:2rem;
  background-color: #1f0600;
  background-image: url("https://www.transparenttextures.com/patterns/brilliant.png");
  }
  
  
  .box2 .content{
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#edc76f+0,ffe791+26,f7eac3+50,f7eac3+57,fbdf93+72,e0b46d+99 */
  background: #edc76f; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #edc76f 0%, #ffe791 26%, #f7eac3 50%, #f7eac3 57%, #fbdf93 72%, #e0b46d 99%); /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, #edc76f 0%,#ffe791 26%,#f7eac3 50%,#f7eac3 57%,#fbdf93 72%,#e0b46d 99%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #edc76f 0%,#ffe791 26%,#f7eac3 50%,#f7eac3 57%,#fbdf93 72%,#e0b46d 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edc76f', endColorstr='#e0b46d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  -moz-box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  -webkit-box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  -ms-box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  
	border:1px solid #FEF1C5;
	padding:4rem 0;
	text-align:center;
	line-height:1.4;
  }
  .box3 .content2{
  background-color: #f22b24;
  background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
  -moz-box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  -webkit-box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  -ms-box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  box-shadow: 0px 0px 11px 4px rgba(240, 71, 34, 0.8);
  
	border:1px solid #FEF1C5;
	padding:4rem 0;
	text-align:center;
	line-height:1.4;
  }
  
  /***************************************/
  .sheadtop2{
	padding:1rem;
	text-align:center;
	font-size:1.4rem;
	color:rgba(181,55,10,0.6);
	border-radius:1.5rem 1.5rem 0 0;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#edc76f+0,ffe791+26,f7eac3+50,f7eac3+57,fbdf93+72,e0b46d+99 */
  background: #edc76f; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #edc76f 0%, #ffe791 26%, #f7eac3 50%, #f7eac3 57%, #fbdf93 72%, #e0b46d 99%); /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, #edc76f 0%,#ffe791 26%,#f7eac3 50%,#f7eac3 57%,#fbdf93 72%,#e0b46d 99%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #edc76f 0%,#ffe791 26%,#f7eac3 50%,#f7eac3 57%,#fbdf93 72%,#e0b46d 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edc76f', endColorstr='#e0b46d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	  max-width:250px;
	  width:40%;
	  /*  background:rgba(126,24,28,0.4);*/
	  position:relative;
	  z-index:99999999999;
  }
  .sheadtop3{
	padding:1rem;
	text-align:center;
	font-size:1.4rem;
	color:rgba(255,255,255,0.6);
	border-radius:1.5rem 1.5rem 0 0;
  background-color: #f22b24;
  background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	  max-width:250px;
	  width:40%;
	  /*  background:rgba(126,24,28,0.4);*/
	  position:relative;
	  z-index:99999999999;
  }
  /**********************************************************/
  

  .bg_blue_sure{
	background-color: #3444bd;
	color: rgb(255, 255, 255);
	width: 90%;
	padding: 1.5rem 0rem;
	margin: 0 auto;
	border-radius:3px;
	text-align: center;
	
}

.bg_r_sure{
	background-color: rgb(170 0 0);
	color: rgb(255, 255, 255);
	width: 100%;
	/* padding: 3rem 0rem; */
	margin: 0 auto;
	border-radius:3px;
	text-align: center;
}

.bg_bk_sure{
	background-color: rgb(6, 0, 29);
	color: rgb(255, 255, 255);
	width: 100%;
	/* padding: 3rem 0rem; */
	margin: 0 auto;
	border-radius:3px;
	text-align: center;
}

.bd_r{
	border: 1.0rem solid rgb(170 0 0);
	/* width: 60%; */
	/* padding: 0.5rem; */
}

.bd_r2{
	border: 1.0rem solid rgb(170 0 0);
	/* width: 85%; */
	/* padding: 0.5rem; */
}

.bd_bk{
	border: 1.0rem solid rgb(6, 0, 29);
	/* width: 60%; */
	/* padding: 0.5rem; */
}

.bd_bk2{
	border: 1.0rem solid rgb(6, 0, 29);
	/* width: 85%; */
	/* padding: 0.5rem; */
}

.gold_bg2{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f7d351+0,fcf1b5+47,f7d351+100 */
	background: #f7d351; /* Old browsers */
	background: -moz-linear-gradient(-45deg, #f7d351 0%, #fcf1b5 47%, #f7d351 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg, #f7d351 0%,#fcf1b5 47%,#f7d351 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg, #f7d351 0%,#fcf1b5 47%,#f7d351 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7d351', endColorstr='#f7d351',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	/*border:#4B3E02 solid 0.5rem;*/
	padding:1.5rem;
	width:98%;
	margin:0.5rem auto;
	}

.bd_gd{
	/*border: 0.5rem solid;*/
	border: 1rem solid;
	border-image: linear-gradient(to right,#F2CC5A,#FDF5DD,#E0B025) 1;
	width: 95%;
	}


.just_hit{
	color: #fff09b;
	text-shadow: 1px 1px 10px rgb(218, 22, 22), -1px 1px 5px rgb(218, 22, 22), 1px -1px 5px rgb(218, 22, 22), -1px -1px 5px rgb(218, 22, 22), 1px 1px 5px rgb(218, 22, 22), -1px 1px 5px rgb(218, 22, 22), 1px -1px 5px rgb(218, 22, 22), -1px -1px 5px rgb(218, 22, 22);
}

  /*************サブヘッド end***************************/
  /*カウントダウン位置1
.cdt{
	top: 700px;
	bottom: 5rem;
	margin-top:auto;
	display: block;

}

.cdt_outer{
	width: 100%;
	/*height: 700px;
	height:100px;
	margin: 0 auto;
	position:relative;
	padding:1px 0;
	z-index:3;
}
*/

/*カウントダウン位置2*/
.cdt{
	top: 700px;
	bottom: 5rem;
	margin-top:auto;
	display: block;

}

.cdt_outer{
	width: 100%;
	/*height: 700px;*/
	height:150px;
	/* height:90px; */
	margin: 0 auto;
	position:relative;
	padding:1px 0;
	z-index:3;
}


.box-cdt{
	background-color:#c8368229;
	border-radius: 0.5rem;
	margin-bottom:4rem;
}

.cdt_center2{
	position: absolute;
	width: 100%;
	max-width: 880px;
	height: 190px;
	/*top: 0;*/
	top: 50;
	left: 0; /*追加*/
	right: 0; /*追加*/
	/*margin-top: auto;
	margin-bottom: auto;*/
	margin-left: auto; /*追加*/
	margin-right: auto; /*追加*/
}


.ex_box{
	margin:0 auto;
	padding:1.3rem;
	width:100%;
	border:groove 0.2rem #FDFCF8;
	background:#fcfcfc;
}
.ex_box p{
	padding:0;
}

.box_y{
	background:#F6EB71;
	padding:0.5rem;
}

.btn{
	vertical-align: middle;
}


/********************************************
*********************************************
	サービス提供
*********************************************
********************************************/

/********************************************
	ジャストヒット
********************************************/
/************* 印の表 ***********************/
.mark_t2{
	margin:0 auto;
	width:94%;
	border-collapse:collapse;
}
.mark_t2 th{
background-color: #156b53;
background-image: url("https://www.transparenttextures.com/patterns/60-lines.png");
	text-align:center;
	font-size:2rem;
	border:0.1rem dotted #fcfcfc;
	color:#fcfcfc;
}
.mark_t2 th.mark{
	width:18%;
	font-size:1.4rem;
	padding:0.5rem 2rem;
}
.mark_t2 td{
	text-align:right;
	padding:0 1rem;
background-color: #cef5ee;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	border:0.1rem dotted #B5B4B4;
	font-size:2rem;
}
.mark_t2 td.horse{
	background:#fcfcfc;
	font-size:1.8rem;
	width:35%;
}
.mark_t2 td.marking{
	text-align:center;
	font-weight:900;
	font-size: 3rem;
	line-height: 0;
}
.mark_t2 td.red{
	background-color: #ffecb2;
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
}
/************* 印の表 end***********************/
/************* 印の表 ***********************/
.mark_t3{
	margin:0 auto;
	width:94%;
	border-collapse:collapse;
}
.mark_t3 th{
/*background-color: #156b53;*/
background-color: #1d4177;
background-image: url("https://www.transparenttextures.com/patterns/60-lines.png");
	text-align:center;
	font-size:2rem;
	border:0.1rem dotted #fcfcfc;
	color:#fcfcfc;
	vertical-align: middle;
}
.mark_t3 th.mark{
	width:50%;
	padding:0;
	margin:0;
}
.mark_t3 th.mark img{
	max-width:500px;
	vertical-align:top;
}
.mark_t3 td{
	/*text-align:right;*/
	text-align:center;
	padding:0 1rem;
/*background-color: #cef5ee;*/
background-color: #d1e3ff;
background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	border:0.1rem dotted #B5B4B4;
	font-size:2rem;
}
.mark_t3 td.horse{
	background:#fcfcfc;
	font-size:1.8rem;
	width:20%;
}
.mark_t3 td.order{
	background-color: #ffecb2;
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
	width:25%;
}
.mark_t3 td.keshi{
	background-color: #d0d8e4;
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
}

.mark_t3 td.marking{
	text-align:center;
	font-weight:900;
	font-size: 3rem;
	line-height: 0;
}
.mark_t3 td.red{
	background-color: #ffecb2;
	background-image: url("https://www.transparenttextures.com/patterns/absurdity.png");
}
/************* 印の表 end***********************/

/*********************************************
	爛漫ヒット
*********************************************/
table.ranman{
	border-collapse: collapse;
	margin: 2rem auto;
	width: 100%;
	border: purple inset 4px;
	text-align: center;
	vertical-align: middle;
	background-color: #fffff7;
	background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

.ranman tr th{
	border: 1px solid #444;
	font-weight: bold;
	background-color: #feffb5;
	background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

.ranman tr th.num,th.prio{
	width: 25%;
}

.ranman tr th.hope{
	width: 50%;
}

.ranman tr td{
	border: #444 solid 1px;
	padding: 0.3rem;
}

.ranman tr td.race{
	background-color: #1c1c1c;
	background-image: url("https://www.transparenttextures.com/patterns/my-little-plaid-dark.png");
	/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
	color: #fff;
	border: none;
	padding: 0.5rem;
}




/*********************************************
	特設
*********************************************/
.wrapper-left{
	position: fixed;
	display: block;
	width: calc(100% - 60%);
	overflow: hidden;
	margin: 1rem auto 0;
	border-right: 1px solid lightgoldenrodyellow;
}

.center-logo{
	position: relative;
    width: 100%;
    height: 100vh;
}

.wrapper-right{
	display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    position: relative;
	width: 100%;
}

.wrapper-right .flex-content{
	display: block;
	width: 55%;
	margin-right: 2%;
}



.localNav {
    position: fixed;
	right: 0;
	top: 0;
    z-index: 5;
    width: 60%;
    height: 10vh;
    display: block;
	background-color: rgba(20, 20, 20, 0.75);
}

.localNav__list {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    justify-items: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    pointer-events: auto;
}

.localNav__item {
    position: relative;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	border-right: dotted 1px lightgoldenrodyellow;
}

.localNav__item a{
	font-weight: bold;
	color: #fff;
	display: block;
	width: 100%;
	text-align: center;
}

.localNav__item a:hover{
	font-weight: bold;
	color: yellow;
	border-bottom: dotted 2px yellow;
}

#g-nav{
    /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
    position:fixed;
    z-index: 999;
    /*ナビのスタート位置と形状*/
  	top:0;
    right: -120%;
  	width:60%;
    height: 100vh;/*ナビの高さ*/
  	background: rgba(0, 0, 20, 0.95);
    /*動き*/
  	transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive{
    right: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
    /*ナビゲーション天地中央揃え*/
    position: absolute;
    z-index: 999;
	top:10vh;
	left:10vh;
}

/*リストのレイアウト設定*/

#g-nav li{
  list-style: none;
    text-align: left;
}

#g-nav li a{
  color: #fff;
  text-decoration: none;
  padding:10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
}

#g-nav li a:hover{
	color: yellow;
	text-decoration: underline;
  }

/*========= ボタンのためのCSS ===============*/
/* .openbtn1{
    z-index: 9999;
  	cursor: pointer;
    width: 100%;
	color: white;
	text-align: center;
	justify-content: center;
	vertical-align: middle;
	font-weight: bold;
}

.openbtn1:hover{
	font-weight: bold;
	color: yellow;
} */
  
/*×に変化*/  
/* .openbtn1 span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
  	background-color: #666;
    width: 45%;
  }

.openbtn1 span:nth-of-type(1) {
  top:15px; 
}

.openbtn1 span:nth-of-type(2) {
  top:23px;
}

.openbtn1 span:nth-of-type(3) {
  top:31px;
}

.openbtn1.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn1.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
} */



/*********************************************
	特設2
*********************************************/
.wrapper-trick{
	max-width: 120rem;
	overflow: hidden;
	margin: 0 auto;
}

header.trick{
	position: sticky;
	height: 11rem;
	background: rgba(0, 0, 0, 0.75);
	width: 100%;
	border-bottom: silver groove 0.5rem;
	top: 0;
	z-index: 999;
}

.btn-form{
	background: #fffacb;
	position: fixed;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	right: 2rem;
	bottom: 2rem;
	z-index: 999;
}

.btn-form span{
	font-family: 'Noto Serif JP', sans-serif;
	text-align: center;
	color: goldenrod;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 1.4rem;
	font-weight: bold;
	display: inline-block;
}

.logo-kirin{
	height: 11rem;
    display: flex;
	align-items: center;
	justify-content: center;
}

.logo-kirin img{
	height: 10rem;
    display: block;
	margin: 0 auto;
}

.main-block{
	display: flex;
	width: 100%;
	margin: 2rem auto;
}

.main-block .main-block-contents-left{
	width: calc(100% - 30rem);
}

.main-block .main-block-contents-left .main-contents{
	max-width: 98%;
	margin: 0 auto;
}

.main-block .main-block-contents-right{
	width: 30rem;
}

.main-block .main-block-contents-right .pc-menu{
	width: 100%;
	margin: 0 auto;
	border: 1px solid silver;
}

.pc-menu ul{
	padding: 0.5rem;
}

.pc-menu ul li{
	background: rgba(255, 255, 255, 0.9);
	text-decoration: none;
	list-style: none;
	border-bottom: goldenrod 1px solid;
	padding: 0.5rem;
	font-size: 1.6rem;
	font-weight: bold;
	font-family: 'Noto Serif JP', sans-serif;
}

.pc-menu ul li:hover{
	background: rgba(255, 200, 200, 0.8);
}

.pc-menu ul li a{
	display: block;
	color: #a30303;
}

.sub-block .sub-grid{
	width: 98%;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 1rem;
}

.sub-block .sub-grid .sub-grid-contents{
	border: 2px silver groove;
	padding: 1rem;
	width: 100%;
	background: rgba(0, 0, 0, 0.75);
}


.play-area{
	margin: 1rem auto 0;
	width: 100%;
}

.controller {
	position: relative;
	width: 100%;
	margin: 2rem auto 0;
  }
  .controller button {
	line-height: 1.3;
	border-radius: 5rem;
	padding: 1rem 0;
  }
  .controller .num {
	width: 60%;
  }

  #roulette {
	/* top: 0%;
    left: 10%; */
	/* top: 0;
	left: 50%;
	transform: translate(-50%,0); */
	position: relative;
	-webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1.04);
			animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1.04);
	-webkit-animation-duration: 5s;
			animation-duration: 5s;
	-webkit-animation-fill-mode: forwards;
			animation-fill-mode: forwards;
	-webkit-animation-iteration-count: 1;
			animation-iteration-count: 1;
	width: 308px;
	height: 308px;
	border-radius: 50%;
	overflow: hidden;
	counter-reset: num;
	margin: 0 auto;
  }
  /* @media screen and (max-width: 1024px) { 
	#roulette {
		top: 0%;
		left: 30%;
	  }
  }
  @media screen and (max-width: 800px) { 
	#roulette {
		top: 0%;
		left: 25%;
	  }
  } */
 


  #roulette.number-1 {
	-webkit-animation-name: 'number-1';
			animation-name: 'number-1';
  }
  #roulette.number-2 {
	-webkit-animation-name: 'number-2';
			animation-name: 'number-2';
  }
  #roulette.number-3 {
	-webkit-animation-name: 'number-3';
			animation-name: 'number-3';
  }
  #roulette.number-4 {
	-webkit-animation-name: 'number-4';
			animation-name: 'number-4';
  }
  #roulette.number-5 {
	-webkit-animation-name: 'number-5';
			animation-name: 'number-5';
  }
  #roulette.number-6 {
	-webkit-animation-name: 'number-6';
			animation-name: 'number-6';
  }
  #roulette.number-7 {
	-webkit-animation-name: 'number-7';
			animation-name: 'number-7';
  }
  #roulette.number-8 {
	-webkit-animation-name: 'number-8';
			animation-name: 'number-8';
  }
  #roulette.number-9 {
	-webkit-animation-name: 'number-9';
			animation-name: 'number-9';
  }
  #roulette.number-10 {
	-webkit-animation-name: 'number-10';
			animation-name: 'number-10';
  }
  #roulette::after {
	content: "";
	display: block;
	width: 80px;
	height: 80px;
	background-color: #fff;
	border-radius: 50%;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	position: absolute;
  }
  #roulette li {
	top: 0;
	right: 0;
	left: 0;
	margin: auto;
	position: absolute;
	display: block;
	width: 100px;
	height: 154px;
	transform-origin: 50px 154px;
  }
  #roulette li::before {
	top: 0;
	left: 0;
	position: absolute;
	display: inline-block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 154px 50px;
	z-index: 0;
  }
  #roulette li::after {
	counter-increment: num;
	content: counter(num);
	z-index: 5;
	position: absolute;
	display: block;
	width: 100px;
	text-align: center;
	line-height: 40px;
	font-size: 20px;
	font-weight: bold;
  }
  #roulette li:nth-of-type(1) {
	transform: rotate(36deg);
  }
  #roulette li:nth-of-type(1)::before {
	border-color: #fff100 transparent transparent;
  }
  #roulette li:nth-of-type(2) {
	transform: rotate(72deg);
  }
  #roulette li:nth-of-type(2)::before {
	border-color: #f39800 transparent transparent;
  }
  #roulette li:nth-of-type(3) {
	transform: rotate(108deg);
  }
  #roulette li:nth-of-type(3)::before {
	border-color: #eb6100 transparent transparent;
  }
  #roulette li:nth-of-type(4) {
	transform: rotate(144deg);
  }
  #roulette li:nth-of-type(4)::before {
	border-color: #e60012 transparent transparent;
  }
  #roulette li:nth-of-type(5) {
	transform: rotate(180deg);
  }
  #roulette li:nth-of-type(5)::before {
	border-color: #e4007f transparent transparent;
  }
  #roulette li:nth-of-type(6) {
	transform: rotate(216deg);
  }
  #roulette li:nth-of-type(6)::before {
	border-color: #601986 transparent transparent;
  }
  #roulette li:nth-of-type(7) {
	transform: rotate(252deg);
  }
  #roulette li:nth-of-type(7)::before {
	border-color: #0b318f transparent transparent;
  }
  #roulette li:nth-of-type(8) {
	transform: rotate(288deg);
  }
  #roulette li:nth-of-type(8)::before {
	border-color: #036eb8 transparent transparent;
  }
  #roulette li:nth-of-type(9) {
	transform: rotate(324deg);
  }
  #roulette li:nth-of-type(9)::before {
	border-color: #00913a transparent transparent;
  }
  #roulette li:nth-of-type(10) {
	transform: rotate(360deg);
  }
  #roulette li:nth-of-type(10)::before {
	border-color: #8fc31f transparent transparent;
  }
  @-webkit-keyframes number-1 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3204deg);
	}
  }
  @keyframes number-1 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3204deg);
	}
  }
  @-webkit-keyframes number-2 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3168deg);
	}
  }
  @keyframes number-2 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3168deg);
	}
  }
  @-webkit-keyframes number-3 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3132deg);
	}
  }
  @keyframes number-3 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3132deg);
	}
  }
  @-webkit-keyframes number-4 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3096deg);
	}
  }
  @keyframes number-4 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3096deg);
	}
  }
  @-webkit-keyframes number-5 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3060deg);
	}
  }
  @keyframes number-5 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3060deg);
	}
  }
  @-webkit-keyframes number-6 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3024deg);
	}
  }
  @keyframes number-6 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(3024deg);
	}
  }
  @-webkit-keyframes number-7 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2988deg);
	}
  }
  @keyframes number-7 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2988deg);
	}
  }
  @-webkit-keyframes number-8 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2952deg);
	}
  }
  @keyframes number-8 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2952deg);
	}
  }
  @-webkit-keyframes number-9 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2916deg);
	}
  }
  @keyframes number-9 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2916deg);
	}
  }
  @-webkit-keyframes number-10 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2880deg);
	}
  }
  @keyframes number-10 {
	from {
	  transform: rotate(0);
	}
	to {
	  transform: rotate(2880deg);
	}
  }
  



.footer-toku{
	background-color: #000000;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.footer-toku ul{
	text-align: center;
	font-size: 1.6rem;
}

.footer-toku ul li{
	display: inline-block;
	padding: 0.5rem;
	text-align: center;
	font-weight: normal;
}

.footer-toku ul li a{
	color: #ffffff;
}


.footer-toku .copy{
	font-size: 1.4rem;
	color: #dddddd;
	padding: 1rem 0.5rem;
	text-align: center;
}



/*==================================================
スライダーのためのcss
===================================*/
.slider_bg{
	width: 100%;
	height: auto;
}

.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
    width:94%;
    margin:0 auto;
}

.slider img {
    width:25vw;/*スライダー内の画像を60vwにしてレスポンシブ化*/
    height:auto;
}

.slider .slick-slide {
	transform: scale(0.8);/*左右の画像のサイズを80%に*/
	transition: all .5s;/*拡大や透過のアニメーションを0.5秒で行う*/
	opacity: 0.5;/*透過50%*/
}

.slider .slick-slide.slick-center{
	transform: scale(1);/*中央の画像のサイズだけ等倍に*/
	opacity: 1;/*透過なし*/
}


/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #666;/*矢印の色*/
    border-right: 2px solid #666;/*矢印の色*/
    height: 15px;
    width: 15px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left: -1.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right: -1.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/
/********
.slick-dots {
    text-align:center;
	margin:20px 0 0 0;
}

.slick-dots li {
    display:inline-block;
	margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width: 1px;/*ドットボタンのサイズ
    height: 1px;/*ドットボタンのサイズ
    display:block;
    border-radius:50%;
    background:#ccc;/*ドットボタンの色
}

.slick-dots .slick-active button{
    background:#333;/*ドットボタンの現在地表示の色
}
****/


/*アコーディオンの設定*/
.accordion-002 {
    width: 90%;
    margin: 1rem auto 0;
    border: 2px solid #003c66;
    border-radius: 5px;
}

.accordion-002 summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 2em;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2028%2028%22%3E%0A%20%20%20%20%3Ccircle%20cx%3D%2214%22%20cy%3D%2214%22%20r%3D%2214%22%20style%3D%22fill%3A%23003c66%3B%22%2F%3E%0A%3C%2Fsvg%3E');
    background-position: right calc(2em - 7px) center;
    background-size: 22px;
    background-repeat: no-repeat;
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;
	background-color: rgba(0, 0, 60, 1);
	border-radius: 0.5rem;
}

.accordion-002 summary:hover{
	opacity: 0.8;
	background-color: rgba(0, 0, 60, 0.75);
	color: #fff;
}

.accordion-002 summary::-webkit-details-marker {
    display: none;
}

.accordion-002 summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 5px;
    height: 5px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    content: '';
    transition: transform .3s;
}

.accordion-002[open] summary::after {
    transform: rotate(225deg);
}

.accordion-002 div {
    transform: translateY(-10px);
    opacity: 1;
    margin: 0;
    padding: 1rem 1rem 1.5rem;
    color: #1c1c1c;
    transition: transform .5s, opacity .5s;
}

.accordion-002[open] div {
    transform: none;
    opacity: 1;
}


/*ふきだしの設定*/
.balloon-008 {
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
    margin-left: 15px;
    padding: 1rem;
    border: 3px solid #ecf000;
    border-radius: 5px;
    background-color: #fff;
    color: #00042c;
}

.balloon-008::before,
.balloon-008::after {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 30px;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    content: '';
}

.balloon-008::before {
    background-color: #ecf000;
}

.balloon-008::after {
    left: -11px;
    background-color: #fff;
}


/*三角レーダーチャートの設定*/
.radar-chart-001 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    max-width: 450px;
    height: 100%;
    margin: 0 auto;
    padding: 2rem;
    box-sizing: content-box;
}

.radar-chart-001 svg {
    width: 100%;
    height: 100%;
}

.radar-chart-001 dl {
    position: absolute;
    width: 100%;
    height: 100%;
}

.radar-chart-001 dl > div {
    position: absolute;
    color: #ffffff;
    text-align: center;
}

.radar-chart-001 dl > div:nth-child(1) {
    top: -15%;
    left: 50%;
    transform: translateX(-50%);
}

.radar-chart-001 dl > div:nth-child(2) {
    bottom: 20%;
    right: 0;
    transform: translateX(50%);
}

.radar-chart-001 dl > div:nth-child(3) {
    bottom: 20%;
    left: 0;
    transform: translateX(-50%);
}

.radar-chart-001 dd {
    margin: 0;
}


/*引用の設定*/
.quote-2 {
    width: 100%;
    position: relative;
    padding: 2.5em 2.5em 2em 3em;
    color: #333333;
	background-color: rgba(0, 130, 30, 0.05);
}

.quote-2::before,
.quote-2::after {
    display: inline-block;
    position: absolute;
    width: 4em;
    height: 4em;
    content: '';
}

.quote-2::before {
    top: 0;
    left: 0;
    border-top: 3px solid #00821e;
    border-left: 3px solid #00821e;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.58341 17.3211C3.55316 16.2274 3 15 3 13.0103C3 9.51086 5.45651 6.37366 9.03059 4.82318L9.92328 6.20079C6.58804 8.00539 5.93618 10.346 5.67564 11.822C6.21263 11.5443 6.91558 11.4466 7.60471 11.5105C9.40908 11.6778 10.8312 13.159 10.8312 15C10.8312 16.933 9.26416 18.5 7.33116 18.5C6.2581 18.5 5.23196 18.0095 4.58341 17.3211ZM14.5834 17.3211C13.5532 16.2274 13 15 13 13.0103C13 9.51086 15.4565 6.37366 19.0306 4.82318L19.9233 6.20079C16.588 8.00539 15.9362 10.346 15.6756 11.822C16.2126 11.5443 16.9156 11.4466 17.6047 11.5105C19.4091 11.6778 20.8312 13.159 20.8312 15C20.8312 16.933 19.2642 18.5 17.3312 18.5C16.2581 18.5 15.232 18.0095 14.5834 17.3211Z' fill='%2300821e'%3E%3C/path%3E%3C/svg%3E");
    background-position: top 35% left 35%;
    background-size: 2em;
    background-repeat: no-repeat;
}

.quote-2::after {
    bottom: 0;
    right: 0;
    border-bottom: 3px solid #00821e;
    border-right: 3px solid #00821e;
}

.quote-2 p {
    margin-top: 0;
}

.quote-2 p:last-of-type {
   margin-bottom: 0;
}

/*********************************************
	area系
*********************************************/

.area-heaven{
	background-image: url(../../images/a-bullet/sal_header_bg.png);
	background-size: cover;
	background-position: center;
}

.area-circle{
	background-image: url(../../images/a-bullet/mae_subhead_bg01.png);
	background-size: cover;
	background-position: center;
}

.area-cherry{
	background-image: url(../../images/a-bullet/up_header_bg.png);
	background-size: cover;
	background-position: center;
}

.area-navy{
	background:#001e57;
}

.area-bloom{
	background-image: url(../../images/a-cherry/mae_bg.png);
	background-size: cover;
	background-position: center;
}

.area-wa04{
	background-image: url(../../images/a-cherry/wa04.png);
	background-size: cover;
	background-position: center;
}

.area-wa05{
	background-image: url(../../images/a-cherry/wa05.png);
	background-size: cover;
	background-position: center;
}

.area-fuji{
	background-image: url(../../images/a-shiden/shiden_bg.jpg);
	background-size: cover;
	background-position: center;
}

.wrapper-miyabi{
	width: 100%;
	height: auto;
	background-image: url(../../images/a-cherry/sal_bg_btm.png);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.area-hase{
	background: linear-gradient(90deg, rgba(0,163,16,1) 50%, rgba(236,255,0,1) 100%);
	color: white;
}

.area-harvest{
	background: rgb(40,40,40);
	background: linear-gradient(135deg, rgba(40,40,40,1) 0%, rgba(31,30,0,1) 65%, rgba(191,162,26,1) 90%, rgba(255,248,102,1) 100%);
	color: white;
}

.area-starmine{
	background-image: url(../../images/a-triangle/op_bg.png);
	background-size: cover;
	background-position: center;
}

.area-nightsky{
	background-image: url(../../images/a-triangle/toku_bg.png);
	background-size: cover;
	background-position: center;
}

.area-comet01{
	background-image: url(../../images/a-triangle/mae_subhead_bg01.png);
	background-size: cover;
	background-position: center;
}

.area-comet01-2{
	background-image: url(../../images/a-triangle/mae_subhead_bg01-2.png);
	background-size: cover;
	background-position: center;
}

.area-comet02{
	background-image: url(../../images/a-triangle/mae_subhead_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-comet02-2{
	background-image: url(../../images/a-triangle/mae_subhead_bg02-2.png);
	background-size: cover;
	background-position: center;
}

.area-meteo{
	background-image: url(../../images/a-triangle/sal_bg.png);
	background-size: cover;
	background-position: center;
}

.area-iota{
	background-image: url(../../images/a-future/op_bg.png);
	background-size: cover;
	background-position: center;
}

.area-lambda{
	background-image: url(../../images/a-future/mae_bg.png);
	background-size: cover;
	background-position: center;
}

.area-nu{
	background-image: url(../../images/a-future/sal_bg.png);
	background-size: cover;
	background-position: center;
}

.area-future{
	background-image: url(../../images/a-future/sal_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-cont{
	background-image: url(../../images/a-just4/sal_bg.png);
	background-size: cover;
	background-position: center;
}

.area-grass{
	background-image: url(../../images/a-harvest/op_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-water{
	background-image: url(../../images/a-harvest/mae_bg.png);
	background-size: cover;
	background-position: center;
}

.area-blaze{
	background-image: url(../../images/a-harvest/sal_bg.png);
	background-size: cover;
	background-position: center;
}

.area-wa06{
	background-image: url(../../images/a-harvest/sal_sunbg01.png);
	background-size: cover;
	background-position: center;
}

.area-wa07{
	background-image: url(../../images/a-harvest/sal_sunbg02.png);
	background-size: cover;
	background-position: center;
}

.area-wa08{
	background-image: url(../../images/a-harvest/sal_sunbg03.png);
	background-size: cover;
	background-position: center;
}

.area-wa09{
	background-image: url(../../images/a-harvest/sal_sunbg04.png);
	background-size: cover;
	background-position: center;
}

.area-wa10{
	background-image: url(../../images/a-harvest/sal_sunbg05.png);
	background-size: cover;
	background-position: center;
}

.area-dragon{
	background-image: url(../../images/a-harvest/apple_bg.png);
	background-size: cover;
	background-position: center;
}

.area-fairy{
	background-image: url(../../images/a-harvest/oi_bg.png);
	background-size: cover;
	background-position: center;
}

.area-heart{
	background-image: url(../../images/a-trick/op_bg01_r.png);
	background-size: cover;
	background-position: center;
}

.area-spade{
	background-image: url(../../images/a-trick/op_bg01_bk.png);
	background-size: cover;
	background-position: center;
}

.area-joker01{
	background-image: url(../../images/a-trick/toku_bg01.png);
	background-size: cover;
	background-position: center;
}

.area-joker02{
	background-image: url(../../images/a-trick/toku_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-king01{
	background-image: url(../../images/a-trick/sal_bg01.png);
	background-size: cover;
	background-position: center;
}

.area-king02{
	background-image: url(../../images/a-trick/sal_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-king03{
	background-image: url(../../images/a-trick/sal_bg03.png);
	background-size: cover;
	background-position: center;
}

.area-start{
	background-image: url(../../images/a-dragon/op_bg.png);
	background-size: cover;
	background-position: center;
}

.area-hop{
	background-image: url(../../images/a-dragon/mae_bg.png);
	background-size: cover;
	background-position: center;
}

.area-dk_gra{
	background-image: url(../../images/a-dragon/dk_gra.png);
	background-size: cover;
	background-position: center;
}

.area-jump01{
	background-image: url(../../images/a-dragon/sal_bg.png);
	background-size: cover;
	background-position: center;
}

.area-jump02{
	background-image: url(../../images/a-dragon/sal_bg.png);
	background-size: cover;
	background-position: center;
}

.area-paper{
	background-image: url(../../images/a-dragon/bg_paper.jpeg);
	background-size: cover;
	background-position: center;
}

.area-temps{
	background-image: url(../../images/a-arrow/sal_bg.png);
	background-size: cover;
	background-position: center;
}




/******* 恵須川 *********/
.area-bmanb{
	background-color: #000000;
	background-image: url("https://www.transparenttextures.com/patterns/black-mamba.png");
}

.area-spg1{
	background-image: url(../../../../image/member/project_s/escw_spg1/mae_bg.png);
	background-size: cover;
	background-position: center;
}

.area-winners{
	background-image: url(../../../../image/member/project_s/escw_spg1/sal_bg.png);
	background-size: cover;
	background-position: center;
}

/******* 10億 *********/
.area-big3summer{
	background: linear-gradient(135deg, rgba(0,220,245,1) 70%, rgba(255,255,0,1) 100%);
}

.area-metal-s {
    background-color: #808080;
    background-image: url(https://www.transparenttextures.com/patterns/carbon-fibre.png);
}


/******* 田中 *********/
.area-legende{
	background-image: url(../../../../image/member/project_s/nx_revolution/sal_bg.png);
	background-size: cover;
	background-position: center;
}


/******* gk-fan *********/
.area-kaku{
	background-image: url(../../../../images/project/a-awake/brain/sal_sub_bg01.png);
	background-size: cover;
	background-position: center;
}

.area-sei{
	background-image: url(../../../../images/project/a-awake/brain/sal_sub_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-brain-d{
	background-image: url(../../../../images/project/a-awake/brain/sal_bg01.png);
	background-size: cover;
	background-position: center;
}

.area-brain-b{
	background-image: url(../../../../images/project/a-awake/brain/sal_bg02.png);
	background-size: cover;
	background-position: center;
}

.area-heaven-gk{
	background-image: url(../../../../images/project/a-awake/brain/sal_header_bg.png);
	background-size: cover;
	background-position: center;
}

.area-soku{
	background-image: url(../../../../images/project/a-awake/brain/soku_bg01.png);
	background-size: cover;
	background-position: center;
}

.wrapper-brain{
	width: 100%;
	height: auto;
	background-image: url(../../../../images/project/a-awake/brain/sal_bg02.png);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.wrapper-soku{
	width: 100%;
	height: auto;
	background-image: url(../../../../images/project/a-awake/brain/soku_bg01.png);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.ls20{
	letter-spacing: -20px;
}

.radar-chart-002 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 230px;
    height: 230px;
    margin: 0 auto;
    padding: 35px;
    box-sizing: content-box;
}

.radar-chart-002 svg {
    width: 100%;
    height: 100%;
}

.radar-chart-002 dl {
    position: absolute;
    width: 100%;
    height: 100%;
}

.radar-chart-002 dl > div {
    position: absolute;
    color: #777;
    font-size: .6em;
    text-align: center;
}

.radar-chart-002 dl > div:nth-child(1) {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

.radar-chart-002 dl > div:nth-child(2) {
    top: 31%;
    right: 0%;
    transform: translateX(50%);
}

.radar-chart-002 dl > div:nth-child(3) {
    bottom: 6%;
    right: 25%;
    transform: translateX(50%);
}

.radar-chart-002 dl > div:nth-child(4) {
    bottom: 6%;
    left: 25%;
    transform: translateX(-50%);
}

.radar-chart-002 dl > div:nth-child(5) {
    top: 31%;
    left: 7%;
    transform: translateX(-50%);
}

.radar-chart-002 dd {
    margin: 0;
}


/******* gk-fan *********/

.fusen-002 {
    display: inline-block;
    position: relative;
    padding: 1rem 3rem;
    border-right: 27px solid #2589d0;
    background-color: lightgoldenrodyellow;
    color: #333333;
	margin: 1rem;
}

.fusen-002::before {
    position: absolute;
    bottom: 2px;
    right: -20px;
    z-index: -1;
    transform: rotate(5deg);
    width: 100%;
    height: 50%;
    background-color: #d0d0d0;
    content: "";
    filter: blur(4px);
}

.balloon-005 {
    display: flex;
    justify-content: center;
    position: relative;
    max-width: 400px;
    margin-bottom: 15px;
    padding: .6em 0.8em;
    border: 3px solid #0074e0;
    border-radius: 5px;
	background-color:rgba(0,21,187,0.2);
    color: yellow;
	font-size:35px;
	margin:0 auto;
}

.balloon-005::before,
.balloon-005::after {
    position: absolute;
    bottom: -15px;
    width: 30px;
    height: 15px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.balloon-005::before {
    background-color: #0074e0;
}

.balloon-005::after {
    bottom: -14px;
	background-color:rgba(0,21,187,0.2);
}

.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #eb6100;
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}


/*********************************
	企画コメントアイフレーム
*********************************/
/* .ifr_com_bg1{
	border: none;
	width: 100%;
	height: auto;
	margin: 2rem auto 1rem auto;
	display: block;
} */
.ifr_area {
	position: relative;
	padding-bottom: 152.56%;
	height: 0;
	overflow: hidden;
	overflow-y: scroll;
}
.ifr_area::-webkit-scrollbar{
	display: none;
}
.ifr_area iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ifr_area iframe::-webkit-scrollbar{
	display: none;
}
/* .ifr_com_bg1 span{
	display: inline-block;
	width: 0px;
	overflow: hidden;
	line-height: 0;
} */

/* .btn,
a.btn,
button.btn {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #eb6100;
}

.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
} */

/*-------------------------------------------*/

.contact_bg table{
	width:90%;
	margin:0 auto;
	font-size:14px;
	border-collapse: collapse;
}

.contact_bg table th{
	background:#EEEEEE;
	border:1px solid #DDDDDD;
	padding:5px;
}

.contact_bg table td{
	background:#FFFFFF;
	border:1px solid #DDDDDD;
	padding:5px;
}
/*-------------------------------------------*/
/*-------------------------------------------*/
/*-------------------------------------------
	田中
-------------------------------------------*/

.info_bg{
	width:100%;
	margin:0 auto;
	border-collapse: collapse;
	table-layout: fixed;
}



.info_bg th{
	width:200px;
	font-size:16px;
	background:#444444;
	color:#FFFFFF;
	border:1px solid #999999;
	vertical-align:top;
	padding:20px 10px;
	letter-spacing:0;
	text-align: left;
}

.info_bg th .fs12.bold1{
	display:block;
	margin-bottom:0;
}

.info_bg td{
	min-width:50px;
	background:#191919;
	border:1px solid #999999;
	font-size:16px;
	padding:2rem;
	vertical-align: top;
	color:#ffffff;
}

.info_bg td p.center{
	text-align:center;
}
.info_bg td p.tm10{margin:10px 0;}
.info_bg td p.tm20{margin:20px 0;}


a.sv_janp_bt {
	background: url("../../../../image/member/project_s/nx_huth_all/b2.png") no-repeat center right 10px , rgb(254,254,254); /* Old browsers */
	background: url("../../../../image/member/project_s/nx_huth_all/b2.png") no-repeat center right 10px , -moz-linear-gradient(top,  rgba(254,254,254,1) 0%, rgba(219,219,219,1) 86%, rgba(226,226,226,1) 100%); /* FF3.6-15 */
	background: url("../../../../image/member/project_s/nx_huth_all/b2.png") no-repeat center right 10px , -webkit-linear-gradient(top,  rgba(254,254,254,1) 0%,rgba(219,219,219,1) 86%,rgba(226,226,226,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: url("../../../../image/member/project_s/nx_huth_all/b2.png") no-repeat center right 10px , linear-gradient(to bottom,  rgba(254,254,254,1) 0%,rgba(219,219,219,1) 86%,rgba(226,226,226,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	line-height: 1;
	color: #000000;
	border: 1px solid #999999;
	border-collapse:collapse;
	text-decoration:none;
	display:inline-block;
	padding: 20px 0;
	margin: 0 auto;
	border-radius:50px;
	box-sizing: border-box;
	width:90%;
	cursor:pointer;
}

a.sv_janp_bt:hover {
	background: url("../../../../image/member/project_s/nx_huth_all/b2.png") no-repeat center right 10px , rgb(254,254,254);
	text-decoration:underline;
}

.input_bg{
	width:90%;
	margin:0 auto;
	border-collapse: collapse;
	margin:0 auto 20px;
	padding-top: 0;
}



.b-box{
	background: #000000;
	padding: 0.3em 0.2em 0.2em 0.2em;
	display:inline-block;
	line-height:1;
	margin: 0.1em 0.3em 0.1em 0;
	color: #FFFFFF;
}

.youkou_bg {
    background: #012a10;
    width: 100%;
    margin: 25px auto 50px auto;
    padding: 2rem;
    color: #ffffff;
}

.youkou {
	background:#FFFFFF;
	width: auto;
	margin: 10px;
	padding: 1px 1px 20px 1px;
	border: 1px solid #cccccc;
}


.fild{
	width:100%;
	font-size:18px;
	padding:10px 2% 10px 2%;
	margin:0 auto 0;
	background: #e3dec6;
}

.fild2{
	width:100%;
	height:200px;
	font-size:18px;
	padding:0 auto;
	margin:10px auto 0;
}

.koumoku {
display: block;
    line-height: 1.2;
    font-size: 20px;
    letter-spacing: 0;
    /* background: #2d1a00; */
    padding: 0.5rem;
}

.button_bg{
	margin:auto;
}

.applicationButton_legende {
	width: 90%;
	height: 0;
	padding-bottom:27.777%;
	text-indent: -9999px;
	background: url(../../../../image/member/project_s/nx_revolution/button_legende.png) left top / 100% 100% no-repeat;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	cursor:pointer;
	border: none;
	margin: 0 20px 0 20px;
	text-align: center;
	display:block;
	margin:0 auto;
	border-radius:10px;
}

.applicationButton_legende:hover {
	opacity:0.7;
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
}




.res_flex_bg{
	display:flex;
	flex-wrap: wrap;
	width: 50%;
	margin: 0 auto;
}

.res_flex_bg_n{
	display:flex;
	flex-wrap: wrap;
	width: 50%;
	margin: 0 auto;
	justify-content: center;
	gap: 1rem;
}

.res_flex_bg2{
	display:flex;
	background:#ffc470;
	border: 2px solid #ff6700;
	padding: 20px 10px 10px 20px;
	position: relative;
	border-radius: 6px;
	box-shadow: 0 -2px 6px 3px rgba(0,0,0,0.1) inset, 0 2px 8px 1px rgba(0,0,0,0.3);
	color: #2a1001;
	margin:20px auto 0;
	font-family: 'M PLUS 1p', sans-serif;
}

.res_flex_text{
	width:400px;
	margin-right:20px;
}



.res_flex_list{
	position:relative;
	background:url("../../../../image/member/project_s/nx_huth_all/baken.jpg") center center no-repeat;
	display: flex;
	align-items: center;
	padding: 10px 10px;
	margin: 0 1.5% 1.5% 0;
	border-radius: 2px;
	width: 95%;
	min-height: 121px;
	color: #333;
	background-size: cover;
}

.res_flex_list_n{
	position:relative;
	background:url("../../../../image/member/project_s/nx_huth_all/baken.jpg") center center no-repeat;
	display: flex;
	align-items: center;
	padding: 10px 10px;
	margin: 0 1.5% 1.5% 0;
	border-radius: 2px;
	width: 45%;
	min-height: 121px;
	color: #333;
	background-size: cover;
}

.spbg {
	background: url("../../../../image/member/question/w_memory/bakenbg_new.png") center center repeat #FFF;
	  background-size: auto;
	background-size: auto;
	background-size: cover;
  }

  .res_flex_bg2 .res_flex_list{
	width:225px;
}


.res_flex_list:nth-child(3n){
}

.bakenlogo{
	position: absolute;
	right: 5px;
	top: 5px;
	z-index:1;
}

.bakenlogo img{
	width:25px;
}

.bakentekichu{
	position: absolute;
	right:10px;
	margin:0;
	opacity:0.5;
	z-index:1;
}

.bakentekichu img{
	width:100px;
}

.res_flex_list_test1 {
	font-size: 16px;
	font-weight: bold;
	margin-right: 5px;
	width: 100px;
	position: relative;
	z-index: 2;
  }

.res_flex_list_test2 {
	width: 35px;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.2;
	border: 1px solid #000;
	  border-top-width: 1px;
	  border-top-style: solid;
	  border-top-color: rgb(0, 0, 0);
	  border-bottom-width: 1px;
	  border-bottom-style: solid;
	  border-bottom-color: rgb(0, 0, 0);
	border-top: 20px solid #000;
	border-bottom: 20px solid #000;
	padding: 5px 2px;
	text-align: center;
	margin-right: 2.5px;
	margin-top:10px;
	margin-bottom:10px;
	position: relative;
	z-index: 2;
	background: rgba(255, 255, 255, 0.5);
	background: #FFF;
  }

.res_flex_list_test3{
	font-size:14px;
	font-weight:bold;
	text-align:right;
	flex-grow: 1;
	position:relative;
	z-index:2;
}

.tensu{
	text-align:left;
}

.kakutoki span {
	font-size:17px;
	letter-spacing:-0.05em;
	color:red;
}

.kakutoki+p {
    text-align: right;

}



.res_flex_bg.kotei{
	display:block;
	font-family:  "メイリオ", "ヒラギノ角ゴ Pro W3", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif Arial;
}

.res_flex_bg.kotei .res_flex_list{
	width:300px;
	background:
	url(../../../../image/member/project_s/nx_huth_all/line1_yoko.png) center top / auto 5px repeat-x ,
	url(../../../../image/member/project_s/nx_huth_all/line1_yoko.png) center bottom / auto 5px repeat-x ,
	url(../../../../image/member/project_s/nx_huth_all/line1_tate.png) center left / 5px auto repeat-y ,
	url(../../../../image/member/project_s/nx_huth_all/line1_tate.png) center right / 5px auto repeat-y ,
	url("../../../../image/member/project_s/nx_huth_all/baken.jpg") center center no-repeat;
	padding: 34px 20px;
	box-shadow: 0 2px 6px 1px rgba(0,0,0,0.4);
	margin:10px;
	min-height:175px;
}

.res_flex_bg.kotei .res_flex_list .res_flex_list_test1{
	font-size:18px;
	width:74px;
}

.res_flex_bg.kotei .res_flex_list .res_flex_list_test2{
	font-size:18px;
	padding-top:20px;
	padding-bottom:20px;
}

.res_flex_bg.kotei .res_flex_list .res_flex_list_test3{
	font-size:18px;
	line-height:1.4;
}

.res_flex_bg.kotei .res_flex_list .res_flex_list_test3 .kakutoki span{
	font-size:24px;
	color:#E52020;
}

.res_flex_bg.kotei .res_flex_list .bakentekichu{
	right: 40px;
	opacity: 0.4;
}

.res_flex_bg.kotei .res_flex_list .bakenlogo{
	right: 10px;
	top: 10px;
}

.kotei_flex{
	display:flex;
	align-items: center;
	background:#FBD10A;
	margin-bottom:20px;
	border-radius:5px;
	
}

.res_flex_list2{
	text-align:center;
	flex-grow: 1;
}

.res_flex_list2 .reviews{
	width:auto;
	height:150px;
}




/*-------------------------------------------*/
/*-------------------------------------------
	うまとみ
-------------------------------------------*/
#footer{
	width: 100%;
	margin: 0px auto 0 auto;
	color: #ffffff;
	font-size: 13px;
	letter-spacing: 5px;
	padding-top:20px;
	padding-bottom:40px;
	background:#000000;
	background:url(../../../../image/member/project_s/ex_kaiseki_all/gold.gif) #000 top center repeat-x;
	/* box-shadow: 0 0 3px 2px #f40808, 0 0 20px 1px #ff0000; */
	position:relative;
	z-index:1100;
}

.top a{
	width:120px;
	margin:10px 20px 10px 20px;
	color:#ffffff;
	text-align:center;
}

.top a:hover{
	width:120px;
	color:#ff4500;
	text-align:center;
}

.form_every {
    width: 100%;
    padding: 2rem;
    background: #001323;
    border: groove 5px #9c7600;
}

.tg4th_iframe {
    position: relative;
    padding-bottom: 56.25%;
    height: 660px;
    overflow: hidden;
}

.iframe_container {
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.tg4th_iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/*-------------------------------------------*/



/*--------10億フッター------------*/
footer{
	background: #032739;
	border-top: 1px solid #fff;
	padding: 2rem 0.75rem 1rem;
	margin-top: 3rem;
}
footer ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.75em;
	list-style: none;
	margin-bottom: 1rem;
	padding: 3px;
}
.copy{
	text-align: center;
}
footer a{
	color: white;
}
footer>p{
	color: gray;
}

.footer > a{
	font-size: 1.4rem;
}

@media (max-width: 450px) {
	footer {
		font-size: 1.2rem;
	}
}
/*--------フッター_end------------*/

:root {
  /* 右下の余白と GIF 幅を 1 行でレスポンシブ化 */
  --gap: clamp(1rem, 3vw, 2rem);
  --gif-size: clamp(140px, 28vw, 320px);
}

/* ---------------- ファーストビュー ---------------- */


/* ===== Empathy Section Styles ===== */
.empathy-section {
	background: url(../../../../images/mediatest/1.png) no-repeat top center;
		background-size: cover;

}
.empathy-section2 {
	background: url(../../../../images/mediatest/kna.png) no-repeat top center;
		background-size: cover;

}
.empathy-section3 {
	background: url(../../../../images/mediatest/2.png) no-repeat top center;
		background-size: cover;

}

.empathy-section4 {
	background: url(../../../../images/mediatest/crack_texture.png) no-repeat top center;
		background-size: cover;

}

.empathy-section5 {
	background: url(../../../../images/mediatest/3.png) no-repeat top center;
		background-size: cover;

}

.empathy-section6 {
	background: url(../../../../images/mediatest/4.png) no-repeat top center;
		background-size: cover;

}
.empathy-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 16px;
}

.empathy-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr; /* PC：テキスト＋画像の2カラム */
  gap: 32px;
  align-items: center;
}

.empathy-col--text {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.empathy-title {
  margin: 0;
  padding: 8px 0 8px 12px;
  font-weight: 700;
}

.empathy-lead {
  margin: 0;
}

.empathy-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 8px 0 0 0;
}

.empathy-item {
  margin: 0;
  padding: 12px 16px;
  background-color: #ffffff; /* 白背景BOX */
  border: 1px solid #d8dde3;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  position: relative;
}

.empathy-item::before {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
  color: #3a78d1;
}

.empathy-solution {
  margin: 16px 0 0 0;
  font-weight: 700;
}

.empathy-col--image {
  width: 100%;
}

.empathy-figure {
  display: block;
  width: 100%;
  border-radius: 8px;
  background-color: #e9ecef;
  outline: 1px dashed #cfd6dd;
}

/* ===== Responsive ===== */
@media (max-width: 960px) {
  .empathy-grid {
    grid-template-columns: 1fr; /* SP：1カラム */
  }
  .line-btn {
	  width: 80%;

  }
}

.line-btn {
  --line-green: #06C755;
  --line-green-dark: #059e45;

  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  min-height: 56px;                 /* タップ面積をしっかり確保 */
  background:
    linear-gradient(180deg, #07da62 0%, var(--line-green) 38%, #04b84f 100%);
  color: #fff;
  font-size: 2.5rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-decoration: none;
  border-radius: 14px;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;

  /* 立体感（床影＋縁の段差） */
  box-shadow:
    0 8px 0 var(--line-green-dark),
    0 10px 18px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.2);

  transition: transform .08s ease, box-shadow .08s ease, filter .12s ease;
}

/* グロス（上部の光沢） */
.line-btn::before {
  content: "";
  position: absolute;
  inset: 2px 2px auto 2px;
  height: 38%;
  border-radius: 12px 12px 10px 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,0));
  pointer-events: none;
}

.line-btn--block { width: 100%; }

/* 押下フィードバック（沈む＆影が薄くなる） */
.line-btn:active {
  transform: translateY(4px);
  box-shadow:
    0 4px 0 var(--line-green-dark),
    0 6px 12px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(0,0,0,.06);
  filter: brightness(.98);
}

/* キーボード操作・スクリーンリーダー配慮 */
.line-btn:focus-visible {
  outline: 3px solid #b1f5cd;
  outline-offset: 2px;
}

/* アイコン（白地にLINE吹き出し） */
.line-btn__icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #fff;
  color: var(--line-green);
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.06),
    0 1px 2px rgba(0,0,0,.12);
}

.line-btn__icon .icon-svg {
  width: 22px;
  height: 22px;
}

/* テキスト */
.line-btn__text {
  flex: 1 1 auto;
  line-height: 1;
}

/* 進む矢印（“>”の視覚） */
.line-btn__chevron {
  flex: none;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  opacity: .96;
  transition: transform .08s ease;
}

.line-btn:active .line-btn__chevron {
  transform: translateX(1px); /* 押した瞬間ちょっとだけ前進 */
}

.line-btn .chevron-svg {
  width: 16px;
  height: 16px;
}

/* 低モーション設定に配慮 */
@media (prefers-reduced-motion: reduce) {
  .line-btn,
  .line-btn__chevron {
    transition: none;
  }
}

.testimonials-section {
  background-color: #eef6ff; /* 淡いブルー背景 */
}

.testimonials-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 16px;
}

.testimonials-title {
  margin: 0 0 16px 0;
  font-weight: 700;
  text-align: center;
}

.testimonials-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.testimonial-card {
  background-color: #ffffff;
  border: 1px solid #d8dde3;
  border-radius: 8px;
  padding: 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.testimonial-meta {
  margin: 0 0 8px 0;
  font-weight: 700;
}

.testimonial-quote {
  position: relative;
  margin: 0;
}

.testimonial-quote::before {
  position: absolute;
  left: 0;
  top: 0;
}

/* PCレイアウト：幅に応じて2〜3カラム */
@media (min-width: 768px) {
  .testimonials-grid {
    grid-template-columns: 1fr 1fr; /* 2カラム */
  }
}
@media (min-width: 1200px) {
  .testimonials-grid {
    grid-template-columns: 1fr 1fr 1fr; /* 3カラム */
  }
}

/* ===== Solution (解決パート) ===== */
.solution-section {
  background-color: #ffffff;
}

.solution-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 16px;
}

.solution-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr; /* 左テキスト／右イメージ */
  gap: 32px;
  align-items: center;
}

.solution-col--text {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.solution-title {
  margin: 0;
  font-weight: 700;
  border-left: 4px solid green;
  padding-left: 12px;
}

.solution-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 8px 0 0 0;
}

.solution-item {
  position: relative;
  margin: 0;
  padding-left: 28px;
  background-color: #f7f9fb;
  border: 1px solid #e1e6eb;
  border-radius: 6px;
  padding: 12px 16px 12px 36px;
}

.solution-item::before {
  content: "✓";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: 700;
  color: yellowgreen;
}

.solution-note {
  margin: 8px 0 0 0;
  color: #31445b;
  background-color: #f4f6f8;
  border: 1px solid #e1e6eb;
  border-radius: 6px;
  padding: 12px 16px;
}

.solution-col--image {
  width: 100%;
}

.solution-figure {
  display: block;
  width: 100%;
  border-radius: 10px;
  background-color: #e9ecef; /* 画像未準備の仮背景 */
  outline: 1px dashed #cfd6dd;
}
.solution-figure,img{
	width: 80%;
}

/* SP：1カラム縦積み */
@media (max-width: 960px) {
  .solution-grid {
    grid-template-columns: 1fr;
  }
}
.flow-section {
  background-color: #eef6ff; /* 淡いブルー背景 */
}

.flow-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 16px 24px 16px;
}

.flow-title {
  margin: 0 0 16px 0;
  text-align: center;
  font-weight: 700;
}

.flow-note {
  margin: 0 0 16px 0;
  text-align: center;
}

.flow-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 0 0 24px 0;
}

.flow-card {
  background-color: #ffffff;
  border: 1px solid #d8dde3;
  border-radius: 10px;
  padding: 20px 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  position: relative;
}

.flow-step {
  margin: 0 0 20px 0;
  font-weight: 700;
  background-color: #0036cc;
  color: white;
}


.flow-text {
  margin: 0;
}

/* PCは3カラム */
@media (min-width: 960px) {
  .flow-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

/* ===== Reuse: LINE Button (CTA) ===== */
.flow-cta {
  text-align: center;
  margin: 8px 0 32px 0;
}

.line-btn-wrap {
  text-align: center;
  margin: 0;
}

.line-btn {
  display: inline-block;
  background-color: #06c755; /* LINE公式カラー */
  color: #ffffff;
  text-decoration: none;
  padding: 16px 32px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  font-weight: 700;
  box-shadow: 0 3px 6px rgba(0,0,0,0.15);
  transition: background-color 0.3s, transform 0.2s;
}

.line-btn:hover { background-color: #05a947; transform: translateY(-2px); }
.line-btn:active { transform: translateY(0); }

/* ===== Trust (信頼補強) ===== */
.trust-section {
  background-color: #ffffff;
}

.trust-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 16px;
}

.trust-title {
  margin: 0 0 16px 0;
  text-align: center;
  font-weight: 700;
}

.trust-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.trust-item {
  position: relative;
  margin: 0;
  padding: 16px 16px 16px 16px;
  background-color: #f7f9fb;
  border: 1px solid #e1e6eb;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}



/* PCは3カラム */
@media (min-width: 960px) {
  .trust-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

/* ===== Closing CTA ===== */
.closing-section {
  background-color: #233a66; /* 濃いブルー */
}

.closing-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 16px;
  text-align: center;
}

.closing-copy {
  margin: 0 0 12px 0;
  font-weight: 700;
}

.closing-subcopy {
  margin: 0 0 24px 0;
}

.aging-section {
  /* background-color: #fff4f2; */
  /* border-top: 4px solid #e44d4d; */
  /* border-bottom: 4px solid #e44d4d; */
}

.aging-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 56px 16px;
  text-align: center;
}

.aging-title {
  margin: 0 0 12px 0;
  font-weight: 700;
  color: #e44d4d;
}

.aging-subtitle {
  font-weight: 700;
}

.aging-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 auto;
  max-width: 720px;
}

.aging-item {
  margin: 0;
  padding: 16px 20px;
  background-color: #ffffff;
  border-left: 6px solid #e44d4d;
  border-radius: 6px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.08);
  text-align: left;
  position: relative;
}

.aging-item::before {
  position: absolute;
  left: -32px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  color: #e44d4d;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .aging-container { padding: 40px 14px; }
  .aging-item { padding: 14px 16px; }
  .aging-item::before { left: -24px; font-size: 16px; }
}




:root{
--bg-deep:#16392f; /* 左パネルの深緑 */
--ink:#0b1f1a; /* テキスト濃色 */
--muted:#6b7f79; /* サブテキスト */
--chip:#0d2231; /* ラベル背景 */
--chip-ink:#cce7ff;
--ring-bg:#e6edf1; /* リングの薄色背景 */
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans JP",sans-serif;color:var(--ink);background:#f6faf9}


/* ---------- セクション全体 ---------- */
.kpi-section{max-width:1200px;margin:auto;padding:24px}
.kpi-card{display:grid;grid-template-columns:1.2fr 1.8fr;gap:0;background:white;border-radius:16px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.06)}


/* 左サイド（タイトル） */
.kpi-hero{background:var(--bg-deep);color:#fff;padding:40px 32px;display:flex;align-items:center;justify-content:center;text-align:center}
.kpi-hero h2{font-size:clamp(18px,2.2vw,28px);line-height:1.45;margin:0;font-weight:800;letter-spacing:.02em}
.kpi-hero p{opacity:.9;margin:.75rem 0 0;font-size:clamp(13px,1.4vw,16px)}


/* 右サイド（円グラフ群） */
.kpi-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:24px}


/* 円グラフコンポーネント */
.dial{display:flex;flex-direction:column;align-items:center;gap:10px;background:linear-gradient(#f9fbfb,#f3f7f6);padding:18px;border-radius:14px;border:1px solid #e8eeec}
.dial svg{width:min(180px,26vw);height:auto;display:block}
.dial .label-top{font-size:14px;color:#334d45;font-weight:700;letter-spacing:.04em}
.dial .value{font-size:48px;font-weight:800}
.dial .value small{font-size:.48em;color:#445e57}
.dial .chip{display:inline-flex;align-items:center;gap:8px;background:var(--chip);color:var(--chip-ink);padding:6px 10px;border-radius:999px;font-size:13px;font-weight:700}
.dial .chip i{width:20px;height:20px;border-radius:50%;background:linear-gradient(180deg,#9b2cff,#4f66ff);display:inline-block}


/* --- SVG リングの見た目 --- */
.ring-bg{stroke:var(--ring-bg);}
.ring-fg{stroke:url(#grad);stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%}


/* アニメーション（IntersectionObserverでclassを付与） */
.dial .ring-fg{transition:stroke-dashoffset 1.8s cubic-bezier(.22,1,.36,1)}
.dial .value{transition:opacity .3s ease}
.dial:not(.in-view) .value{opacity:.2}


/* スマホ（2枚目の配置イメージ） */
@media (max-width: 720px){
.kpi-card{grid-template-columns:1fr}
.kpi-hero{padding:24px}
.kpi-hero h2{font-size:18px}
.kpi-hero p{font-size:13px}


/* スマホでは3つを横並びの小型ダイヤルに（2枚目の雰囲気） */
.kpi-groups{grid-template-columns:repeat(3,1fr);gap:8px;padding:12px}
.dial{padding:12px}
.dial svg{width:100%;max-width:110px}
.dial .label-top{font-size:12px}
.dial .value{font-size:28px}
.dial .chip{font-size:11px;padding:4px 8px}
.dial .chip i{width:16px;height:16px}
}



.floating-line-btn{
  position: fixed;
  right: clamp(12px, 2.2vw, 24px);
  bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  z-index: 9999;
  display: inline-block;
  background-color: #06c755; /* LINE公式カラー */
  color: #ffffff;
  text-decoration: none;
  padding: 16px 32px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  font-weight: 700;
  box-shadow: 0 3px 6px rgba(0,0,0,0.15);
  transition: background-color 0.3s, transform 0.2s;

}

/* ③ クリック感・フォーカスのアクセシビリティ */
.floating-line-btn:active{ transform: scale(.98); }
.floating-line-btn:focus-visible{
  outline: 3px solid #fff;
  box-shadow: 0 0 0 4px rgba(6,199,85,.55);
}



/* ④ スマホでは幅広く、親指で押しやすく */
@media (max-width: 1000px){
  .floating-line-btn{
    right: 12px;
    left: 12px;                     /* 両端固定で幅広ボタンに */
    bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
    text-align: center;
    padding: 16px 0;
    border-radius: 14px;
    font-size: 16px;

	
  }
}

/* ⑤ デスクトップだけ右下の丸ボタンにしたい場合（任意） */
@media (min-width: 1000px){
  .floating-line-btn{
    font-size: 20px;
	border-radius: 9999px;
	text-align: center;
	 width: 200px;               /* ←大きさはここで調整（例：96〜112px） */
    height: 200px;
	  padding: 65px 0px 0px 0px;                /* 中央にドン */
    white-space: normal;       /* 長い文言も折り返しOK */
  }
}

@media screen and (max-width: 768px) {
  .sv {
    display: block; 
  }
}

/* PCでは表示する（上書き） */
@media screen and (min-width: 769px) {
  .sv {
    display:none;
  }
}



.l_form_box {
	position: relative;
	top: -85px;
	width: 100%;
	max-width: 980px;
	padding: 2rem 0;
	margin: 0 auto;
	border: solid 4px #000;
	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 3px #FFF;
	/* 外側の線になる5pxの一本線の枠線をひく*/
	outline-offset: 1px;
	/* 内側の線になる一本線の枠線をひく*/
	background: #1e5799;
	/* Old browsers */
	 background: url(../../../../images/mediatest/bg.png) no-repeat center/cover;
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/* IE6-9 */
	box-shadow: 0 0 15px gray;
}

.l_form_box2 {
	width: 100%;
	max-width: 980px;
	padding: 2rem 0;
	margin: 0 auto;
	border: solid 4px #000;
	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 3px #FFF;
	/* 外側の線になる5pxの一本線の枠線をひく*/
	outline-offset: 1px;
	/* 内側の線になる一本線の枠線をひく*/
	background: #1e5799;
	/* Old browsers */
	 background: url(../../../../images/mediatest/bg.png) no-repeat center/cover;
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/* IE6-9 */
	box-shadow: 0 0 15px gray;
}

.l_form_box p {
	color: #000;
}

.l_form_box input[type="text"] {
	width: 90%;
	height: 50px;
	padding: 10px;
	font-size: 15px;
	color: #000000;
	margin: auto 0;
	background: white;
	font-weight: bold;
	border: 2px solid #000;
}
.l_topform_area {
	width: 100%;
	margin: 0 auto;
	background-size: cover;
	text-align: center;
	color: #FFF;
}

.l_topform_area_bottom {
	width: 100%;
	margin: 0 auto;
	background: url(../../../../images/mediatest/bg.png) no-repeat top center;
	background-size: cover;
	padding: 1rem 0 2rem;
	text-align: center;
	color: #FFF;
	box-shadow: 0 0 10px gray;
}

.u-button {
  display: inline-block;
  border: 0;
  padding: 0;
  cursor: pointer;
  background: #B38700;
  border-radius: 10px;
  box-shadow: 0 6px 0 #7a5d00;
  appearance: none; /* 各ブラウザの既定装飾を消す */
  width: 80%;
}

/* ★ 子要素(span)を動かす */
.u-button > span {
  display: block;
  background: #FFD500; /* 表面の色 */
  border-radius: 20px;
  transform: translateY(-10px); /* 浮かせる距離 */
  padding: 30px 40px;
  position: relative;
  overflow: hidden;
  animation: a-button 2s steps(1) infinite; /* 常に押してる動き */
  box-shadow: 0 4px 0 #ccaa00; /* 表面の影（オレンジ寄り） */
  transition: transform .15s ease, box-shadow .15s ease;}

/* 常時上下するアニメーション */
@keyframes a-button {
  0%, 8%, 18%   { transform: translateY(-10px); }
  4%, 14%       { transform: translateY(-7px); }
}

/* 押し込み時の沈み */
.u-button:active > span {
  transform: translateY(0);
  animation: none; /* 押してる間は止まる（止めたくなければ消してOK） */
}

/* 光沢アニメーション */
.u-button > span::after {
  content: '';
  width: 40%;
  height: 100%;
  position: absolute;
  top: 0; left: 0;
  background: rgba(255,255,255,.2);
  transform: translate(-100%,0) skewX(-30deg);
  filter: blur(5px);
  animation: shine 3s infinite;
}

@keyframes shine {
  0%   { opacity: .5; margin-left: 0; }
  50%  { opacity: 1; margin-left: 175%; }
  100% { opacity: .5; margin-left: 0; }
}

/* ——— スマホ対応 ——— */
@media (max-width: 768px) {
  .u-button > span {
    padding: 18px 40px;          /* タップしやすい余白に */
    border-radius: 24px;
  }
  .u-button{
	margin-top: 30px;
	font-size: 2rem;
  }
}

@media (max-width: 480px) {
  .u-button > span {
    padding: 30px 30x;          /* タップ領域は縦横とも拡大 */
  }
    .u-button{
	margin-top: 30px;
  }

}

.kv-theme{
display:inline-flex; align-items:center; gap:.5em; font-weight:700; letter-spacing:.08em;
text-transform: uppercase; font-size: .78rem; color: var(--accent-2);
background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.25);
padding: .5em .8em; border-radius: 999px; backdrop-filter: blur(4px);
}
.kv-dot{ width:.5em; height:.5em; border-radius:50%; background: var(--accent); box-shadow:0 0 0 4px rgba(34,197,94,.15)}


.kv-h1{
margin: 14px 0 18px;  line-height:1.4; font-weight:800;
background: linear-gradient(180deg, #fff, #bcd7ff 60%, #8fb3ff);
-webkit-background-clip: text; background-clip: text; color: transparent;
letter-spacing: .02em;
}


.kv-quote-list{
list-style: none; padding: 0; margin: 28px 0 14px;
display: grid; gap: 14px;
}
.kv-quote{
position: relative; padding: 16px 16px 16px 46px;
background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
border: 1px solid white; border-radius: 14px;
box-shadow: 0 6px 20px rgba(0,0,0,.25) inset, 0 4px 18px rgba(0,0,0,.1);
color: var(--text);
}
.kv-quote::before{
position:absolute; left:14px; top:50%; transform: translateY(-50%);
font-size: 28px; line-height: 1; color: var(--gold); opacity:.9;
text-shadow: 0 2px 10px rgba(216,180,105,.2);
}


.kv-text{ margin: 18px 0 0;   }
.kv-strong{ color: var(--accent); font-weight: 800; }
.kv-br{ }


.kv-note{
margin-top: 26px; padding: 16px 18px; border-radius: 14px;
background: linear-gradient(180deg, rgba(34,197,94,.12), rgba(34,197,94,.06));
border: 1px solid rgba(34,197,94,.35);
}
.kv-note-text{ margin:0; color: var(--accent-2); font-weight:600; }


/* ===== Utilities ===== */
.kv-center{ text-align:center; }


/* ===== Responsive tweaks ===== */
@media (min-width: 720px){
.kv-quote-list{ grid-template-columns: 1fr; }
}

.kv-wrap2 {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 32px 16px;
}

.kv-card {
  width: 100%;
  max-width: 920px;
  box-shadow: 0 10px 28px rgba(9, 30, 66, 0.08);
}

.kv-list {
  display: grid;
  gap: 14px;
}

.kv-item {
  margin: 0;
  padding: 16px 18px;
  border: 1px solid #e4f2ea;
  border-left: 8px solid #22b573; /* アクセント */
  border-radius: 5px;
  font-weight: 600;               /* フォントサイズ/タイプは未指定 */
  letter-spacing: 0.02em;
  transition: box-shadow 180ms ease, transform 180ms ease;
  background: linear-gradient(180deg, rgba(34,197,94,.12), rgba(34,197,94,.06));

}
.ubbb {
      text-decoration:underline;
    }
.qa-section{max-width:900px;margin:0 auto;padding:40px 20px;}


.qa-item{background:black;
border: 1px solid rgba(34,197,94,.35);
border-radius:10px;padding:16px 20px;margin-bottom:16px;cursor:pointer;transition:all .3s ease;}

.qa-item:hover{box-shadow:0 6px 16px rgba(0,0,0,.15);}


.qa-question{margin:0;font-weight:bold;display:flex;justify-content:space-between;align-items:center;}
.qa-answer{margin:12px 0 0;display:none;color:white;}


.qa-item.active .qa-answer{display:block;}
.qa-item.active .qa-toggle{transform:rotate(45deg);}


.qa-toggle{font-weight:bold;color:#d35400;font-size:20px;transition:transform .3s ease;}

.kpz-achv-section {
  background: #000;          /* LPが黒背景想定 */
  padding: 24px 16px;
  color: #fff;
}

/* 見出し */
.kpz-achv-heading {
  line-height: 1.3;
  margin: 0 0 16px;
  padding-left: 10px;
  letter-spacing: .02em;
}

/* Swiper本体 */
.kpz-achv-swiper {
  width:100%;
  margin: 0 auto;
}

/* スライド */
.kpz-achv-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  /* 画像以外の余白が出ないように */
  background: #000;
}

/* ご指定の img クラスはそのまま活かしつつ、念のための調整 */
.kpz-achv-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;   /* 画像の比率を保持 */
}

/* ページネーション（ドット）を黒背景で視認性UP */
.kpz-achv-swiper .swiper-pagination-bullet {
  background: rgba(255,255,255,.5);
  opacity: 1;
}
.kpz-achv-swiper .swiper-pagination-bullet-active {
  background: #fff;
}

.kpz-achv-swiper:hover {
  cursor: pointer;
}


@keyframes infinity-scroll-left {
	from {
	  transform: translateX(0);
	}
	  to {
	  transform: translateX(-100%);
	}
	}
	.scroll-infinity__wrap {
	  display: flex;
	  overflow: hidden;
	}
	.scroll-infinity__list {
	  display: flex;
	  list-style: none;
	  padding: 0
	}
	.scroll-infinity__list--left {
	  animation: infinity-scroll-left 80s infinite linear 0.5s both;
	}
	.scroll-infinity__item {
	  width: calc(100vw / 2.5);
	}
	.scroll-infinity__item>img {
	  width: 100%;
	}

	/* .scroll-infinity__wrap:hover .scroll-infinity__list--left{
		animation-play-state: paused;
	  } */

@keyframes infinity-scroll-right {
from {
	transform: translateX(-100%);
}
	to {
	transform: translateX(0%);
}
}
.scroll-infinity__list--right{
	animation :infinity-scroll-right 80s infinite linear 0.5s both;
	}


.gf-section{ position:relative; padding:72px 20px 96px; overflow:hidden; isolation:isolate; }



.slide-container {
    width: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.slide-wrapper {
  display: flex;
  animation: slide-flow 20s infinite linear 1s both;
}
.slide{
  width: 300px;
  object-fit:cover;
  border: 1px solid #ddd;
}
@keyframes slide-flow {
     0% {transform: translateX(0);}
 100% {transform: translateX(-100%);}
}

#header{
	top: -80px;
}

html, body {
  max-width: 100%;
  overflow-x: clip;          /* 旧端末なら hidden */
  overscroll-behavior-x: none;
  touch-action: pan-y;
}

/* スワイパー「だけ」横パンを許可（ここは横スワイプしたい） */
.kpz-achv-swiper,
.kpz-achv-swiper .swiper-wrapper {
  touch-action: pan-x;       /* 横スワイプは許可、縦は親が受ける */
}

/* stickyやヘッダーが100vwだと揺れる→左右0で幅決定 */
header, .sticky {
  left: 0; right: 0;
  width: auto;               /* 100vwを使わない */
}