@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

* {
	-webkit-box-sizing			: border-box;
	box-sizing					: border-box;
}

html {
	overflow-x					: hidden;
}

body {
	background					: url(../images/bg.png);
    background-position         : center;
    background-repeat           : repeat-y;
	background-size				: 100%;
	font-size					: 16px;
	text-align					: center;
	font-family 				:"Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

img {
	width						: 100%;
	max-width					: 1000px;
	margin						: 0 auto;
	display						: block;
}

p, a, span, ul, li, h1, h2, h3 {
}

a{
  color : #fff;
}

.wrapper{
	width						: 100%;
	max-width					: 1000px;
	margin						: 0 auto;
	position					: relative;
	display						: block;
    padding-bottom              : 50px;
    box-shadow: 
    -10px 0 10px rgba(0, 0, 0, 0.5),
    10px 0 10px rgba(0, 0, 0, 0.5);

    /* 追加の背景画像 */
    background-image: 
      url('../images/bg2.png'),
      url('../images/bg3.png');
    
    /* 各画像の位置を個別に指定 */
    background-position: 
      bottom center,      /* 基準画像 */
      top center;    /* 背景画像2 */
    
    /* 各画像のサイズを個別に指定 */
    background-size: 
      100%; 
    background-repeat: 
      no-repeat,
      repeat;
}

.container{
	width						: 100%;
	max-width					: 1000px;
	margin						: 0 auto;
	position					: relative;
	display						: block;
}



/*-----------------------------
  ヘッダー
-----------------------------*/
header{
	position					: relative;
	display						: block;
}

header .logo {
	position					: absolute;
	width						: 7.5%;
	left						: 2%;
	padding-top					: 1%;
}

header .top_text {
	position					: absolute;
	width						: 20%;
	right						: 2%;
	padding-top					: 1%;
}

header .twitter {
	position					: absolute;
	width						: 2.4%;
	padding-top					: 3.5%;
	right						: 6%;
}

header .facebook {
	position					: absolute;
	width						: 2.4%;
	padding-top					: 3.5%;
	right						: 2%;
}



/*-----------------------------
  main-visual
-----------------------------*/
.mv nav{
	position					: absolute;
	bottom						: 0;
	width						: 100%;
}



/*-----------------------------
  フッター
-----------------------------*/
footer {
  background                    : #fff;
  position                      : relative;
}


footer p {
	line-height					: 1.2rem;
	font-weight					: bold;
}
footer a {
	text-decoration				: none;
	display						: inline;
	margin						: 0 auto;
}

.copyright{
  background                    : #000;
  padding                       : 0.5rem;
}

.copyright .container{
  color                         : #fff;
  text-align                    : center;
  font-weight                   : bold;
  font-size                     : 0.85rem;
}

/*-----------------------------
  応募規約
-----------------------------*/
.rule {
	position					: relative;
	padding						: 30px 0;
	padding-top 				: 0;
	margin						: 20px auto;
}


.r_contents {
	background-color			: #e0e0e0;
	width						: 62%;
	margin						: 0px auto;
    border-radius               : 8px;
    font-family                 : serif;
    overflow                    : hidden;
}

.scroll_wrap {
	background-color			: #e0e0e0;
	aspect-ratio				: 16 / 9;
	padding						: 10px;
}

.scroll_box {
	height						: 100%;
	overflow-y					: scroll;
	position					: relative;
	text-align					: left;
	padding-left				: 10px;
	padding-right				: 40px;
}

.scroll_box p {
	font-size					: 0.8rem;
	line-height					: 1.8;
	margin-bottom				: 10px;
}

.scroll_box h3 {
	color						: #983a55;
	font-weight					: bold;
	font-size					: 1rem;
	line-height					: 1.5;
	margin-top					: 15px;
}

.scroll_box a {
	color						: #983a55;
}

.ps__rail-x, .ps__thumb-x {
	display: none;
}

.ps__rail-x, .ps:hover > .ps__rail-y, .ps--focus > .ps__rail-x, .ps--focus > .ps__rail-y, .ps--scrolling-x > .ps__rail-x, .ps--scrolling-y > .ps__rail-y {
	opacity: 1;
}

.ps--active-y > .ps__rail-y, .ps--active-y > .ps__rail-y > .ps__thumb-y {
	width: 10px;
	border-radius: 10px;
	opacity: 1;
	margin-right: 5px;
}

.ps--active-y > .ps__rail-y {
	background-color: #D4E2EA;
}

.ps--active-y > .ps__rail-y > .ps__thumb-y {
	left: 0px;
	background-color: #6A777D;
}



/*-----------------------------
  faq
-----------------------------*/
.faq {
	position				    : relative;
	padding-top				    : 0;
	width						: 62%;
	margin						: 20px auto;
    border-radius               : 8px;
    overflow                    : hidden;
    background-color            : rgba(0, 0, 0, 0.2);
    color                       : #fff;
}



.qa_btn {
	display: block;
	cursor: pointer;
	position: relative;
	margin-top: 50px;
}

.qa_btn img {
	width: 74%;
	margin-bottom: 10px;
}

.qa {
	width               : 95%;
	margin              : 20px auto;
    color               : #fff;
}

.qa_block {
	line-height: 1.5;
	text-align: left;
	margin-bottom: 0px;
}

.question {
	position: relative;
	cursor: pointer;
	padding-left: 30px;
	padding-right: 30px;
	border-bottom       : #fff 1px solid;
}


.question p {
	position            : relative;
	width               : 100%;
	padding             : 10px;
    color               : #fff;
    
}


.question:after{
	content	:	"";
	position	:absolute;
	left		: 5px;
	top			: 12.5px;
	width		: 20px;
	height		: 30px;
	background	: url(../images/icon-q.png);
	background-repeat	: no-repeat;
	background-size	: 100%;
}

.question:before{
	content	:	"";
	position	:absolute;
	right		: 5px;
	top			: 12.5px;
	width		: 20px;
	height		: 20px;
	background	: url(../images/icon-p.png);
	background-repeat	: no-repeat;
	background-size	: 100%;
}

.question.active:before{
	content	:	"";
	position	:absolute;
	right		: 5px;
	top			: 12.5px;
	width		: 20px;
	height		: 20px;
	background	: url(../images/icon-m.png);
	background-repeat	: no-repeat;
	background-size	: 100%;
}

.answer {
  display: none;
}

.answer p {
	line-height: 1.8;
	margin-bottom: 15px;
	padding: 10px;
	padding-left: 40px;
    position    : relative;
    color               : #fff;
    font-size           :0.85rem;
}

.answer p:after{
	content	:	"";
	position	:absolute;
	left		: 5px;
	top			: 18px;
	width		: 20px;
	height		: 30px;
	background	: url(../images/icon-a.png);
	background-repeat	: no-repeat;
	background-size	: 100%;
}

/*-----------------------------
  info3
-----------------------------*/
.info3{
  margin: 30px  auto;
  margin-top: 50px;
}

/*-----------------------------
  totop
-----------------------------*/

#totop {
  z-index: 100;
  position: fixed;
  bottom: 5em;
  right: 1em;
}

