@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');

html {scroll-behavior: smooth;}
body {
  margin: 0 auto;
  padding: 0;
  font-size: 16px;
	color: #333;
  line-height: 2em;
	font-family: sans-serif;
font-weight: 600;
font-style: normal;
  -webkit-text-size-adjust: 100%;
}

@media only screen and ( min-width : 769px ) {

}
/* ----------------------------------------------

 * レスポンシブ非表示

---------------------------------------------- */
@media only screen and ( max-width : 768px ) {
.o769{display: none;}
}
@media only screen and ( min-width : 769px ) {
.u768{display: none;}
}
/* ----------------------------------------------

 * img

---------------------------------------------- */
img {
  max-width: 100%;
  height: auto;
}
a {
  font-size: 100%;
  color: #477684;
  text-decoration: none;
}
a:hover, a:active {
  filter: alpha(opacity=80);
  -moz-opacity:0.80;
  opacity:0.80;
}

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

　   HEADER

--------------------------------------------------------------------------------------------- */
#header {
  width: 100%;
}
.bg_pattern {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #ffe9a7;
  opacity: 1;
  z-index: -1;
}
.Rectangles {
  background-image:  repeating-linear-gradient(45deg, #e30000 25%, transparent 25%, transparent 75%, #e30000 75%, #e30000), repeating-linear-gradient(45deg, #e30000 25%, #f80000 25%, #f80000 75%, #e30000 75%, #e30000);
	/*background-color: #ee000;*/
  background-position: 0 0, 20px 20px;
  background-size: 40px 40px;
}

.title{
  width: 100%;
	padding: 25px 0;
	text-align: center;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

h1{
	margin: 10px 0 40px 0;
	font-size: 3.5em;
	color: #ffef00;
	line-height:1.2;
	/*font-family: "vdl-logojrblack", sans-serif;*/
	font-weight: 900;
}
h2{
	/*color: #fff;*/
	font-size: 1.8em;
	line-height: 1;
	color: transparent;
  background: repeating-linear-gradient(0deg, #ddd 0.1em, #eee 0.2em, #fff 0.3em, #eee 0.4em, #ddd 0.5em); 
  -webkit-background-clip: text;
}
h3{
	font-size: 2.8em;
	line-height: 1;
	color: transparent;
  background: repeating-linear-gradient(0deg, #ddd 0.1em, #eee 0.2em, #fff 0.3em, #eee 0.4em, #ddd 0.5em); 
  -webkit-background-clip: text;
}
.period{
  width: 100%;
	padding: 15px 0;
	text-align: center;
	font-weight: bold;
  background: #ffef00;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}
@media only screen and ( max-width : 768px ) {
h1{font-size: 2.2rem;}
h2{font-size: 1.5rem;}
h3{font-size: 2rem;}
.period{font-size: 0.95rem;}	
}



@media print, screen and ( min-width : 769px ) {
.period{
	font-size: 1.5rem;
}
}
/* ---------------------------------------------------------------------------------------------

　   MAIN

--------------------------------------------------------------------------------------------- */
/* main,section
--------------------------------*/
main {
  width: 100%;
  background: #fff;
  overflow: hidden;
}
#main p {
  word-break: break-all;
}
section {
  width: 100%;
  text-align: center;
}
section .inner {padding: 50px 0;}

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

}
@media only screen and (min-width: 769px) {

  	
}
/* box
--------------------------------*/
@media only screen and (max-width: 768px) {
	.boxS, .boxM, .boxL, .box0 {
    width: 98%;
  }
  .boxS {
    margin: 15px auto 0 auto;
  }
  .boxM {
    margin: 25px auto 0 auto;
  }
  .boxL {
    margin: 50px auto 0 auto;
  }
	  .box0 {
  margin: 0 auto;
  }
}
@media only screen and (min-width: 769px) {
	.boxS, .boxM, .boxL, .box0 {
    width: 98%;
  }	
  .boxS {
  margin: 25px auto 0 auto;
}
.boxM {
  margin: 50px auto 0 auto;
}
.boxL {
  margin: 100px auto 0 auto;
}
	.box0 {
  margin: 0 auto;
}
}
@media only screen and (min-width: 1200px) {
	.boxS, .boxM, .boxL, .box0 {
    width: 1200px;
  }
}

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

　   contens

--------------------------------------------------------------------------------------------- */
/* p-mt
--------------------------------*/
.p-mt p{margin-top: 25px;}
.p-mt p:nth-child(1) {margin-top: 0;}

/* prize
--------------------------------*/
.prize{
	max-width: 800px;
	margin: 50px auto 0 auto;
	padding: 30px 0;
	background-color: #e50707;
	border-radius: 10px;
}
.prize p:nth-child(odd) {color: #fff;}
.prize p:nth-child(even) {
	margin-top: 10px;
	color: #ffef00;
}
@media only screen and (max-width: 768px) {
.prize img{width: 90%;}
}
@media only screen and (min-width: 769px) {
.prize img{width: 65%;}
}
.sample2b {
  display    : inline-block;
  position   : relative;
	font-weight: bold;
}
.sample2b span {
  display    : inline-block;
  position   : absolute;
  top        : 0;
  left       : 0;
  bottom     : 0;
  right      : 0;
  background : linear-gradient(transparent 60%, rgba(0, 255, 0, 0.6) 90%);  /* ラインマーカーを付ける  */
  animation  : sample2bAnime 3s ease-in infinite;  /* アニメ */
}
 /* --- アニメーションの設定 ------------------------------------ */
@keyframes sample2bAnime {
   0% { right : 100%; }     /* 点滅開始色        */
  25% { right : 0;    }     /* 点滅終了色        */
 100% { right : 0;    }     /* 点滅終了色        */
}

/* table
--------------------------------*/ 
table.tableQuestion {
 width:100%;
 background:#fff;
 border: 1px solid #999; 
 border-bottom: none;
}
table.tableQuestion th {
 width:100%;
 padding: 5px;
 text-align:left;
 background:#ddd;
 vertical-align:middle;
 display: block;
}
table.tableQuestion td {
width:100%;
  padding: 5px;
 font-weight:normal;	
 text-align:left;
 border-top: 1px solid #999; 
	 border-bottom: 1px solid #999; 
 vertical-align:middle;
	display: block;
}

table.tableRsp {
 width:100%;
 background:#fff;
}
table.tableRsp th {
 padding: 5px 0;
 font-weight:normal;
 text-align:center;
 border: 1px solid #999; 
 background:#ddd;
 vertical-align:middle;
}
table.tableRsp td {
 padding: 10px;
 font-weight:normal;	
 text-align:center;
 border: 1px solid #999; 
 vertical-align:middle;
}

@media only screen and (max-width: 768px){
table.tableRsp {border-top:solid 1px #999; }	
table.tableRsp th {
 width: 100%;
 display: block;
 border-top:0; 
 border-bottom:0;	
}
table.tableRsp td {
 width: 100%;
 display: block;
}
}
@media only screen and (min-width: 769px){
table.tableRsp th {
 width: 25%;
}
table.tableRsp td {
 width: 75%;
	text-align: left;
}
}


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

　   FOOTER

--------------------------------------------------------------------------------------------- */
#footer {
  background-image: linear-gradient(-20deg, #e50707 0%, #f05555 100%);
	padding: 25px 0;
  font-size: 14px;
	color: #fff;
	text-align: center;
}
@media only screen and ( max-width : 768px ) {
  .f_logo img {width: 120px;}
}
@media print, screen and ( min-width : 769px ) {
  .f_logo img {width: 180px;}
}
/* page-top
--------------------------------*/
#page-top {
  position: fixed;
}
@media only screen and (max-width: 768px) {
  #page-top {
		width: 10%;
  	bottom: 15px;
		right: 15px;
	}
}
@media only screen and (min-width: 769px) {
  #page-top {
    
  bottom: 20px;
  right: 20px;
  }
}

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

　   form

--------------------------------------------------------------------------------------------- */
/* form
--------------------------------*/ 
input[type="text"],input[type="number"],input[type="tel"],textarea,select{
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
	padding: 0.2em;
}/*枠線を横幅に含める=はみ出し防止*/
input[type="text"],input[type="number"],input[type="tel"],input[type="submit"],input[type="reset"],textarea,select{font-size: 15px;}	
input[type="radio"] {margin: 0 2px 3px 20px;}
@media only screen and (max-width: 768px){
input[type="text"],input[type="number"],input[type="tel"],input[type="submit"],input[type="reset"],textarea,select{font-size: 15px;}
.fwS{width:20%;}
.fwM{width:100%;}	
.fwL{width:100%;}
}
@media only screen and (min-width: 769px){
.fwS{width:10%;}
.fwM{width:50%;}	
.fwL{width:100%;}
}
.msg { color:#e20045; }/* !!!メールフォームCGIに埋め込まれているclassっぽい!!!クラス名変更不可 */
/* ---------------------------------------------------------------------------------------------

　   CENERAL

--------------------------------------------------------------------------------------------- */
/* fontsize
--------------------------------*/
@media only screen and ( max-width : 768px ) {
.p-01{font-size: 1.2rem;}
}
@media print, screen and ( min-width : 769px ) {
.p-01{
	font-size: 2rem;
	line-height: 1.5;}
}


.fs-03 {
  font-size: 0.3em;
}
.fs-05 {
  font-size: 0.5em;
}
.fs-06 {
  font-size: 0.6em;
}
.fs-07 {
  font-size: 0.7em;
}
.fs-08 {
  font-size: 0.8em;
}
.fs-09 {
  font-size: 0.9em;
}
.fs-11 {
  font-size: 1.1em;
}
.fs-12 {
  font-size: 1.2em;
}
.fs-13 {
  font-size: 1.3em;
}
.fs-14 {
  font-size: 1.4em;
}
.fs-15 {
  font-size: 1.5em;
}
.fs18 {
  font-size: 1.8em;
}
.fs20 {
  font-size: 2em;
}
.fs-25 {
  font-size: 2.5em;
}
.fs-30 {
  font-size: 3em;
}
.fs-35 {
  font-size: 3.5em;
}
.fs-40 {
  font-size: 4em;
}
.fs-50 {
  font-size: 5em;
}
.fs-60 {
  font-size: 6em;
}
.fs-70 {
  font-size: 7em;
}
.fs-80 {
  font-size: 8em;
}
/* color
--------------------------------*/
.clr-red{color:#e50707;}
.clr-black {color: #000;}
.clr-grey {color: #999;}
.clr-white {color: #fff;}
.bgc-basered {
  background-color: #d62c33;
}
.bgc-red {background-color: #e50707;}
.bgc-black {
  background-color: #000;
}
.bgc-content {
  background-color: #f5f5f5;
}
/* others
--------------------------------*/
.lh-1 {
  line-height: 1;
}
.lh-15 {
  line-height: 1.5;
}
.lh-2 {
  line-height: 2;
}
.taC {
  text-align: center !important;
}
.taR {
  text-align: right !important;
}
.taL {
  text-align: left !important;
}
.liststyle-disc {
  list-style: disc;
  padding-left: 1.5em;
}