html{
	font-size:1em;
	overflow-x:hidden;
}

body{
	position:relative;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	font-family: 'Lato', 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size:100%;
	background:#EBE6DF;
	color:#474747;
	overflow-x:hidden;
	box-sizing:border-box;
}

h1{
	position:relative;
	display:inline-block;
	box-sizing:border-box;
	font-size:1.8rem;
	line-height:2.0rem;
	font-weight:550;
	width:100%;
	padding:0.6rem 1.2rem;
	border-left:1.5rem solid #3ca;
	border-right:1.5rem solid #3ca;
	border-bottom:initial;
	border-top:initial;
	border-bottom-width: 0;
	border-top-width: 0;
	border-image: linear-gradient(to bottom, #3ca 0%, #c6ff6b 100%);
	border-image: -moz-linear-gradient(top, #3ca 0%, #c6ff6b 100%);
	border-image: -webkit-linear-gradient(top, #3ca 0%, #c6ff6b 100%);
	border-image-slice: 1;
	margin:1.0rem 0 1.0rem 0;
	color:#FFF;
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
	text-align:center;
}

h1:before{
	position:absolute;
	display:inline-block;
	content:"";
	top:0;
	left:1.0rem;
	width:calc(100% - 2.0rem);
	height:100%;
	//background:#3ca;
	border-image: url(/img/light_256.webp), linear-gradient(to bottom, #3ca 0%, #c6ff6b 100%);
	border-image: url(/img/light_256.webp), -moz-linear-gradient(top, #3ca 0%, #c6ff6b 100%);
	background: url(/img/light_256.webp), -webkit-linear-gradient(top, #3ca, #c6ff6b);
    background-size: 34%,auto;
    background-position: -13% 40%;
    background-repeat: no-repeat;
	//border-bottom:2px solid #3ca;
	z-index:-1;
}
@media screen and (max-width: 768px) {
	h1{
		display:block;
		font-size:6.0vw;
		line-height:8.0vw;
		padding:0.6vw 1.2vw;
		border-left:3.0vw solid #3ca;
		border-right:3.0vw solid #3ca;
		margin:1.0rem auto;
		transform:none;
	}
	h1:before{
		top: 0;
		left: 2vw;
		width: calc(100% - 4vw);
	}
}

h2{
	position:relative;
	display:inline-block;
	font-size:1.8rem;
	font-weight:500;
	color:#FFF;
	width:96%;
	margin:2.0rem 0 2.0rem 2%;
	padding:0.6rem 10% 0.6rem 0;
	background:#3ca;
	text-align:center;
	border-radius:0.6rem 0 0 0.6rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
}
h2:before{
	position:absolute;
	display:inline-block;
	content:"";
	width:6.0rem;
	height:6.0rem;
	top:-1.2rem;
	left:-1.0rem;
	background-image:url("./img/light_128.webp");
	background-repeat:none;
	background-size:contain;
}

h2:after{
	position:absolute;
	display:inline-block;
	content:"";
	width:2.6%;
	height:100%;
	top:0;
	left:-4%;
	background:#3ca;
	border-radius:0 0.6rem 0.6rem 0;
}
@media screen and (max-width: 768px) {
	h2{
		font-size:5.2vw;
		width:96%;
		margin:2.0rem 0 2.0rem 2%;
		padding:0.4rem 2% 0.4rem 0;
	}
	h2:before{
		width:22vw;
		height:22vw;
		top:-5vw;
		left:-5vw;
	}
	
	h2:after{
		position:absolute;
		display:none;
	}
}
.terms h2:before{
	background-image:none;
}

h3{
	display: inline-block;
    font-size: 1.5rem;
    margin: 0.4rem;
    border-left: 1.0rem solid #3ca;
    border-top: 1px solid #3ca;
    border-bottom: 2px solid #3ca;
    padding:0.4rem 0 0.4rem 0.6rem;
	background: linear-gradient(to right, rgba(255,255,255,0.75), rgba(255,255,255,0));
	background: -moz-linear-gradient(left, rgba(255,255,255,0.75), rgba(255,255,255,0));
	background: -webkit-linear-gradient(left, rgba(255,255,255,0.75), rgba(255,255,255,0));
}

@media screen and (max-width: 768px) {
	h3{
		width:100%;
		font-size:4.6vw;
	}
}


input[type="text"], input[type="password"], textarea{
	position:relative;
	display:inline-block;
	width:100%;
	box-sizing:border-box;
	font-size:1.0rem;
	padding:0.4rem 0.4rem;
	margin:0.3rem 0 0.8rem 0;
	border:1px solid #474747;
	border-radius:0.4rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
}

input[type="text"]:read-only, input[type="password"]:read-only, textarea:read-only{
	background:#edf4f2;
}

table{
	display:block;
	width:100%;
	overflow-x:scroll;
}

table th, table td{
	padding:0.4rem;
}

table th{
	color:#FFF;
	text-shadow:2px 2px 3px rgba(0,0,0,0.65);
	background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
}

table td{
	background:#FFF;
}

table tr:nth-child(odd) td {
	background: #f5f5f5;
}

.post_form{
	position:relative;
	display:inline-block;
	width:100%;
	box-sizing:border-box;
	font-size:1.0rem;
	padding:0.4rem 0.4rem;
	margin:0.3rem 0 0.8rem 0;
	border:1px solid #474747;
	border-radius:0.4rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	background:#FFF;
	color:#222;
}

.post_form_ta{
	position:relative;
	display:inline-block;
	width:100%;
	box-sizing:border-box;
	font-size:1.0rem;
	padding:0.4rem 0.4rem;
	margin:0.3rem 0 0.8rem 0;
	border:1px solid #474747;
	border-radius:0.4rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	background:#FFF;
	color:#222;
}

select{
	position:relative;
	display:inline-block;
	box-sizing:border-box;
	font-size:1.0rem;
	padding:0.4rem 0.4rem;
	margin:0.3rem 0 0.8rem 0;
	border:1px solid #474747;
	border-radius:0.4rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	cursor:pointer;
	background-color:#FFF!important;
}

::placeholder{
	color:#aaa;
}

input[type=radio] {
	display: none;
}

.radio{
	font-size:1.2rem;
	background:#888;
	font-weight:500;
	color:#eee;
	padding:0.4rem 0.8rem;
	margin:0 0.4rem;
	border-radius:1.6rem;
	//border:2px solid #ccc;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16) inset;
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
	cursor:pointer;
	transition:0.5s;
}

input[type="radio"]:checked + label{
	background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
	color:#fff;
	box-shadow:2px 2px 6px rgba(0,0,0,0.50);
	transition:0.5s;
}

#black{
	position:fixed;
	display:block;
	width:100%;
	height:100%;
	margin:0;
	top:0;
	left:0;
	background:rgba(0,0,0,0.5);
	z-index:205;
}

#white{
	position:fixed;
	display:block;
	width:100%;
	height:100%;
	margin:0;
	padding-top:20%;
	top:0;
	left:0;
	background:#fff;
	z-index:30;
	text-align:center;
}

#white input{
	width:20rem;
}

#info{
	position:fixed;
	display:block;
	width:100%;
	height:2.4rem;
	top:3.8rem;
	left:0;
	color:#3ca;
	background:#FFF;
	line-height:2.4rem;
	text-align:center;
	font-size:1.2rem;
	box-shadow:0px 4px 8px rgba(0,0,0,0.35);
	z-index:20;
	border-top:2px solid #3ca;
	border-bottom:2px solid #3ca;
}

#infobox{
	position:fixed;
	display:block;
	width:90%;
	height:60%;
	top:20%;
	left:5%;
	margin:auto;
	background:#fff;
	border-radius:8px;
	box-shadow:4px 4px 20px rgba(0,0,0,0.5);
	overflow-y:scroll;
	overflow-x:hidden;
}
#infobox #info_content div{
	position:relative;
	display:inline-block;
	box-sizing:border-box;
	width:100%;
	padding:0.4rem 0.6rem;
	font-size:1.0rem;
	line-height:1.8rem;
}
@media screen and (min-width: 769px) {
	#infobox{
		width:768px;
		left:calc(50% - 384px);
	}
}

#closeinfo{
	position:fixed;
	display:block;
	width:3rem;
	height:3rem;
	top:10%;
	right:20%;
	background:#ccc;
	border-radius:4px;
	box-shadow:2px 2px 8px rgba(0,0,0,0.35);
	cursor:pointer;
	transition:0.5s;
}
#infobox #closeinfo{
	position:absolute;
	top:0.2rem;
	right:0.2rem;
}
@media screen and (max-width: 769px) {
	#closeinfo{
		position:fixed;
		top:10%;
		right:2.5%;
	}
}

#closeinfo:hover{
	background:#aaa;
}
#closeinfo:before{
	position:absolute;
	display:block;
	content:"";
	border-left:4px solid #fff;
	width:3rem;
	height:3rem;
	top:1.1rem;
	left:1.0rem;
	transform:rotate(45deg);
}

#closeinfo:after{
	position:absolute;
	display:block;
	content:"";
	border-left:4px solid #fff;
	width:3rem;
	height:3rem;
	top:-1.0rem;
	left:1.0rem;
	transform:rotate(-45deg);
}

blank1{
	display:inline-block;
	width:100%;
	height:1.0rem;
}

blank2{
	display:inline-block;
	width:100%;
	height:2.0rem;
}

blank3{
	display:inline-block;
	width:100%;
	height:3.0rem;
}

main{
	position:relative;
	color:#3ca;
	display:inline-block;
}

@keyframes glow {
  0% {
    transform: scale(0%);
  }
  100% {
    transform: scale(100%);
  }
}

@keyframes gloww {
  0% {
    transform: scaleX(0%);
  }
  100% {
    transform: scaleX(100%);
  }
}

