/*　Universal Reset　=================================*/
html,body{margin:0;padding:0;width:100%;height:100%;font-size:100%;background-color: #000;}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,div,object,ul,ol,li,dl,dt,dd,tr,td,fieldset,form,legend,figure{margin:0;padding:0;font-size:100%;font-weight:normal;}
ul,ol{list-style:none;}
fieldset{margin:0;padding:0;border:0 none;}
legend{display:none;}
table,th,td{border:0;border-spacing:0;}
caption,th{text-align:left;}
em,strong,cite,abbr,caption,th,address{font-style:normal;font-weight:normal;}
input,select,textarea{margin:0;padding:0;vertical-align:middle;}
input{-webkit-appearance:none;appearance:none;}
input[type="submit"]{border:none;border-radius:0;}
input[type="radio"]{-webkit-appearance:radio;appearance:radio;}
input[type="checkbox"]{-webkit-appearance:checkbox;appearance:checkbox;}
option{padding-right:5px;}
article,aside,dialog,details,figure,figcaption,footer,header,hgroup,menu,nav,section{display:block;}
mark{font-weight:normal;font-style:normal;}
blockquote,q{quotes:none;}
a{vertical-align:baseline;text-decoration:none;}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}

/*　style　=================================*/
html{font-size: calc(1000vw / 1000);}
body{width: 500px;margin: 0 auto; display: block; color:#fff;font-size:3.5rem;line-height:1.6;-webkit-text-size-adjust:100%;-webkit-touch-callout:none;font-family: "zen-kaku-gothic-antique", sans-serif;
font-weight: 400;
font-style: normal;}
@media screen and (max-width: 640px) {
	body{width: 100%;}
}
#container{max-width:1200px;margin: 0 auto;overflow: hidden;background:#000;}

.mb_0{margin-bottom: 0 !important;}
.mb_S{margin-bottom: 0.5em !important;}
.mb_M{margin-bottom: 1em !important;}
.mb_L{margin-bottom: 1.5em !important;}

h1{
	color: #000;
	font-weight: bold;
	font-size: 22px;
	background-color: #FF0690;
	text-align: center;
	padding: 5px 0;
}
h2{
	color: #FF0690;
	font-size: 26px;
	font-weight: bold;
	width: 92%;
	display: block;
	margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
}
h3{
	font-weight: bold;
	color: #FF0690;
	font-size: 22px;
}
h4{
	font-weight: bold;
	color: #FF0690;
	font-size: 19px;
	text-align: center;
}
h5{
	font-weight: 100;
	color: #fff;
	font-size: 12px;
	margin: 0 auto 15px auto;
	text-align: right;
	width: 92%;
	display: block;
}

p{
	width: 92%;
	display: block;
	margin-top: 5px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 40px;
	font-size: 18px;
	line-height: 1.8;
}

p span{
	background-color: #E4FF00;
	font-weight: bold;
	font-size: 20px;
	color: #000;
	font-size: 20px;
	line-height: 1.8;
}

.box{
	background-color: #333;
	width: 90%;
	display: block;
	margin-top: -20px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 40px;
	padding: 8px;
	border-radius: 10px;
}

.box p{
	margin-bottom: 10px!important;
	font-size: 16px!important;
}

.box h4{
margin-top: 10px!important;
font-size: 22px!important;	
	color: #fff;
}

.box2{
	background-color: #333;
	width: 90%;
	display: block;
	margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 40px;
	padding: 15px 8px;
	border-radius: 10px;
}

.box2 p{
	margin-bottom: 10px!important;
	font-size: 16px!important;
}

.box2 h3{
     background:#222222 !important;
      display: inline-block!important;
}

.box2 h4{
margin-top: 10px!important;
font-size: 22px!important;	
	color: #fff;
}

.main_img{
	width: 100%;
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 5px;
	border: 0 none;
}

.img{
	width: 92%;
	display: block;
	margin: 15px auto 5px auto;
}
.img2{
	width: 100%;
	display: block;
	margin: 0px auto 5px auto;
}
.img3{
	width: 100%;
	display: block;
	margin: 0px auto 5px auto;
}
.img4{
	width: 60%;
	display: block;
	margin: 0px auto 5px auto;
}

.img_icon{
	width: 40%;
	display: block;
	margin: 10px auto 5px auto;
}

