@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;
}


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

.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;}
.ma{margin: 0 auto;}

a:link{text-decoration:none; color: #FF2B74;}
a:visited{text-decoration:none; color: #FF2B74;}
a:hover{text-decoration:none; color: #FF2B74;}
a:active{text-decoration:none; color: #FF2B74;}


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


.bg-wrap {
	position: relative;
	width: 100%;
	height: 85rem;
	background-color: #000000;
	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;
    }
}


.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
*********************************************************/

#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;
}

#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;*/
}

#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: 1.8s;
}
.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-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: 1rem solid #000000;
  }
  
  #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: 1rem 0.5rem 1rem 0.5rem;
	  margin-right: 2rem;
	  color: #fffb00;
	  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;
}



.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);
	color: #332008;
}

.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: #000000;
	background-image: url("https://www.transparenttextures.com/patterns/classy-fabric.png");
	color: #F9F9F9;
}

.text{
	width: 70rem;
	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-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-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-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:#F9F0A9;}
.area-be{background-color: #FAF7ED;}
.area-o{background-color: #FBB117;}
.area-rd{background:#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: #1f4d00;
	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-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:1rem solid #bc1c00;
}

.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: 3px 3px;
	z-index: 2;
  }


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


.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-arg{
	background-image: url("https://www.transparenttextures.com/patterns/argyle.png");
}

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


.area-bp{
	border:0.1rem 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));
}

.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;}


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


.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; */
}



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

.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: 30%;
	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: 69%;
	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;
}

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: #770101;
	background-image: url("https://www.transparenttextures.com/patterns/xv.png");

}

.result-alpha  p.hdd{
	background-color: #2d2d2d;

}
/*　
*********************************************************/


/*　
*********************************************************/
.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.8rem;
	font-weight: bold;
	color:#000000;
/*	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");
*/	background-color: #ffffff;
	padding: 3rem 2rem;
}


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

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;
}

ul.last-number li{
	display: inline-block;

	font-size: 2.3rem;
	color: #000000;
	background-color: #ffffff;
	padding: 3rem;
	margin: 0.2rem;
	background-image: url("https://www.transparenttextures.com/patterns/white-carbon.png");

}

ul.last-number li:nth-child(n + 101){
	background-color: #0c0c0c;
	color: #F7F7F7;
}

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


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



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

.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: #fff9c7;
  }
  
  .says:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 18px; 
	left: -24px;
	border: 12px solid transparent;
	border-right: 12px solid #fff9c7;
  }
  
  .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;
  }




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

/*折り畳み*/
.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: 80rem;
	margin: 0 auto;
}

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


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: 60%;
	padding:1.5rem 2rem;
	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: #FF2B74;
/*	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: #FF2B74;
	border: 0.3rem solid #ffffff;
	background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");
	border: none;
	color: #ffffff;
	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;
}
}


/*===========================================*/
table.gouka{
	width: 100%;
	margin: 0 auto;
	border-spacing: 0.1rem;
	line-height: 1.5;
}

table.gouka th{
	width: 30%;
	padding: 2rem 0;
	text-align: center;
	vertical-align: middle;
}

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

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



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: #fff;
	background-color: #1f4d00;
	background-image: url("https://www.transparenttextures.com/patterns/black-linen.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.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(0, 0, 0,0.75);
	/* box-shadow: 0 0 20px rgb(255, 255, 161); */
	padding: 2rem 0;
}

#CDT {
	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:#e5ff00;
}

#CDT01 {
	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;
}

#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{
	width: 110rem;
	margin: 0 auto;
	text-align: center;
}

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

.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;
}


@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-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: #FAF7ED;
}

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

.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;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/********************************************
	ユーザーの声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);
}