@keyframes fadein {
  0% {
    opacity:0;
  }
  100% {
    opacity:1.0;
  }
}

.bold{
	font-weight:600;
}

.mini{
	font-size:0.7rem;
}

.small{
	font-size:0.85rem;
}

.default{
	font-size:1.0rem;
}

.large{
	font-size:1.2rem;
}

.big{
	font-size:1.4rem;
}

.main_col{
	color:#3ca;
}

.white{
	color:#FFF;
}

.gray{
	color:#666;
}

.lgray{
	color:#AAA;
}

.red{
	color:#d22;
}

.yellow{
	color:#eda705;
}

.bg_maingrad{
	background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
}

.bg_redgrad{
	background: linear-gradient(to bottom, #d73e51, #e26d4a);
	background: -moz-linear-gradient(top, #d73e51, #e26d4a);
	background: -webkit-linear-gradient(top, #d73e51, #e26d4a);
}

.bg_pinkgrad{
	background: linear-gradient(to bottom, #df2292, #f48f4c);
	background: -moz-linear-gradient(top, #df2292, #f48f4c);
	background: -webkit-linear-gradient(top, #df2292, #f48f4c);
}

.bg_bluegrad{
	background: linear-gradient(to bottom, #38c, #05fabd);
	background: -moz-linear-gradient(top, #38c, #05fabd);
	background: -webkit-linear-gradient(top, #38c, #05fabd);
}

.bg_lightgrad{
	background: linear-gradient(to bottom, #f2efd3, #ebff4a)!important;
	background: -moz-linear-gradient(top, #f2efd3, #ebff4a)!important;
	background: -webkit-linear-gradient(top, #f2efd3, #ebff4a)!important;
}

.bg_green{
	background:#3ca;
	transition:0.5s;
}

.bg_bg{
	background:#EBE6DF;
	transition:0.5s;
}

.bg_white{
	background:#FFF;
	transition:0.5s;
}

.bg_blue{
	background-color:#38c;
}

.bd_blue{
	border-color:#38c!important;
}

.bg_red{
	background-color:#e33;
}

.bg_pink{
	background-color:#e49;
}

.bd_main{
	border-color:#3ca!important;
}

.bd_pink{
	border-color:#e49!important;
}

.shadow{
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	transition:0.5s;
}

.shadow_s{
	box-shadow:2px 2px 5px rgba(0,0,0,0.16);
	transition:0.5s;
}

.t_shadow{
	text-shadow:2px 2px 3px rgba(0,0,0,0.65);
	transition:0.5s;
}

.t_shadow_s{
	text-shadow:1px 1px 2px rgba(0,0,0,0.65);
	transition:0.5s;
}

.btn{
	position:relative;
	display:inline-block;
	background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
	transition:0.5s;
	color:#FFF;
	box-sizing:border-box;
	font-size: 1.6rem;
    font-weight: normal;
    text-decoration: none;
    padding: 0.8rem 1.8rem;
    line-height: 2.4rem;
    border-radius: 3.0rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
}
@media screen and (max-width: 768px) {
	.btn{
		font-size: 4.2vw;
		padding: 0.2vw 1.4rem;
	}
}

.btn:hover{
	color:#3ca;
	background:#FFF;
	box-shadow:16px 16px 14px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0);
}
.btn:hover::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:100%;
	height:100%;
	border-radius:3.0rem;
	top:0;
	left:0;
	border:4px solid #3ca;
	animation:fadein 1.0s;
}

.btn_die{
	position:relative;
	display:inline-block;
	background: linear-gradient(to bottom, #4c505c, #57799c);
	background: -moz-linear-gradient(top, #4c505c, #57799c);
	background: -webkit-linear-gradient(top, #4c505c, #57799c);
	transition:0.5s;
	color:#FFF;
	box-sizing:border-box;
	font-size: 1.6rem;
    font-weight: normal;
    text-decoration: none;
    padding: 0.8rem 1.8rem;
    line-height: 2.4rem;
    border-radius: 3.0rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
}
@media screen and (max-width: 768px) {
	.btn_die{
		font-size: 4.2vw;
		padding: 0.2vw 1.4rem;
	}
}

.btn_die:hover{
	color:#4c505c;
	background:#FFF;
	box-shadow:16px 16px 14px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0);
}
.btn_die:hover::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:100%;
	height:100%;
	border-radius:3.0rem;
	top:0;
	left:0;
	border:4px solid #4c505c;
	animation:fadein 1.0s;
}

.btn_dis{
	position:relative;
	display:inline-block;
	background: linear-gradient(to bottom, #4c505c, #57799c);
	background: -moz-linear-gradient(top, #4c505c, #57799c);
	background: -webkit-linear-gradient(top, #4c505c, #57799c);
	transition:0.5s;
	color:#DDD;
	opacity:0.75;
	box-sizing:border-box;
	font-size: 1.6rem;
    font-weight: normal;
    text-decoration: none;
    padding: 0.8rem 1.8rem;
    line-height: 2.4rem;
    border-radius: 3.0rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
}
@media screen and (max-width: 768px) {
	.btn_dis{
		font-size: 4.2vw;
		padding: 0.2vw 1.4rem;
	}
}

.btn_dis:hover{
	opacity:0.45;
}
.btn_dis:hover::before{
	
}

.btn_blue{
	position:relative;
	display:inline-block;
	background: linear-gradient(to bottom, #38c, #05fabd);
	background: -moz-linear-gradient(top, #38c, #05fabd);
	background: -webkit-linear-gradient(top, #38c, #05fabd);
	transition:0.5s;
	color:#FFF;
	opacity:0.75;
	box-sizing:border-box;
	font-size: 1.6rem;
    font-weight: normal;
    text-decoration: none;
    padding: 0.8rem 1.8rem;
    line-height: 2.4rem;
    border-radius: 3.0rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
}
@media screen and (max-width: 768px) {
	.btn_blue{
		font-size: 4.2vw;
		padding: 0.2vw 1.4rem;
	}
}

.btn_blue:hover{
	color:#38c;
	background:#FFF;
	box-shadow:16px 16px 14px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0);
}
.btn_blue:hover::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:100%;
	height:100%;
	border-radius:3.0rem;
	top:0;
	left:0;
	border:4px solid #38c;
	animation:fadein 1.0s;
}

.btn_red{
	position:relative;
	display:inline-block;
	background: linear-gradient(to bottom, #D73E51, #e26d4a);
	background: -moz-linear-gradient(top, #D73E51, #e26d4a);
	background: -webkit-linear-gradient(top, #D73E51, #e26d4a);
	transition:0.5s;
	color:#FFF;
	opacity:0.75;
	box-sizing:border-box;
	font-size: 1.6rem;
    font-weight: normal;
    text-decoration: none;
    padding: 0.8rem 1.8rem;
    line-height: 2.4rem;
    border-radius: 3.0rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
}
@media screen and (max-width: 768px) {
	.btn_red{
		font-size: 4.2vw;
		padding: 0.2vw 1.4rem;
	}
}

.btn_red:hover{
	color:#D73E51;
	background:#FFF;
	box-shadow:16px 16px 14px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0);
}
.btn_red:hover::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:100%;
	height:100%;
	border-radius:3.0rem;
	top:0;
	left:0;
	border:4px solid #D73E51;
	animation:fadein 1.0s;
}

.btn_small{
	font-size: 1.2rem;
	padding: 0.6rem 1.0rem;
    line-height: 1.2rem;
	margin-bottom: 0.6rem;
    margin-top: 0.6rem;
}

.center, .text_center{
	display:inline-block;
	width:100%;
	text-align:center;
}

.pointer{
	cursor:pointer;
}

.hidden{
	display:none!important;
}

.is-fixed{
  position: fixed !important;
  top: 3.8rem;
  left: 0;
  z-index: 10;
  width: 100%;
}

#contents{
	position:relative;
	display:inline-block;
	width:100%;
	padding:4.0rem 0 0 0;
	margin:0;
}

#contents.contents{
	position:relative;
	display:inline-block;
	width:768px;
	padding:4.0rem 0 0 0;
	margin:0 calc((100% - 768px)/2);
}
@media screen and (max-width: 768px) {
	#contents.contents{
		width:100%;
		margin:0;
	}
}

.contents_s{
	position:relative;
	display:inline-block;
	width:80%;
	padding:4.0rem 0 0 0;
	margin:0 10%;
}
@media screen and (max-width: 768px) {
	.contents_s{
		width:100%;
		margin:0;
	}
}

#topbann{
	position:relative;
	display:inline-block;
	width:100vw;
	height:46vw;
	left:0;
	box-sizing:border-box;
	padding:0;
	margin:0 0 3.0rem 0;
}
@media screen and (max-width: 768px) {
	#topbann{
		height:56vw;
	}
}

@media screen and (max-width: 500px) {
	#topbann{
		height:66vw;
	}
}

#topbann h1{
	position:relative;
	display:inline-block;
	top:0.6rem;
	left:6.0vw;
	font-size:3.7vw;
	font-weight:normal;
	padding-left:1.6vw;
	border-left:2.8vw solid #3ca;
	text-align:left;
	color:#474747;
	box-sizing:initial;
	line-height:initial;
	border-right:initial;
	border-bottom:initial;
	border-bottom-width: 0;
	border-top-width: 0;
	margin:revert;
	transform:none;
	-webkit-appearance: none;
}
#topbann h1::before{
	border:none;
}
@media screen and (max-width: 768px) {
	#topbann h1{
		font-size:5.6vw;
		padding-left:2.0vw;
		border-left:3.6vw solid #3ca;
	}
}

#topbann #topbann_box{
	position:relative;
	display:block;
	left:0;
	width:fit-content;
	width:-moz-fit-content;
	color:#FFF;
	font-size:1.8vw;
	font-weight:normal;
	letter-spacing:0.4vw;
	padding:0.6rem 0.6rem 0.6rem 4.0vw;
	margin-top:2.4vw;
	background:#3ca;
}
@media screen and (max-width: 768px) {
	#topbann #topbann_box{
		font-size:2.4vw;
	}
}
@media screen and (max-width: 499px) {
	#topbann #topbann_box span{
		display:block;
	}
}

#topbann img{
	position:absolute;
	display:inline-block;
	width:50%;
	top:1.0vw;
	right:-5vw;
}

#topbann .btn{
	position:relative;
	display:inline-block;
	left:30%;
	top:6.0vw;
	font-size:2.4vw;
}
@media screen and (max-width: 768px) {
	#topbann .btn{
		font-size:4.2vw;
		left:50%;
		transform:translatex(-50%);
	}
}

#c01{
	position:relative;
	display:inline-block;
	width:100%;
	white-space:nowrap;
	margin:2.4rem 0;
}