.img_entry{
	width: 90%;
	display: block;
	margin-top: -30px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
	border: 0 none;
	vertical-align: bottom;
	vertical-align: middle;
}
.img_oji{
	float: left;
	z-index: 2;
	margin-left: 20px;
	position: absolute;
	width: 95px;
	margin-top: 15px;
}
.img_oji2{
	float: right;
	z-index: 2;
	margin-left: 240px;
	position: absolute;
	width: 95px;
	margin-top: 15px;
}

.tx_center{text-align: center;}

/*=======　contents　=======*/
/*--- title ---*/
.ttl_01{

}


/*--- area_regist ---*/
.area_regist .area_agree{margin:5rem auto 0;text-align: center;}
.area_regist .area_agree > p{font-size:4rem;margin-bottom:1rem;}
.area_regist .area_agree > p > a{color:#e01184;border-bottom:0.3rem solid #e01184;}
.area_regist .area_agree > p > input[type="checkbox"]{display: none;}
.area_regist .area_agree > p > input[type="checkbox"] + label{position:relative;padding-left: 1.5em;color:#e01184;font-size:0.8em;}
.area_regist .area_agree > p > input[type="checkbox"] + label::before{position: absolute;display: block;left: 0;
content: "\f0c8";font-family: "Font Awesome 5 Free";
color: #999;font-size:4.5rem;margin: auto;font-weight: 400;}
.area_regist .area_agree > p > input[type="checkbox"]:checked + label::before{content: "\f14a";font-weight: 700;}

/*--- list_registbtn ---*/
ul.list_registbtn .btn_line > a{display:block;max-width:98%;margin:2rem auto;text-align: center;}
ul.list_registbtn + p.note{font-size:3rem;text-align:center;}

/*--- text style ---*/
.txt_01{overflow:hidden;}
.txt_01 > p{text-align:justify;line-height:1.8;}

/*--- footer ---*/
footer{background:#e01184;}
footer nav{max-width:1000px;margin:0 auto;}
footer nav ul li a{display:block;max-width: 900px;margin:0 auto;padding:1em;color:#FFF;font-size:4rem;border-bottom:1px solid #FFF;position: relative;}
footer .copyright{color:#FFF;font-size:2.5rem;padding:6rem 0 10rem;text-align: center;}




/*--- blc_reason ---*/
.blc_reason .matchimage{position:relative;}
.blc_reason .matchimage > .match{position:absolute;left: calc(50% - 7.75rem);top:calc(50% - 6rem);width:15.5rem;}

/*--- blc_point ---*/
.blc_point .pointimage{position:relative;}
.blc_point .pointimage > figure > img{position:relative;max-width:120rem;left:-14.5rem}
.blc_point .pointimage > p{
	position: absolute;
	width: 30rem;
}
.blc_point .pointimage > p.point01{
	top: 8rem;
	left: 3rem;
}
.blc_point .pointimage > p.point02{
	top: 80rem;
	left: 3rem;
}
.blc_point .pointimage > p.point03{
	top: 46rem;
	right: 2rem;
}

/*--- blc_step ---*/
.blc_step ul.list_step{display:flex;flex-wrap: wrap;justify-content: center;}
.blc_step ul.list_step > li{width:50%;padding:2rem;text-align:center;}

/*--- blc_voice ---*/
.blc_voice ul.list_voice > li{position:relative;min-height:22rem;margin-bottom:10rem;}
.blc_voice ul.list_voice > li > h3{color:#e01184;font-weight:bold;border-bottom:0.5em;}
.blc_voice ul.list_voice > li > p.icon{position:absolute;top:0;width:22rem;height:22rem;}
.blc_voice ul.list_voice > li:nth-child(odd) {padding-left:25rem;}
.blc_voice ul.list_voice > li:nth-child(odd) .icon{left:0;}
.blc_voice ul.list_voice > li:nth-child(even){padding-right:25rem;}
.blc_voice ul.list_voice > li:nth-child(even) .icon{right:0;}
.blc_voice ul.list_voice > li:last-child{margin-bottom:0;}

/*--- blc_support ---*/
.blc_support dl.list_support{padding:5rem;border:0.5rem solid #e01184;border-radius:3rem;overflow:hidden;}
.blc_support dl.list_support > dt{color:#e01184;font-weight:bold;border-bottom:0.5em;}
.blc_support dl.list_support > dd{margin-bottom:1em;}
.blc_support{
	margin-bottom: 70px;
	margin-top: -20px;
}

#kiyaku{
    width: 96%;
    display: block;
    margin: 0 auto;
}
#kiyaku dt{
    font-size: 3.6rem;
    font-weight: bold;
    margin-top: 18px;
}
#kiyaku dd{
    font-size: 3.4rem;
}

#pointList{
    width: 100%;
    margin: 20px auto;
}
#pointList thead th{
    background-color: #cecece;
    text-align: center;
    font-weight: bold;

}


#pointList tr{
    width: 96%;
    padding: 5px 0;
}

#pointList th{
    width: 80%;
}

#pointList td{
    font-weight: bold;
}

/* Responsive =================================*/
@media screen and (min-width: 1000px) {
html{font-size: 62.5%;}
body{font-size:3.2rem;}



/**/}/**/

/*　animation　=================================*/
/*-- zoomRepeat --*/
.animated_zoomRepeat {
-webkit-animation: zoomRepeat 1.5s ease-in-out infinite;
animation: zoomRepeat 1.5s ease-in-out infinite;
}
@-webkit-keyframes zoomRepeat {
0% {-webkit-transform: scale(0.9);}
30% {-webkit-transform: scale(1, 1);}
60% {-webkit-transform: scale(0.9);}
100% {-webkit-transform: scale(0.9);}
}
@keyframes zoomRepeat {
0% {transform: scale(0.9);}
30% {transform: scale(1, 1);}
60% {transform: scale(0.9);}
100% {transform: scale(0.9);}
}
/*-- jumpRepeat --*/
.animated_jumpRepeat {
-webkit-animation: jumpRepeat 2s ease-in-out infinite;
animation: jumpRepeat 2s ease-in-out infinite;
}
@-webkit-keyframes jumpRepeat {
0% {-webkit-transform: translateY(0);}
25% {-webkit-transform: translateY(-0.4em);}
50% {-webkit-transform: translateY(0);}
75% {-webkit-transform: translateY(-0.4em);}
100% {-webkit-transform: translateY(0);}
}
@keyframes jumpRepeat {
0% {transform: translateY(0);}
25% {transform: translateY(-0.4em);}
50% {transform: translateY(0);}
75% {transform: translateY(-0.4em);}
100% {transform: translateY(0);}
}
.js_inview{opacity: 0;}
/*-- fadeIn inview(keyframe:animate.css) --*/
.animated_fadeIn.active{opacity: 1;
 -webkit-animation:fadeIn 0.5s ease 1;
 -moz-animation:fadeIn 0.5s ease 1;
 animation: fadeIn 0.5s ease 1;
} 
/*-- fadeInUp inview(keyframe:animate.css) --*/
.animated_fadeInUp.active{opacity: 1;
 -webkit-animation:fadeInUp 0.5s ease 1;
 -moz-animation:fadeInUp 0.5s ease 1;
 animation: fadeInUp 0.5s ease 1;
}
/*-- fadeInDown inview(keyframe:animate.css) --*/
.animated_fadeInDown.active{opacity: 1;
 -webkit-animation:fadeInDown 1s ease 1;
 -moz-animation:fadeInDown 1s ease 1;
 animation: fadeInDown 1s ease 1;
}
/*-- fadeInLeft inview(keyframe:animate.css) --*/
.animated_fadeInLeft.active{opacity: 1;
 -webkit-animation:fadeInLeft 1s ease 1;
 -moz-animation:fadeInLeft 1s ease 1;
 animation: fadeInLeft 1s ease 1;
}
/*-- fadeInRight inview(keyframe:animate.css) --*/
.animated_fadeInRight.active{opacity: 1;
 -webkit-animation:fadeInRight 1s ease 1;
 -moz-animation:fadeInRight 1s ease 1;
 animation: fadeInRight 1s ease 1;
}
/*-- zoomIn inview(keyframe:animate.css) --*/
.animated_zoomIn.active{opacity: 1;
 -webkit-animation:zoomIn 1s ease 1;
 -moz-animation:zoomIn 1s ease 1;
 animation: zoomIn 1s ease 1;
}