#totop a {
  width: 62px;
  display: block;
}


ul.ast {line-height: 1.8; font-size: 0.8rem; list-style: none;margin: 0;text-align: left;}
ul.ast li {	margin: 0;	padding-left: 1em;	text-indent: -1em;}
ul.ast li:before {	content: "\203b";	}
ul.ast li.red:before {	content: "\203b";	}

.answer ul.ast{
	padding-left: 40px;
}

ul.dot {line-height: 1.8; font-size: 0.8rem; list-style: none;margin: 0;text-align: left;}
ul.dot li {	margin: 0;	padding-left: 1em;	text-indent: -1em;}
ul.dot li:before {	content: "\30FB";	}
ul.dot ul.ast li:before {	content: "\203b";}

ol.num {
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
  margin: 0 0 0.5em 0;
}
ol.num li {
line-height: 1.8; font-size: 0.8rem;
  padding-left: 1.25em;
  position: relative;
}
ol.num li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  border: 1px solid #000; 
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 15px;
  width: 15px;
  font-size: 65%;
	font-weight:500;
  line-height: 1;
  position: absolute;
  top: 0.45em;
  left: 0;
}

.indented-text {
  position: relative;
  padding-left: 3em; /* （例）の幅分のパディング */
  text-indent: 0;
}

.indented-text .example-label {
  position: absolute;
  left: 0;
  top: 0;
  width: 3em;
}