#c01 .fukidashi{
	position:relative;
	display:inline-block;
	width:32%;
	box-sizing:border-box;
	background:#FFF;
	padding:1.4rem 1.0rem;
	margin:0 0.6%;
	border-radius:2.0rem;
	font-size:1.4vw;
	line-height:3.2vw;
}
@media screen and (max-width: 550px) {
	#c01{
		margin:1.0rem 0;
	}
	
	#c01 .fukidashi{
		font-size:3.8vw;
		line-height:5.4vw;
		display:block;
		width:80%;
		margin:2.4rem 9%;
	}
}

#c01 .fukidashi::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:1.2rem;
	height:5.4rem;
	top:-4.4rem;
	left:3.2rem;
	transform:rotate(30deg);
	border-top:2.7rem solid transparent;
	border-left:0.6rem solid transparent;
	border-right:0.6rem solid transparent;
	border-bottom:2.7rem solid #FFF;
}

#c01 .fukidashi::after{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:150%;
	height:50%;
	top:25%;
	left:-25%;
	background:#3ca;
	z-index:-1;
}

#c02{
	margin-top:2.0rem;
	margin-bottom:2.0rem;
	white-space:nowrap;
}

#c02 .tribox{
	position:relative;
	display:inline-block;
	width:26%;
	box-sizing:border-box;
	background:#FFF;
	padding:0 1.0rem 1.4rem 1.0rem;
	margin:0 3.6%;
	border-radius:2.0rem;
	font-size:1.4vw;
	line-height:3.2vw;
}
@media screen and (max-width: 550px) {
	#c02{
		margin:1.0rem 0;
	}
	
	#c02 .tribox{
		font-size:3.8vw;
		line-height:5.4vw;
		display:block;
		width:80%;
		margin:2.4rem 9%;
	}
}

#c02 .tribox h3{
	position:absolute;
	display:inline-block;
	width:100%;
	height:3.0rem;
	line-height:3.0rem;
	left:0;
	top:0;
	padding:0;
	margin:0;
	box-sizing:border-box;
	text-align:center;
	font-size:2.0vw;
	color:#FFF;
	background:#3ca;
	border-radius:2.0rem 2.0rem 0 0;
}
@media screen and (max-width: 768px) {
	#c02 .tribox h3{
		font-size:2.6vw;
	}
}

#c02 .tribox h3::before{
	position:absolute;
	display:inline-block;
	content:"";
	width:8.0vw;
	height:8.0vw;
	top:-2.0vw;
	left:-5%;
	background-image:url("./img/light_128.webp");
	background-repeat:none;
	background-size:contain;
}
@media screen and (max-width: 550px) {
	#c02 .tribox h3{
		font-size:5.4vw;
	}
	#c02 .tribox h3::before{
		width:20.0vw;
		height:20.0vw;
		top:-3.2vw;
	}
}

#c02 .tribox img{
	margin-top:3.0rem;
	width:100%;
}

#c02 .tribox div{
	width:100%;
	text-align:center;
}

#c03{
	margin-top:2.0rem;
	margin-bottom:2.0rem;
}

#c03 .c3block{
	position:relative;
	display:flex;
	width:100%;
	margin:1.0rem 0;
	white-space:nowrap;
	align-items: center;
}

#c03 .c3block .whitebox-l img, #c03 .c3block .whitebox-r img{
	width:100%;
}

#c03 .c3block .whitebox-l, #c03 .c3block .whitebox-r{
	position:relative;
	display:inline-block;
	width:36vw;
	height:20vw;
	background:#FFF;
	border-radius:2.0rem;
}

#c03 .c3block .whitebox-l{
	margin:0 0 0 14vw;
}

#c03 .c3block .whitebox-r{
	margin:0 14vw 0 0;
}

#c03 .c3block p.text-l,#c03 .c3block p.text-r{
	font-size:1.8vw;
	position:relative;
	display:inline-block;
	width:45vw;
	text-align:center;
}

#c03 .c3block p.text-l{
	margin:0 0 0 5vw;
}

#c03 .c3block p.text-r{
	margin:0 5vw 0 0;
}

@media screen and (max-width: 768px) {
	#c03 .c3block .whitebox-l, #c03 .c3block .whitebox-r{
		width:50vw;
		height:28vw;
		margin:0;
		border-radius:3.2vw;
	}
	
	#c03 .c3block p.text-l,#c03 .c3block p.text-r{
		width:50vw;
		margin:0;
		font-size:2.4vw;
	}
}

@media screen and (min-width: 1281px) {
	#c03 .c3block p.text-l,#c03 .c3block p.text-r{
		font-size:1.4vw;
	}
}

#c04{
	position:relative;
	display:inline-block;
	width:100%;
	white-space:nowrap;
}

#c04 .c04box{
	position:relative;
	display:inline-block;
	width:33vw;
	text-align:center;
}

#c04 .c04box img{
	position:relative;
	display:inline-block;
	width:60%;
	margin-left:20%;
}

#c04 .c04box h4{
	position:relative;
	display:inline-block;
	font-size:1.6vw;
	color:#FFF;
	background:#3ca;
	padding:0.4rem 1.4rem;
	border-radius:2.8rem;
	margin:0;
}
#c04 .c04box p{
	font-size:1.3vw;
}
@media screen and (max-width: 768px) {
	#c04 .c04box{
		position:relative;
		display:block;
		width:auto;
		text-align:center;
	}
	#c04 .c04box img{
		width:50%;
		margin-left:5%;
		margin-bottom: -1.5rem;
	}
	#c04 .c04box h4{
		font-size:4.2vw;
	}
	#c04 .c04box p{
		font-size:3vw;
	}
}

#topinfo{
	position:relative;
	display:flex;
	width:900px;
	height:270px;
	margin-left:calc((100% - 900px) / 2);
	background:#3ca;
	color:#FFF;
	border-radius:2.0rem;
	align-items: center;
}
@media screen and (max-width: 900px) {
	#topinfo{
		width:100vw;
		height:30vw;
		margin-left:0;
		border-radius:4.0vw;
	}
}

#topinfo-l{
	position:relative;
	display:inline-block;
	width:50%;
	text-align:center;
}
#topinfo-r{
	position:relative;
	display:inline-block;
	width:50%;
	text-align:center;
}
#topinfo-r img{
	position:relative;
	display:inline-block;
	width:90%;
	border-radius:1.8vw;
	transition:0.5s;
}
#topinfo-r img:hover{
	box-shadow:4px 4px 10px rgba(0,0,0,0.65);
}
@media screen and (max-width: 640px) {
	#topinfo-l{
		font-size:2.4vw;
	}
}

#portaltop{
	position:relative;
	display:inline-block;
	padding:0;
	margin:0;
	width:100vw;
	height:25vw;
	background-image:url("/img/portaltop.webp");
	background-size:cover;
}
#portaltop h1{
	position: relative;
    display: inline-block;
    top: 0.6rem;
    left: 6.0vw;
    font-size: 4.4vw;
    font-weight: normal;
    padding-left: 1.6vw;
    border-left: 2.8vw solid #3ca;
	border-bottom-width: 0;
	border-top-width: 0;
    text-align: left;
    color: #FFF;
    box-sizing: initial;
    line-height: initial;
    margin: auto;
    transform: none;
	background:transparent;
	-webkit-appearance: none;
}
@media screen and (max-width: 900px) {
	#portaltop h1{
		font-size:7vw;
		top: 0;
	}
}

#portaltop #topbann_box{
	position:relative;
	display:block;
	left:0;
	width:fit-content;
	width:-moz-fit-content;
	color:#FFF;
	font-size:1.8vw;
	font-weight:normal;
	letter-spacing:0.4vw;
	padding:0.6rem 0.6rem 0.6rem 4.0vw;
	margin-top:6.4vw;
	background:#3ca;
}
@media screen and (max-width: 900px) {
	#portaltop #topbann_box{
		letter-spacing:0.2vw;
		font-size:2.2vw;
		margin-top:1.4vw;
	}
}
@media screen and (max-width: 499px) {
	#portaltop #topbann_box{
		padding: 0.3rem 0.6rem 0.3rem 4.0vw;
		margin-top: 1.0vw;
		line-height:3.4vw;
	}
	#portaltop #topbann_box span{
		display:inline-block;
	}
}

.info_box{
	position:relative;
	display:block;
	width:fit-content;
	width:-moz-fit-content;
	font-size:1.2rem;
	background:#FFF;
	padding:0.4rem 0.8rem;
	border:2px solid #3ca;
	border-radius:0.6rem;
	margin:1.0rem auto;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
}
.info_box.top{
	font-size:1.8rem;
	margin-top:6.0rem;
	margin-bottom:6.0rem;
	text-align:center;
}

@media screen and (max-width: 768px) {
	.info_box.top{
		font-size:4.8vw;
		padding:0.4rem 1.2rem;
	}
	.info_box.top span{
		display:block;
	}
}

black{
	position:fixed;
	display:inline-block;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:#000;
	opacity:0.5;
	z-index:250;
}

picbox{
	position:fixed;
	display:flex;
	justify-content: center;
	align-items: center;
	width:100%;
	height:100%;
	top:0;
	left:0;
	text-align:center;
	z-index:260;
}

.pic_thmn{
	display:inline-block;
	width:100%;
	text-align:center;
	
}

.admin .pic_thmn{
	width:auto;
    margin: 1rem;
}

.pic_thmn .thmn{
	display: inline-block;
    width: 10rem;
	border-radius:0.8rem;
	box-shadow:2px 2px 6px rgba(0,0,0,0.35);
	cursor:pointer;
}

#ab_file{
	max-height:5rem;
}

@media screen and (max-width: 769px) {
	.admin .pic_thmn{
		margin: 0;
	}
	
	#ab_file{
		max-height:6rem;
	}
}

.picboximg{
	max-width:90%;
	max-height:90%;
	cursor:pointer;
}

.sel_ul .sel_li:hover{
	background:#f0f0f0;
}

.vote_form .sel_ul .sel_li{
	border:4px solid #3ca;
}

.select_form .sel_ul .sel_li:nth-child(1){
	border:4px solid #3ca;
}

.select_form .sel_ul .sel_li:nth-child(2){
	border:4px solid #65d6be;
}

.select_form .sel_ul .sel_li:nth-child(3){
	border:4px solid #a6ded2;
}

.select_form .sel_ul .sel_li:nth-child(4){
	border:4px solid #c5e8e1;
}

.select_form .sel_ul .sel_li:nth-child(5){
	border:4px solid #ddedea;
}

.li_sky{
	display:inline-block;
	position:relative;
	height:5.4rem;
	width:30%;
	margin:0.4rem;
	padding:0.2rem;
	border:4px dotted #ddd;
	background:#FAFAFA;
	border-radius:4px;
}

@media screen and (max-width: 769px) {
	.li_sky{
		width:calc(100% - 0.6rem - 8px);
		height:5.0rem;
		padding:0.2rem;
		margin:0.2rem auto;
	}
}

.decide{
	position:absolute;
	display:inline-block;
	border-radius:4px;
	padding:0.1rem 0.2rem;
	font-size:0.9rem;
	top:0.2rem;
	right:0.5rem;
	z-index:3;
}
.mylist .decide{
	position:absolute;
	box-sizing: border-box;
    font-size: 1.0rem;
	padding: 0.2rem 0.6rem;
    margin: 0rem 0;
	top:0.2rem;
	right:0.2rem;
}
@media screen and (max-width: 769px) {
	.mylist .decide{
		padding: 0.2rem 0.2rem;
	}
}

.voted{
	position:absolute;
	display:inline-block;
	border-radius:4px;
	padding:0.1rem 0.2rem;
	font-size:1.0rem;
	top:0.1rem;
	right:0.3rem;
	/*z-index:3;*/
}

.app_title{
	font-size:0.8rem;
	white-space:nowrap;
	overflow:hidden;
	//border-bottom:1px solid #3ca;
}

.app_disc{
	font-size:0.8rem;
	color:#666;
	margin-left:0.4rem;
	line-height:1.0rem;
}

@media screen and (max-width: 769px) {
	
	.app_title{
		font-size:0.8rem;
	}

	.app_disc{
		font-size:0.8rem;
		margin-left:0.2rem;
		width:calc(100% - 2.4rem);
		line-height:0.9rem;
	}
	
	.decide{
		right:3.0rem;
	}
	
	.voted{
		right:0.2rem;
	}
}

.pic_on{
	position:absolute;
	display:block;
	bottom:0;
	left:0;
	width:1.5rem;
	height:1.5rem;
}
.pic_on img{
	width:1.5rem;
	height:1.5rem;
}

.handle{
	position:absolute;
	display:block;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.vote{
	position:absolute;
	display:block;
	bottom:0;
	left:calc(100% - 4.0rem);
	width:4.0rem;
	height:1.8rem;
	text-align:center;
	font-size:1.2rem;
	color:#FFF;
	font-weight:600;
	box-sizing:border-box;
	border-radius:0.2rem;
	transition:0.5s;
}

.vote:hover{
	color:#f2efd3;
	background: linear-gradient(to bottom, #f48f4c, #df2292);
	background: -moz-linear-gradient(top, #f48f4c, #df2292);
	background: -webkit-linear-gradient(top, #f48f4c, #df2292);
	transition:0.5s;
}

@media screen and (max-width: 769px) {
	.handle{
		content:"";
		position:absolute;
		display:block;
		top:0;
		left:calc(100% - 2.4rem);
		width:2.4rem;
		height:100%;
		background:#f5f5f5;
		border-left:2px dotted #DDD;
	}
	.handle::before{
		/*content:"↕";*/
		content:"";
		background-image:url("/img/drag.svg");
		background-position:center;
		background-size:contain;
		background-repeat:no-repeat;
		width:2rem;
		height:2rem;
		transform: translateX(calc(25% - 0.4rem)) translateY(calc(85%));
		text-align:center;
		color:#888;
		font-size:1.8rem;
		line-height:5.6rem;
		position:absolute;
		display:block;
	}

	.vote{
		position:absolute;
		display:block;
		font-size:0.8rem;
		top:0;
		left:calc(100% - 2.4rem);
		width:2.4rem;
		height:100%;
		padding-top:0.6rem;
		border-radius:0.2rem;
	}
}

.show_desc{
	display:inline-block;
	width:100%;
	height:100%;
}

#sel_box{
	position:fixed;
	display:block;
	width:60%;
	height:80%;
	top:10%;
	left:20%;
	background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
	border-radius:6px;
	margin:0;
	padding:0.6rem;
	box-shadow:4px 4px 16px rgba(0,0,0,0.5);
	z-index:210;
}

#oubosha{
	font-size:1.0rem;
	color:#474747;
	line-height:1.6rem;
}

#ab_name{
	font-size:1.0rem;
	margin-left:0.4rem;
	line-height:1.6rem;
	color:#fff;
}

#ab_title{
	width:calc(100% - 1.2rem);
	line-height:1.6rem;
	padding:0.3rem;
	border:2px solid #ccc;
	border-radius:4px;
	margin:0.6rem 0;
	background:#fff;
	font-size:0.8rem;
}

#ab_disc{
	width:calc(100% - 1.2rem);
	height: calc(100% - 14rem);
	line-height:1.6rem;
	padding:0.3rem;
	border:2px solid #ccc;
	border-radius:4px;
	margin:0.6rem 0;
	overflow-y:scroll;
	background:#fff;
}

#ab_memo{
	position: absolute;
    width: calc(100% - 20rem);
    height: 6.5rem;
    max-height: 6.5rem;
    line-height: 1.6rem;
    padding: 0.3rem;
    border: 2px solid #ccc;
    border-radius: 4px;
    margin: 0.6rem 0;
    overflow-y: scroll;
    background: #fff;
    bottom: 0.4rem;
    right: 7rem;
}

.admin .btn{
	position: absolute;
	bottom: 2.4rem;
    right: 2rem;
}

#sel_stars{
	
	background:#fff;
	border:2px solid #ccc;
	border-radius:4px;
	cursor:pointer;
}

#sel_stars_area {
    position:absolute;
	top:0.1rem;
	right:4.2rem;
}

#dec_btn{
	position:absolute;
	display:block;
	font-size:1.2rem;
	top:0.3rem;
	right:4.0rem;
	font-weight:600;
	border-radius:4px;
	cursor:pointer;
	padding:0.2rem 0.4rem;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

#coll_aform{
	display:block;
	width:90%;
	height:27rem;
	margin:1.0rem auto;
	background:#FFF;
	border-radius:8px;
	padding:0.4rem 0.6rem;
	box-shadow:2px 2px 10px rgba(0,0,0,0.35);
	box-sizing:border-box;
	overflow-y:scroll;
}

#confirm, #confirm2, #notifyconf, #comm_form{
	position:fixed;
	display:block;
	width:30%;
	height:auto;
	text-align:center;
	top:35%;
	left:35%;
	background:#fff;
	border-radius:6px;
	margin:auto;
	padding:0.6rem;
	box-shadow:4px 4px 16px rgba(0,0,0,0.75);
	z-index:220;
}
@media screen and (max-width: 769px) {
	#confirm, #confirm2, #notifyconf{
		width:90%;
		left:5%;
		box-sizing:border-box;
	}
}

#comm_form{
	position:fixed;
	display:block;
	width:40%;
	height:auto;
	text-align:center;
	top:20%;
	left:30%;
	background:#fff;
	border-radius:6px;
	margin:auto;
	padding:0.6rem;
	box-shadow:4px 4px 16px rgba(0,0,0,0.75);
	z-index:220;
}

#comm_form textarea{
	font-size:1.0rem;
	height:18rem;
}

@media screen and (max-width: 769px) {
	#sel_box{
		width:calc(96% - 1.2rem);
		left:2%;
	}
	
	#oubosha, #ab_name, #ab_title, #ab_disc{
		font-size:0.8rem;
		line-height:1.2rem;
	}
	
	#ab_disc{
		height: calc(100% - 22rem);
	}
	
	#ab_memo{
		width: calc(100% - 2rem);
		right: 1rem;
		bottom: 2.6rem;
	}
	
	.admin .btn{
		bottom:0;
	}
	
	#confirm, #comm_form{
		width:90%;
		left:2%;
		height:auto;
		top:10%;
	}
	
	#comm_form textarea{
		font-size:1.0rem;
		height:18rem;
	}
}

.coll_aftitle{
	color:#888;
	font-size:0.9rem;
	font-weight:400;
	display:block;
	width:100%;
	border-bottom:2px solid #ccc;
	margin-top:0.4rem;
}

.coll_acon{
	width:96%;
	margin:auto;
}

.coll_fdisc{
	display:block;
	width:96%;
	height:11rem;
	overflow-y:scroll;
	border:2px solid #ccc;
	margin:0.4rem auto;
	border-radius:6px;
}

.coll_afdate{
	display:inline-block;
}

.coll_adate{
	display:inline-block;
}

.forms_s{
	display:block;
	width:auto;
	height:auto;
	margin:1.0rem 0;
	padding:0;
}

@media screen and (max-width: 769px) {
	.forms_s{
		width:100%;
	}
}

#options{
	position:relative;
	display:block;
	width:100%;
	height:calc(3.2rem + 8px);
	line-height:calc(3.2rem + 8px);
	margin:0;
	padding:0;
	background:transparent;
	white-space:nowrap;
}

@media screen and (max-width: 769px) {
	#options{
		overflow-x:scroll;
		font-size:0.8rem;
	}
	
}

#options.is-fixed{
	background:rgba(255,255,255,0.5);
}

#sel_aform{
	position:relative;
	display:block;
	width:768px;
	height:4rem;
	margin:1.0rem auto;
	background:#FFF;
	border-radius:8px;
	padding:0.4rem 0.6rem;
	box-shadow:2px 2px 10px rgba(0,0,0,0.35);
	box-sizing:border-box;
	overflow-x:auto;
	overflow-y:scroll;
	animation-duration:500ms;
}

@media screen and (max-width: 769px) {
	#sel_aform{
		width:96%;
	}
}

#sel_aform.fixed{
	overflow-y:hidden;
}

#sel_aform_open{
	position:relative;
	display:block;
	width:768px;
	height:fit-content;
	margin:1.0rem auto;
	background:#FFF;
	border-radius:8px;
	padding:0.4rem 0.6rem;
	box-shadow:2px 2px 10px rgba(0,0,0,0.35);
	box-sizing:border-box;
	overflow-x:auto;
	overflow-y:auto;
	animation-duration:500ms;
}
@media screen and (max-width: 769px) {
	#sel_aform_open{
		width:96%;
	}
}

#arr_r{
	position:absolute;
	display:block;
	width:1.4rem;
	height:1.4rem;
	margin-top:0.5rem;
	margin-left:0.4rem;
	margin-right:0.8rem;
	cursor:pointer;
}

#arr_r:before{
	position:absolute;
	display:block;
	content:"";
	width:0;
	height:0;
	border-left:0.7rem solid #3ca;
	border-top:0.7rem solid transparent;
	border-right:0.7rem solid transparent;
	border-bottom:0.7rem solid transparent;
}

#arr_d{
	position:absolute;
	display:block;
	width:1.4rem;
	height:1.4rem;
	margin-top:0.9rem;
	margin-left:0rem;
	margin-right:0.8rem;
	cursor:pointer;
}

#arr_d:before{
	position:absolute;
	display:block;
	content:"";
	width:0;
	height:0;
	border-left:0.7rem solid transparent;
	border-top:0.7rem solid #3ca;
	border-right:0.7rem solid transparent;
	border-bottom:0.7rem solid transparent;
}

.sel_ftitle{
	display:block;
	width:96%;
	margin:auto auto auto 0.8rem;
	padding-left:1.3rem;
	padding-right:0.5rem;
	font-size:1.2rem;
	line-height:2.2rem;
	color:#3ca;
	font-weight:600;
	text-align:left;
	cursor:pointer;
	white-space:nowrap;
	overflow-x:hidden;
}
@media screen and (max-width: 769px) {
	.sel_ftitle{
		padding-left:1.2rem;
		font-size:1.0rem;
		overflow-x:scroll;
	}
}

.sel_fdisc{
	display:block;
	width:96%;
	height:18rem;
	overflow-y:scroll;
	border:2px solid #ccc;
	margin:0.4rem auto;
	border-radius:6px;
}

.sel_fdate, .sel_fddate{
	display:block;
	width:96%;
	margin:auto;
	font-size:1.0rem;
	line-height:1.4rem;
	color:#888;
	text-align:center;
}

ul{
	list-style: none;
}

.sel_ul{
	display:inline-block;
	position:relative;
	overflow: hidden;
	height:auto;
	width:100%;
	margin:0;
	padding-top:1.0rem;
	padding-bottom:1.0rem;
	border:2px solid #ccc;
	//background:#aaa;
	/*background: linear-gradient(to bottom, #57799c, #4c505c);
	background: -moz-linear-gradient(top, #57799c, #4c505c);
	background: -webkit-linear-gradient(top, #57799c, #4c505c);*/
	border-radius:6px;
	box-shadow:4px 4px 10px rgba(0,0,0,0.5) inset;
}
.sel_ul.deactive{
	background: linear-gradient(to bottom, #57799c, #4c505c);
	background: -moz-linear-gradient(top, #57799c, #4c505c);
	background: -webkit-linear-gradient(top, #57799c, #4c505c);
}
.sel_ul.active{
	background: linear-gradient(to bottom, #893141, #24020f);
	background: -moz-linear-gradient(top, #893141, #24020f);
	background: -webkit-linear-gradient(top, #893141, #24020f);
}

.sel_ul .sel_li{
	display:inline-block;
	position:relative;
	height:5.4rem;
	width:30%;
	margin:0.4rem;
	padding:0.2rem;
	border:4px solid #ddd;
	background:#FAFAFA;
	border-radius:4px;
	cursor:pointer;
	overflow:hidden;
	box-shadow:2px 2px 4px rgba(0,0,0,0.35);
}

.pub_ul{
	position:relative;
	overflow: hidden;
	height:auto;
	max-width:768px;
	margin:auto;
	padding:0.6rem;
	border:4px solid #3ca;
	//background:#3ca;
	background: linear-gradient(to bottom, #57799c, #4c505c);
	background: -moz-linear-gradient(top, #57799c, #4c505c);
	background: -webkit-linear-gradient(top, #57799c, #4c505c);
	box-shadow:4px 4px 10px rgba(0,0,0,0.5) inset;
	border-radius:6px;
}

.pub_ul .pub_li{
	display:inline-block;
	position:relative;
	height:4.0rem;
	width:calc(100% - 1.2rem - 8px);
	margin:0.4rem;
	padding:0.2rem;
	border:6px solid #ff3881;
	background:#FAFAFA;
	border-radius:4px;
	cursor:pointer;
	overflow:hidden;
	box-shadow:2px 2px 4px rgba(0,0,0,0.35);
}

#a_comm{
	position:relative;
	display:block;
	width:768px;
	height:auto;
	margin:1.0rem auto;
	background:#FFF;
	border-radius:8px;
	padding:0.4rem 0.6rem;
	box-shadow:2px 2px 10px rgba(0,0,0,0.35);
	box-sizing:border-box;
	overflow-y:scroll;
	animation-duration:500ms;
}
#a_comm h2{
	font-size:1.3rem;
}

@media screen and (max-width: 769px) {
	#a_comm{
		width:96%;
	}
}

.vpub_ul{
	position:relative;
	overflow: hidden;
	height:auto;
	max-width:768px;
	margin:auto;
	padding:0.6rem;
	border:4px solid #3ca;
	//background:#aaa;
	background: linear-gradient(to bottom, #57799c, #4c505c);
	background: -moz-linear-gradient(top, #57799c, #4c505c);
	background: -webkit-linear-gradient(top, #57799c, #4c505c);
	box-shadow:4px 4px 10px rgba(0,0,0,0.5) inset;
	border-radius:6px;
}

.vpub_ul .pub_li{
	display:inline-block;
	position:relative;
	height:4.0rem;
	width:calc(100% - 1.2rem - 8px);
	margin:0.4rem;
	padding:0.2rem;
	border:6px solid #3ca;
	background:#FAFAFA;
	border-radius:4px;
	cursor:pointer;
	overflow:hidden;
	box-shadow:2px 2px 4px rgba(0,0,0,0.35);
}

.vpub_ul .pub_li .vote_num{
	//background:#ff3881;
	font-weight:600;
	font-size:1.2rem;
}

@media screen and (max-width: 769px) {
	.sel_ul{
		width:96%;
		padding:0.1rem;
	}
	
	.sel_ul .sel_li{
		width:calc(100% - 0.6rem - 8px);
		height:5.0rem;
		padding:0.2rem;
		margin:0.2rem auto;
	}
	
	.pub_ul .pub_li{
		width:calc(100% - 0.6rem - 8px);
		height:3.0rem;
		padding:0.2rem;
		margin:0.2rem auto;
	}
	
	.vpub_ul .pub_li{
		width:calc(100% - 0.6rem - 8px);
		height:3.0rem;
		padding:0.2rem;
		margin:0.2rem auto;
	}

	.vpub_ul .pub_li .vote_num{
		font-size:0.9rem;
	}
}

.star3_rating{
    position: absolute;
	top:0rem;
	right:0.1rem;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC; /* グレーカラー 自由に設定化 */
	background:#fafafa;
    /*font-size: 30px; フォントサイズ 自由に設定化 */
}

#ab_stars.star3_rating{
	position: relative;
	background:transparent;
	color: #EEE;
	font-size:2.0rem;
}

@media screen and (max-width: 769px) {
	.star3_rating{
		right:2.5rem;
	}
}

.star3_rating:before, .star3_rating:after{
    content: '★★★';
}

.star3_rating:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #eda705; /* イエローカラー 自由に設定化 */
}

.star3_rating[data-rate="3"]:after{ width: 100%; } /* 星3 */
.star3_rating[data-rate="2"]:after{ width: 66%; } /* 星2 */
.star3_rating[data-rate="1"]:after{ width: 33%; } /* 星1 */
.star3_rating[data-rate="0"]:after{ width: 0%; } /* 星0 */


.star4_rating{
    position: absolute;
	top:0rem;
	right:0.1rem;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC; /* グレーカラー 自由に設定化 */
	background:#fafafa;
    /*font-size: 30px; フォントサイズ 自由に設定化 */
}
@media screen and (max-width: 769px) {
	.star4_rating{
		right:2.5rem;
	}
}

.vote_num{
	position: absolute;
    display: inline-block;
    right: 0;
    bottom: 0;
    //background: #3ca;
    color: #FFF;
    font-size: 0.9rem;
    padding: 0.1rem 0.3rem;
    border-radius: 0.3rem 0 0 0;
}
@media screen and (max-width: 769px) {
	.vote_num{
		right:2.4rem;
	}
	.ve_li .vote_num{
		right:0rem;
	}
}

footer{
	position:relative;
	display:inline-block;
	align-items: center;
	width:100%;
	margin:2.0rem 0 0 0;
	padding:0;
	color:#FFF;
	background:#474747;
}

footer #footerblock{
	position:relative;
	display:flex;
	align-items: center;
	width:100%;
	margin:2.0rem 0;
	padding:0;
}

footer #footerblock1{
	position:relative;
	display:inline-block;
	width:40%;
	text-align:center;
}

footer #footerblock1 img{
	position:relative;
	display:block;
	width:50%;
	margin:1.0rem auto 2.0rem auto;
}

footer #footerblock2{
	position:relative;
	display:inline-block;
	width:60%;
	text-align:center;
}

footer #footerblock2 a{
	position:relative;
	text-decoration:none;
	color:#FFF;
	font-size:1.0rem;
	line-height:2.8rem;
	white-space:nowrap;
	margin:1.8rem 1.5rem;
	padding:0.2rem;
	transition:0.5s;
}
footer #footerblock2 a:hover::before{
	position:absolute;
	display:inline-block;
	content:"";
	width:100%;
	height:100%;
	top:0;
	left:0;
	border-bottom:1px solid #FFF;
	animation:gloww 0.3s;
}

@media screen and (max-width: 768px) {
	footer #footerblock{
		position:relative;
		display:inline-block;
	}
	
	footer #footerblock1{
		width:100%;
	}
	footer #footerblock1 img{
		width:50%;
	}
	
	footer #footerblock2{
		width:100%;
		font-size:1.0vw;
		line-height:2.0vw;
		margin-top:1.0rem;
	}
}

.forms{
	position:relative;
	display:inline-block;
	width:80%;
	margin-left:10%;
}
@media screen and (max-width: 768px) {
	.forms{
		width:100%;
		margin-left:0;
	}
}

.form_title{
	margin-left:0.4rem;
	margin-bottom:0.4rem;
	padding-top:0.4rem;
	border-top:1px solid #3ca;
	font-weight:600;
	color:#302c3d;
}

hissu{
	position:relative;
	display:inline-block;
	font-size:0.9rem;
	color:#FFF;
	background:#3ca;
	padding:0.1rem 0.4rem;
	border-radius:0.4rem;
	margin:0 0.4rem 0 0;
}

.quest{
	position:relative;
	display:inline-block;
	box-sizing:border-box;
	width:3.6rem;
	height:1.4rem;
	font-size:1.2rem;
	line-height:1.4rem;
	text-align:center;
	font-weight:600;
	color:#FFF;
	background:#38c;
	padding:0;
	border-radius:0.6rem;
	margin:0 0.4rem;
	cursor:pointer;
}

.quest:before{
	content:">Tips";
	font-size:1.0rem;
}

.quest:hover{
	background:#366c96;
}

.checkbox{
	display:flex;
	color:#555;
	justify-content: center;
	margin-bottom:0.8rem;
	margin-top:0.8rem;
}

input.cstm_input[type="checkbox"]{
  display: none;
}

label.cstm_checkbox{
  position:relative;
  cursor:pointer;
  padding-top:0.2rem;
}

label.cstm_checkbox span{
  padding-left:1.0rem;
  cursor:pointer;
  margin-right:1.0rem;
  margin-left:1.0rem;
}

label.cstm_checkbox span:before{
  content:"";
  border:2px dotted #CCC;
  border-radius:0.2rem;
  background: #fff;
  width:1.4rem;
  height:1.4rem;
  position:absolute;
  top:0px;
  left:0px;
  display:inline-block;
  margin-right:0.8rem;
  transition-duration:0.25s;
  cursor:pointer;
  font-size:1.0rem;
}

input.cstm_input[type="checkbox"]:checked + span:before{
  color: #FFF;
  background: #FFF;
  border:3px solid #3ca;
  transform: rotate(90deg);
}
label.cstm_checkbox span:after{
  content:"";
  border-bottom:4px solid #333;
  border-right:4px solid #333;
  width:0.8rem;
  height:1.2rem;
  position:absolute;
  top:-0.1rem;
  left:0.3rem;
  display:inline-block;
  cursor:pointer;
  transform: rotate(0deg);
  transition-duration:0.25s;
  opacity:0;
}

input.cstm_input[type="checkbox"]:checked + span:after{
  content:"";
  border-bottom:4px solid #333;
  border-right:4px solid #333;
  width:0.8rem;
  height:1.2rem;
  cursor:pointer;
  transform: rotate(45deg);
  opacity:1;
}

.ads01{
	display:block;
	width:90%;
	height:6rem !important;
	margin:0.6rem auto;
	background:#FFF;
}

.ads02{
	display:block;
	width:90%;
	height:10rem !important;
	margin:0.6rem auto;
	background:#FFF;
}

.footer_sns img{
	height:3.6rem;
	margin-top:1.0rem;
}

.mng_cont h3, .mng_cont div, .mng_cont input{
	display:block;
	width:768px;
	margin-left:auto;
	margin-right:auto;
	margin-top:1.0rem;
	margin-bottom:0.6rem;
}

@media screen and (max-width: 768px) {
	.mng_cont h3{
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}
	.mng_cont div, .mng_cont input{
		width:96%;
		margin-left:auto;
		margin-right:auto;
	}
}

.mng_btn{
	padding: 0.4rem 0.6rem;
	border-radius:0.2rem;
	white-space:nowrap;
}

.mng_snsbtn{
	position:relative;
	padding: 0.4rem 0.6rem 0.4rem 0.4rem;
	border-radius:0.2rem;
	white-space:nowrap;
	margin-left:0.5rem;
	margin-top:1.0rem;
	margin-bottom:0.6rem;
}

.mng_snsbtn img{
	height:1.4rem;
	/*position:absolute;
	left:0.4rem;*/
	display:inline-block;
	vertical-align: text-bottom;
	margin-right:0.2rem;
}

.mng_snsbtn span{
	display:inline-block;
}

.mng_cont .sharebtns{
	position:relative;
	line-height:2.6rem;
}

.bg_tw{
	background:#1d9bf0;
}
.bg_fb{
	background:#1877f2;
}
.bg_ln{
	background:#00b900;
}
.bg_wa{
	background:#25d366;
}

.white_box{
	position:relative;
	display:inline-block;
	box-sizing:border-box;
	padding:0.6rem 0.6rem;
	margin:0;
	background:rgba(255,255,255,0.65);
	border:2px solid #CCC;
	border-radius:0.2rem;
}
.white_box input{
	width:100%;
}

.gray_line{
	position:relative;
	display:inline-block;
	width:100%;
	height:1px;
	background:#CCC;
	border-bottom:1px solid #999;
	margin:0.4rem 0 0.4rem 0;
	padding:0;
}

#inst_msg{
	position:fixed;
	display:inline-block;
	width:100%;
	height:2.4rem;
	bottom:0;
	left:0;
	background:#FFF;
	color:#3ca;
	font-size:1.6rem;
	text-align:center;
	line-height:2.4rem;
	z-index:500;
}

#log_msg{
	position:fixed;
	display:inline-block;
	width:100%;
	height:2.4rem;
	top:3.8rem;
	left:0;
	background:#FFF;
	color:#3ca;
	font-size:1.6rem;
	text-align:center;
	line-height:2.4rem;
	z-index:500;
}

.p_board{
	display: inline-block;
    position: relative;
    overflow: hidden;
	box-sizing:border-box;
    height: auto;
    width: calc(100% - 0.8rem);
    margin: 1.0rem 0.4rem;
    padding: 1rem;
    border: 2px solid #ccc;
    //background: #aaa;
    background: linear-gradient(to bottom, #57799c, #4c505c);
    background: -moz-linear-gradient(top, #57799c, #4c505c);
    background: -webkit-linear-gradient(top, #57799c, #4c505c);
    border-radius: 6px;
    box-shadow: 4px 4px 10px rgb(0 0 0 / 50%) inset;
}

.p_box{
	position:relative;
	display:inline-block;
	width:calc( (100% / 3) - 0.8rem );
	height:auto;
	background:#FAFAFA;
	box-sizing:border-box;
	padding:0.8rem;
	margin:1.0rem 0.4rem;
	border:3px solid #3ca;
	border-radius:0.2rem;
}
.mylist .p_box{
	width:100%;
}
@media screen and (max-width: 1599px) {
	.p_box{
		width:calc( 50% - 0.8rem );
	}
	.mylist .p_box{
		width:100%;
	}
}
@media screen and (max-width: 1080px) {
	.p_box{
		width:100%;
		margin:0.6rem 0rem;
	}
	.mylist .p_box{
		width:100%;
	}
}

.p_box .p_pd_box{
	display:flex;
	display: -webkit-flex;
}

.p_box .p_dates{
	display:inline-block;
	width:75%;
}

.p_box .pic_box{
	position:relative;
	display:inline-block;
	width:15%;
	padding-top:15%;
	margin:0 5%;
	background: #FFF;
    border-radius: 0.6rem;
}

.p_box .pic_box_a{
	position:relative;
	display:inline-block;
	width:15%;
	padding-top:15%;
	margin:0 42.5%;
	background: #FFF;
    border-radius: 0.6rem;
}

@media screen and (max-width: 1080px) {
	.p_box .p_pd_box{
		display:inline-block;
		width:100%;
	}
	
	.p_box .p_dates{
		width:100%;
	}
	.p_box .pic_box, .p_box .pic_box_a{
		width:5rem;
		padding-top:5rem;
		margin-left:calc(50% - 2.5rem);
	}
}

.p_box .pic_icon{
	position:absolute;
	display:inline-block;
	width:100%;
	top:0;
	bottom:0;
	left:0;
	right:0;
	/*background-image:url("/img/pic_icon.webp");*/
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	padding:0;
	margin:0;
}

.p_title{
	position:relative;
	display:inline-block;
	width:100%;
	height:1.4rem;
	font-size:1.2rem;
	line-height:1.4rem;
	color:#3ca;
	font-weight:600;
	padding:0.4rem 0.2rem;
	margin:0 0 0.2rem 0;
	transition:0.5s;
}
.p_title:hover{
background:#f0f0f0;
}
.p_title:hover:before{
	position:absolute;
	display:inline-block;
	content:"";
	width:100%;
	height:100%;
	top:0;
	left:0;
	border-bottom:2px solid #3ca;
	transition-duration:0.5s;
	animation:gloww 0.3s;
}

.p_disc{
	display:inline-block;
	box-sizing:border-box;
	width:100%;
	height:4.8rem;
	overflow-y:hidden;
	font-size:0.9rem;
	line-height:1.2rem;
	color:#555;
	background:#fff;
	font-weight:400;
	padding:0.6rem 0.4rem;
	margin:0.4rem 0 0.6rem 0;
	border:1px solid #CCC;
	border-radius:0.4rem;
}

.p_date{
	display:block;
	height:1.4rem;
	font-size:0.8rem;
	line-height:1.4rem;
	color:#888;
	white-space:nowrap;
}
.mylist .p_date{
	display:inline-block;
	margin-right:1.4rem;
}

.p_fdtext{
	display:inline-block;
	font-size:1.0rem;
	
}

.p_vstart, .p_vend{
	display:inline-block;
}
@media screen and (max-width: 450px) {
	.p_vstart, .p_vend{
		display:inline-block;
		width:100%;
	}
}
.p_vstart{
	display:inline-block;
	margin-right:1.8rem;
}

.p_num{
	display:inline-block;
	box-sizing:border-box;
	font-size:0.9rem;
	color:#fff;
	background:#3ca;
	border:1px solid #fff;
	padding:0.2rem 1.0rem;
	margin:0.4rem 0;
}
.p_num b{
	font-size:1.1rem;
	
}
@media screen and (max-width: 768px) {
	.p_num{
		padding:0.2rem 0.5rem;
	}
}

.p_num.my_stars{
	background:transparent;!important;
	border:none;
}

.p_tags{
	display:inline-block;
	width:100%;
	font-size:0.9rem;
	color:#888;
	line-height:1.2rem;
	text-align:right;
}

.p_tags a{
	text-decoration:none;
	color:#888;
	transition:0.5s;
}
.p_tags a:hover{
	color:#555;
}

#fi_box{
	position:fixed;
	display:block;
	width:60%;
	height:80%;
	top:10%;
	left:20%;
	background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
	border-radius:6px;
	margin:0;
	padding:0.6rem;
	box-shadow:4px 4px 16px rgba(0,0,0,0.5);
	z-index:210;
	overflow-x:hidden;
	overflow-y:scroll;
}
@media screen and (max-width: 769px) {
	#fi_box{
		width:calc(96% - 1.2rem);
		left:2%;
	}
}

#fi_title{
	display: inline-block;
    width: 100%;
    color: #FFF;
    font-size: 1.2rem;
    font-weight: 600;
    padding: 0.4rem 0.2rem;
}

#fi_name{
	display: inline-block;
    width: 100%;
    font-size: 0.9rem;
    background: #FFF;
    padding: 0.2rem 0.6rem;
    box-sizing: border-box;
    border-radius: 0.4rem;
    border: 2px solid #ccc;
}

#fi_disc{
	display: inline-block;
    width: 100%;
    font-size: 0.9rem;
	line-height:1.6rem;
    background: #FFF;
    padding: 0.2rem 0.6rem;
	margin-top: 0.4rem;
    box-sizing: border-box;
    border-radius: 0.4rem;
    border: 2px solid #ccc;
}

#fi_pic{
	display:relative;
	display:inline-block;
	width:100%;
	padding:0.4rem 0;
	box-sizing:border-box;
	text-align:center;
}
#fi_file{
	display:relative;
	display:inline-block;
	max-height: 8rem;
	padding:0;
	box-sizing:border-box;
	cursor:pointer;
	border-radius:0.8rem;
}

#fi_dbox{
	display: inline-block;
    width: 100%;
    font-size: 0.9rem;
	line-height:1.6rem;
    background: #FFF;
    padding: 0.2rem 0.6rem;
	margin-top: 0.4rem;
    box-sizing: border-box;
    border-radius: 0.4rem;
    border: 2px solid #ccc;
}

#fi_dbox{
	display:inline-block;
	width:100%;
	box-sizing: border-box;
	padding:0.6rem 0;
}

.page_sel{
	position:relative;
	display:inline-flex;
	width: 100%;
    text-align: center;
    justify-content: center;
}

.page_num{
	position: relative;
    display: inline-block;
    font-size: 1.2rem;
	height: 2.4em;
    line-height: 2.4em;
    color: #FFF;
    background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
    padding: 0 0.6rem;
    margin: 0 0.2em;
    transition: 0.5s;
    cursor: pointer;
    text-decoration: none;
    border-radius: 0.3rem;
	box-sizing:border-box;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:1px 1px 3px rgba(0,0,0,0.5);
	box-sizing:border-box;
}
.page_num.now{
	background: #fff;
	color: #3ca;
}

.page_num:hover{
	color:#3ca;
	background:#FFF;
	box-shadow:16px 16px 14px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0);
}
.page_num:hover::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:100%;
	height:100%;
	border-radius:0.3rem;
	top:0;
	left:0;
	border:2px solid #3ca;
	animation:fadein 1.0s;
}

@media screen and (max-width: 768px) {
	.page_num{
		font-size: 1.0rem;
		padding: 0 0.5rem;
		line-height: 2.4rem;
	}
}

.page_next, .page_prev{
	position: relative;
    display: inline-block;
    box-sizing: border-box;
    width: 2.4rem;
    height: 2.4em;
    font-size: 1.2em;
    line-height: 2.4em;
    background: linear-gradient(to bottom, #3ca, #c6ff6b);
	background: -moz-linear-gradient(top, #3ca, #c6ff6b);
	background: -webkit-linear-gradient(top, #3ca, #c6ff6b);
    color: #FFF;
	font-weight:800;
	padding:0 0.6rem;
    margin: 0 0.2em;
    transition: 0.5s;
    cursor: pointer;
	text-decoration: none;
    border-radius: 0.3rem;
	box-shadow:4px 4px 10px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0.5);
	box-sizing:border-box;
}

.page_next:hover, .page_prev:hover{
	color:#3ca;
	background:#FFF;
	box-shadow:16px 16px 14px rgba(0,0,0,0.16);
	text-shadow:2px 2px 3px rgba(0,0,0,0);
}
.page_next:hover::before, .page_prev:hover::before{
	position:absolute;
	display:inline-block;
	box-sizing:border-box;
	content:"";
	width:100%;
	height:100%;
	border-radius:0.3rem;
	top:0;
	left:0;
	border:2px solid #3ca;
	animation:fadein 1.0s;
}

@media screen and (max-width: 768px) {
	.page_next, .page_prev{
		width: 2.4rem;
		height: 2.4em;
		font-size: 1.0em;
		line-height: 2.4em;
		padding:0rem 0.2rem;
	}
}

.search{
	position:relative;
}

.search .searchbox{
	position:relative;
	margin:0;
	padding:0.8rem 0.6rem;
	box-sizing:border-box;
}

.search .searchbtn{
	position:absolute;
	display:inline-block;
	width:2.8rem;
	height:2.8rem;
	top:0;
	right:0;
	transition:0.5s;
}

.searchbtn::before {
  position: absolute;
  content: '';
  width: 15px;
  height: 15px;
  top: calc(50% - 9px);
  left: calc(50% - 9px);
  border-radius: 50%;
  box-shadow: 0 0 0 3px #555;
  transition:0.5s;
}
.searchbtn::after {
  position: absolute;
  content: '';
  width: 8px;
  height: 6px;
  top: calc(50% + 6px);
  left: calc(50% + 2px);
  border-top: solid 3px #555;
  transform: rotate(45deg);
  transition:0.5s;
}

.searchbtn:hover::after {
	border-color:#3ca;
}
.searchbtn:hover::before{
	box-shadow: 0 0 0 3px #3ca;
}

#tagsearch{
	display:inline-block;
	width:100%;
	box-sizing:border-box;
	background:#FFF;
	border:2px solid #AAA;
	border-radius:0.4rem;
	overflow:hidden;
	padding:0 0.6rem 0.6rem 0.6rem;
	transition:0.5s;
}
#tagsearch.opened{
	height:fit-content!important;
	transition:0.5s;
}
#tagsearch.closed{
	height:2.2rem!important;
	transition:0.5s;
}

#tstitle{
	display:inline-block;
	width:100%;
	border-bottom:1px solid #3ca;
	margin-bottom:0.4rem;
	transition:0.5s;
}

.sfinfo{
	position:absolute;
	display:inline-block;
	right:0.4rem;
	bottom:0.4rem;
}

#tagsearch h4{
    margin: 0.4rem 0;
    border-bottom: 2px solid #3ca;
}

.mp_sort{
	float:right;
}

#pm{
	font-weight:600;
	color:#666;
}

.terms ol{
	line-height:1.8rem;
}
.terms li{
	padding-left: 0.4rem;
}

repbox{
	position:fixed;
	width:400px;
	max-width:480px;
	min-width:240px;
	height:72%;
	background:#FFF;
	z-index:550;
	bottom:0;
	right:0;
	box-sizing:border-box;
	padding:0.6rem;
	border-radius:0.5rem 0 0 0;
	overflow-y:auto;
	overflow-x:hidden;
}

repbox h2{
	width: 100%;
    margin: 0.4rem 0 1rem 0.4rem;
    padding: 0.2rem;
    font-size: 1.4rem;
}
repbox h2:before{
	height:5rem;
	background-repeat:no-repeat;
}

repbox textarea{
	height:10rem;
}

@media screen and (max-width: 399px) {
	repbox{
		width:100%;
		height:80%;
	}
}

repbtn{
	position:fixed;
	right:0.6rem;
	bottom:0.6rem;
	color: #FFF;
    display: inline-block;
    padding: 0.2rem 1rem;
    box-sizing: border-box;
    font-size: 1.0rem;
    border-radius: 1.4rem;
	background: linear-gradient(to bottom, #38c, #05fabd)!important;
	background: -moz-linear-gradient(top, #38c, #05fabd)!important;
	background: -webkit-linear-gradient(top, #38c, #05fabd)!important;
	opacity:0.5;
	transition:0.5s;
}

repbtn:hover{
	opacity:1.0;
}

.list_table td{
	font-size:0.8rem;
}

koukai{
	margin-left: 0.4rem;
    color: #e49;
    font-size: 0.9rem;
}

.twitter_login {
    box-sizing: border-box;
    padding: 0.5rem 2rem 0.5rem 1rem;
    background-color: #1b95e0;
    font-size: 1.0rem;
    color: #fff;
    border-radius: 0.4rem;
    text-decoration: none;
}

.twitter_login i {
    position: relative;
    top: 0.3rem;
    display: inline-block;
    width: 1.4rem;
    height: 1.4rem;
    margin-right: 1rem;
    background: transparent 0 0 no-repeat;
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2072%2072%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h72v72H0z%22%2F%3E%3Cpath%20class%3D%22icon%22%20fill%3D%22%23fff%22%20d%3D%22M68.812%2015.14c-2.348%201.04-4.87%201.744-7.52%202.06%202.704-1.62%204.78-4.186%205.757-7.243-2.53%201.5-5.33%202.592-8.314%203.176C56.35%2010.59%2052.948%209%2049.182%209c-7.23%200-13.092%205.86-13.092%2013.093%200%201.026.118%202.02.338%202.98C25.543%2024.527%2015.9%2019.318%209.44%2011.396c-1.125%201.936-1.77%204.184-1.77%206.58%200%204.543%202.312%208.552%205.824%2010.9-2.146-.07-4.165-.658-5.93-1.64-.002.056-.002.11-.002.163%200%206.345%204.513%2011.638%2010.504%2012.84-1.1.298-2.256.457-3.45.457-.845%200-1.666-.078-2.464-.23%201.667%205.2%206.5%208.985%2012.23%209.09-4.482%203.51-10.13%205.605-16.26%205.605-1.055%200-2.096-.06-3.122-.184%205.794%203.717%2012.676%205.882%2020.067%205.882%2024.083%200%2037.25-19.95%2037.25-37.25%200-.565-.013-1.133-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E);
}

.top_slide{
	position:absolute;
	width:100%;
	height:100%;
	left:0;
}

#whatsnewbox{
	position: fixed;
	box-sizing: border-box;
    width: 60%;
    height: 60%;
    top: 20%;
    left: 20%;
    background: #FFF;
    z-index: 600;
    overflow: hidden;
    border: 2px solid #3ca;
    border-radius: 1.2rem;
}

@media screen and (max-width: 769px) {
	#whatsnewbox{
		width: 100%;
		height: 80%;
		top: 10%;
		left: 0;
	}
}

#whatsnewbox table{
	position: relative;
    display: table;
    width: 90%;
    height: 70%;
    margin: 0 5%;
    background: #FFF;
    overflow-y: auto;
	padding: 0;
	font-size:0.9rem;
}

@media screen and (max-width: 769px) {
	#whatsnewbox table{
		height: 80%;
	}
}

#whatsnewbox table tr{
	display: inline-block;
    width: 100%;
    height: 4rem;
    border-bottom: 1px solid #3ca;
    padding: 0;
    margin: 0;
}
#whatsnewbox table tr.onlink{
	cursor:pointer;
}
#whatsnewbox table tr.onlink::after {
    position: absolute;
    content: "＞";
    line-height: 4rem;
    right: 0.6rem;
    font-weight: 600;
    color: #888;
}

#whatsnewbox table tr:hover{
	background:#efefef;
}

#whatsnewbox table tr td, #whatsnewbox table tr th{
	display: inline;
	padding: 0 0.4rem;
	margin: 0;
	line-height:4rem;
	background:transparent;
	color:#474747;
	text-shadow:none;
}
#whatsnewbox table tr th{
	font-weight:600;
	padding-right:2rem;
	color:#3ca;
}

@media screen and (max-width: 769px) {
	#whatsnewbox table tr{
		height:4.4rem;
	}
	
	#whatsnewbox table tr td, #whatsnewbox table tr th{
		display: inline-block;
		line-height: 1.4rem;
	}
}

#closenewbox{
	position:absolute;
	display:block;
	width:3rem;
	height:3rem;
	top:0.5rem;
	right:0.5rem;
	background:#ccc;
	border-radius:4px;
	box-shadow:2px 2px 8px rgba(0,0,0,0.35);
	cursor:pointer;
	transition:0.5s;
	z-index:601;
}

@media screen and (max-width: 769px) {
	#closenewbox{
		position:fixed;
		top:10%;
		right:2.5%;
	}
}

#closenewbox:hover{
	background:#aaa;
}
#closenewbox:before{
	position:absolute;
	display:block;
	content:"";
	border-left:4px solid #fff;
	width:3rem;
	height:3rem;
	top:1.1rem;
	left:1.0rem;
	transform:rotate(45deg);
}

#closenewbox:after{
	position:absolute;
	display:block;
	content:"";
	border-left:4px solid #fff;
	width:3rem;
	height:3rem;
	top:-1.0rem;
	left:1.0rem;
	transform:rotate(-45deg);
}

#sel_cr_form{
	position:fixed;
	display:inline-block;
	width:100%;
	height:60%;
	top:20%;
	left:0;
	border-radius:0.4rem;
	z-index:801;
	box-shadow:4px 4px 30px rgba(0,0,0,0.5);
}

@media screen and (min-width: 768px) {
	#sel_cr_form{
		max-width:768px;
		margin-left:50%;
		height:40%;
		top:30%;
		transform:translateX(-50%);
	}
}

#sel_cr_form h4{
	display:inline-block;
	width:100%;
	height:2.4rem;
	text-align:center;
	color:#FFF;
	font-size:1.3rem;
	line-height:2.4rem;
	margin:0;
	padding:0;
}

#sel_cr_form div{
	display:inline-block;
	box-sizing:border-box;
	top:2.4rem;
	width:46%;
	height:calc(100% - 2.4rem - 4rem);
	margin:0 1.6%;
	text-align:center;
	background:#FFF;
	border-radius:6px;
}

#sel_cr_form div.first{
	position:absolute;
	top:2.4rem;
	left:2%;
}

#sel_cr_form div.second{
	position:absolute;
	top:2.4rem;
	left:50%;
}

#sel_cr_form div p{
	font-size:1.8vh;
	padding:0;
	margin:0;
}

#sel_cr_form #close_sel_cr_form{
	position:absolute;
	bottom:0.4rem;
	left:50%;
	transform:translateX(-50%);
}

ston1{
	position:relative;
	display:inline-block;
	width:1.0rem;
	height:1.0rem;
	background-image:url("/img/star-on.svg");
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
}
ston2{
	position:relative;
	display:inline-block;
	width:2.0rem;
	height:1.0rem;
	background-image:url("/img/star-on.svg");
	background-position:left;
	background-repeat:repeat-x;
	background-size:contain;
}
ston3{
	position:relative;
	display:inline-block;
	width:3.0rem;
	height:1.0rem;
	background-image:url("/img/star-on.svg");
	background-position:left;
	background-repeat:repeat-x;
	background-size:contain;
}
stoff1{
	position:relative;
	display:inline-block;
	width:1.0rem;
	height:1.0rem;
	background-image:url("/img/star-off.svg");
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
}
stoff2{
	position:relative;
	display:inline-block;
	width:2.0rem;
	height:1.0rem;
	background-image:url("/img/star-off.svg");
	background-position:left;
	background-repeat:repeat-x;
	background-size:contain;
}
stoff3{
	position:relative;
	display:inline-block;
	width:3.0rem;
	height:1.0rem;
	background-image:url("/img/star-off.svg");
	background-position:left;
	background-repeat:repeat-x;
	background-size:contain;
}