@charset "utf-8";

/* 共通 */
h1,h2,h3,h4,h5,p,a,input,div,table,th,td {
  margin: 0 auto;
  text-align: center;
	color: #333;
}
ul {
	list-style: none;
}
body{
	margin: 0;
}
main{
	margin: 100px 0 60px;
}
.inner {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
}
h2{
	font-size: 60px;
	line-height: 4rem;
	color: rgba(143,195,31,0.2);
	position: relative;
	margin-bottom: 20px;
}
h2 span{
	font-size: 24px;
	color: #009a3e;
	position: absolute;
	width: 100%;
	left: 0;
}
@media(max-width:767px) {
	h2 {
		font-size: 57px;
	}
}
a{
	text-decoration: none;
}
input[type="submit"]{
	-webkit-appearance: none;
}	

.btn_1{
	-webkit-appearance: none;
	border-radius: 0;
	display: block;
	font-size: 20px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	background: #009a3e;
	border: none;
	width: 80%;
	max-width: 500px;
	padding: 10px 0;
	margin: 20px auto;
}
.btn_1:hover{
	border: 2px solid #009a3e;
	background: #fff;
	color: #009a3e;
	transition: .6s ease;
}
.btn_2{
	-webkit-appearance: none;
	border-radius: 0;
	display: block;
	font-size: 20px;
	font-weight: bold;
	text-decoration: none;
	color: #009a3e;
	background: #fff;
	border: 2px solid #009a3e;
	width: 80%;
	max-width: 500px;
	padding: 10px 0;
	margin: 20px auto;
}
.btn_2:hover{
	background: #009a3e;
	color: #fff;
	transition: .6s ease;
}
form{
	margin: 50px auto;
	width: 90%;
}
form label{
	-webkit-appearance: none;
	border-radius: 0;
	display: block;	
	text-align: left;
}
form input[type="text"],
form input[type="password"]{
	display: block;	
	font-size: 16px;
	text-align: left;
	width: 100%;
	margin: 10px auto 20px auto;
	-webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#img-qr {
  margin:10px auto;
}
.image_flame{
	margin: 30px 0;
}
.image{
	width: 80%;
    height: 80%;
    display: block;
    object-fit: contain;
    margin: auto;
}
.sp{
	display: none;
}
.pc{
	display: block;
}
@media(max-width:767px) {
	form input[type="text"],
	form input[type="password"]{
		font-size: 15px;
	}
	.inner {
	width: 96%;
	}
	.sp{
		display: block;
	}
	.pc{
		display: none;
	}
}
/* ヘッダー */
header{
	background: rgba(255,255,255,0.8);
	width: 100%;
	height: 60px;
	position: fixed;
	top: 0;
	z-index: 1500;
}
header img{
	width: 24%;
	margin: 10px 0;
	float: left;
}
header form{
	margin: 0;
}
header form input[type="submit"]{
	-webkit-appearance: none;
	border-radius: 0;
	color: #fff;
	font-weight: bold;
	background: #dae000;
	border: none;
	padding: 10px;
	position: absolute;
	top: 17%;
    right: 3%;
}
@media(max-width:767px){
	header img{
		width: 60%;
		margin-left: 5px;
	}
}
/* フッター */
footer small{
	display: block;
	color: #fff;
	text-align: center;
	background: #8fc31f;
	padding: 3px 0;
}
footer small a{
	color: #fff;
}
/* トップページ */
#top_page main img{
	width: 20%;
	display: block;
	margin: 80px auto;
}
@media(max-width:767px){
	#top_page main img{
		width: 60%;
	}
}
/* 会員登録ページ */
#form_page form p, #reform{
	color: #fff;
	font-weight: bold;
	background: #8fc31f;
	padding: 5px 0;
	margin: 30px 0 20px;
}
/* 管理者ページ */
#admin_page #user{
	font-size: 20px;
	font-weight: bold;
}
#admin_page main .inner{
	margin: 30px auto;
}
#admin_page h3{
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	background: #8fc31f;
	margin: 0 0 40px;
	padding: 10px 0;
}
/* 管理者ページ内掲示板 */
#admin_page .news_content .scroll {
  overflow-y:scroll;
  height: 140px;
  border:1px solid #666;
  width: 90%;
	background-color: #feffe5;
	padding-top: 3px;
}
#admin_page .news_content .scroll table {
	width: 98%;
}
#admin_page .news_content .scroll .t_left {
	padding-top: 3px;
	padding-bottom: 3px;
  width: 20%;
	font-size: 16px;
	color: rgba(0,154,62,0.7);
	text-align: left;
}
#admin_page .news_content .scroll .t_center {
	padding-top: 3px;
	padding-bottom: 3px;
	width: 60%;
}
#admin_page .news_content .scroll .t_center textarea {
	width: 98%;
	vertical-align: middle;
	height: 30px;

}
#admin_page .news_content .scroll .t_right {
	padding-top: 3px;
	padding-bottom: 3px;
	width: 20%;
}
#admin_page .news_content .scroll .t_right input {
	border: 1px solid #009a3e;
	border-radius: 1px;
	background: #fff;
	padding-top: 3px;
	padding-bottom: 3px;
	color: #009a3e;
	font-weight: bold;
}
#admin_page .news_content .scroll .t_area {
	width: 80%;
	color: #666;
}

@media(max-width:767px) {
	#admin_page .news_content .scroll {
		width: 100%;
	}
	#admin_page .news_content .scroll .t_left {
		font-size: 13px;
	}
	#admin_page .news_content .scroll .t_center textarea {
		height: 45px;
	}
	
}
/* ↓#admin_page .news_content label */
.label {
	display: block;
	margin: 15px 0 0;
	text-align: center;
}
#admin_page .news_content .btns input[type="submit"]{
	background: #fff;
	margin-bottom: 0;
}
/* 管理者ページ内クーポン */
#admin_page .coupon_content .coupon{
	position: relative;
	width: 98%;
	max-width: 400px;
	/* height: 95%; */
	background: #8fc31f;
	filter: drop-shadow(0 2px 4px rgba(0,0,0,0.8));
	padding: 20px 0;
}
#admin_page .coupon_content .coupon::before,
#admin_page .coupon_content .coupon::after{
	height: 20px;
	content: '';
	position: absolute;
	left: 0;
	width: 100%;
}
#admin_page .coupon_content .coupon::before{
	top: -20px;
	background: linear-gradient(45deg,#8fc31f 10px,transparent 0),linear-gradient(315deg, #8fc31f 10px,transparent 0);
	background-size: 20px 20px;
}
#admin_page .coupon_content .coupon::after{
	bottom: -20px;
	background: linear-gradient(135deg,#8fc31f 10px,transparent 0),linear-gradient(225deg, #8fc31f 10px,transparent 0);
	background-size: 20px 20px;
}
#admin_page .coupon_content .inline {
  margin: auto;
  width: 90%;
  background: url("../img/bg_01.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  padding: 10px 0;
}
#admin_page .coupon_content .image_flame {
  width: 35%;
  height: 80px;
  margin: 10px auto;
}
#admin_page .coupon_content .image {
  width: 100px;
  height: 100px;
  display:block;
  object-fit: contain;
  margin:auto;
}
#admin_page .coupon_content .top_label {
  margin: 30px auto 10px auto;
}
#admin_page .coupon_content .top_label p {
  font-weight: bold;
}
#admin_page .coupon_content .bottom_label {
  margin:10px auto;
}
#admin_page .coupon_content .bottom_label p {
  font-size: 14px;
}
#admin_page .coupon_content .btns {
  margin:40px auto;
  text-align:center;
}
#admin_page .coupon_content .btns a {
  color: #009a3e;
  font-weight: bold;
  text-decoration: none;
  border: 2px solid #009a3e;
  padding: 5px 20px;
  margin: 0 10px;
}
#admin_page .jobs .btns {
	margin-bottom: 40px;
}
#admin_page .jobs .btns a {
  color: #009a3e;
  font-weight: bold;
  text-decoration: none;
  border: 2px solid #009a3e;
  padding: 5px 20px;
  margin: 0 10px;
}
#admin_page .coupon_content .btns #create_btn {
  padding: 5px 0;
  margin: 0 auto;
}
#create_btn:hover {
	color: #fff;
}

/* 管理者ページ内スタッフ管理 */
#admin_page .staff_content table {
	width: 100%;

}


#admin_page .staff_content table,
#admin_page .staff_content th,
#admin_page .staff_content td{
	color: #444;
	border: 1px solid #444; 
	border-collapse: collapse;
}
#admin_page .staff_table th, 
#admin_page .staff_table td {
	padding-top: 4px;
	padding-bottom: 4px;
}
.staff_table form {
	margin: 0 auto;
}
#admin_page .staff_content input[name="delete"] {
	border: none;
	background-color: #009a3e;
	color: #fff;

}

/*QR表示ページ*/
#qr_page .top_label{
	margin-bottom: 30px;
}
#qr_page .top_label p{
	font-weight: bold;
}
.snss {
  width: 25%;
  margin: 50px auto 20px auto;
  justify-content: center;
}
.sns {
  /* width: 30%; */
  margin: 0 auto;
}
@media(max-width:767px) {
 .snss {
   width: 90%;
 } 
}
.fb-share-button {
  vertical-align: top;
}
.write {
  width: 69%;
  height: 100px;
}
@media(max-width:767px) {
  .write {
    width: 95%;
  }
}
/*QRコード作成ページ*/
#qrcreate_page form{
	margin: 30px auto;
}

/* qr.phpURLコピーボタン */
.mail {
	margin-bottom: 8px;
}
.btn_long {
	border: none;
	border-radius:4px; 
	padding: 2.5px 9px;
	color: #fff;
	background-color: #009a3e;
	font-weight: bold;
	font-size: 16px;
}

#setting h3 {
	margin: 20px auto;
	font-size: 16px;
}
#setting h4 {
	color: rgb(238, 146, 26);
	font-weight: bold;
	margin-top: 10px;
}
#setting p {
	font-size: 14px;
}
#setting form {
	margin: 50px auto;
}
#setting table {
	width: 45%;
	margin: 30px auto;
	border-collapse: collapse;
}
#setting th, #setting td {
	border: none;
	padding: 2px 4px;
}
#setting .td_btn {
	padding: 0;
}
#setting .td_btn input {
	border: 1px solid #009a3e;
	border-radius: 1px;
	background: none;
	padding: 3px auto;
	width: 70%;
	color: #009a3e;
	font-weight: bold;
	/* b4da63 */
}
#setting .td_btn #input_no {
	border: 1px solid #8fc31f;
	color: #8fc31f;
}
@media(max-width:767px) {
	#setting table {
		width: 90%;
	}
}
input[name="map_list"],
input[name="tel_list"], 
input[name="url_list"],
input[name="point_list"] {
	border: 1px solid #009a3e;
	border-radius: 1px;
	background: none;
	padding-top: 3px;
	padding-bottom: 3px;
	width: 20%;
	color: #009a3e;
	font-weight: bold;
}
@media(max-width:767px) {
	input[name="tel_list"], input[name="url_list"],
	input[name="point_list"] {
		width: 40%;
	}
}

.space_10 {
	width: 100%;
	height: 10px;
}
.space_30 {
	width: 100%;
	height: 30px;
}
.space_100 {
	width: 100%;
	height: 100px;
}


.caution {
	margin: 30px auto 10px auto;
}

.caution p {
	color: rgb(238, 146, 26);
	font-weight: bold;
}

.follow_message {
	margin-top: 40px;
	margin-bottom: 40px;
}
.follow_message p {
	font-size: 16px;
}
.follow_message span {
	font-size: 18px;
	color: rgb(238, 146, 26);
}
.grant_flame {
	margin-top: 50px;
	width: 40%;
	padding-top: 10px;
	padding-bottom: 20px;
	background-color: rgb(240, 255, 233);
}
.grant_flame .caution {
	margin: 10px auto;
}
@media(max-width:767px) {
	.follow_message p {
		font-size: 14px;
	}
	.follow_message span {
		font-size: 17px;
	}
		.grant_flame {
		width: 100%;
	}
}

.inquiry {
	color: #777;
}

.section {
	margin-bottom: 20px;
}
.section p {
	margin-bottom: 10px;
}

@media(max-width:767px) {
	.create_coupon {
		width: 100%;
	}
}

#store_address {
	display: block;
	margin-top: 50px;
}
#qr_map {
	display: block;
	margin: 10px auto 20px auto;
	width: 50%;
	height: 350px;
}
@media(max-width:767px) {
	#qr_map {
		width: 100%;
		height: 300px;
	}
}

.select_ground {
	width: 38%;
	display: flex;
	justify-content: space-between;
}
@media(max-width:767px) {
	.select_ground {
		width: 94%;
	}
}
.selection image {
	width: 100%;
	height: 100px;
}

#admin_page .coupon_content .btns #btn2 {
	margin: 0 auto;
	padding: 10px 0;
}
#forget {
  cursor: pointer;
}
.switch {
	text-align: center;
}
.switch a {
	cursor: pointer;
	background: rgb(238, 146, 26);
	color: #fff;
	padding: 2px 6px;
}
.job {
	width: 70%;
	margin: 0 auto 30px;
	border: 1px solid #aaa;
  background: none;
  padding: 0;
	/* background: #f6f8ef; */
}
.confirm .job {
	border: none;
}
.job table {
	width: 99%;
}
.job table th {
	text-align: left;
}
.job .cell th,
.job .cell td {
	border: 1px solid #fff;
	border-collapse: collapse;
}
.job .cell td input, 
.job .cell td textarea {
	border: 1px solid #bbb;
}
.job .cell th {
	background: #a9d54c;
	color: #fff;
}
.job .cell td {
	padding-left: 1%;
	padding-right: 1%;
	background: #e9f3d1;
}
.job .cell .k_form {
	padding-top: 5px;
	padding-bottom: 5px;
}
.job textarea {
	width: 98%;
}
.job th {
	font-size: 15px;
	padding-left: 1%;
}
.job td {
	width: 75%;
	font-size: 15px;
	text-align: left;
}
@media(max-width:767px) {
	.job {
		width: 100%;
	}
	.job th {
		font-size: 13px;
	}
	.job td {
		font-size: 13px;
	}	
}
#type1 {
	margin-top: 10px;
}
#type2 {
	margin-top: 10px;
	display: none;
}
.image2 {
	width: 50%;
    height: 50%;
    display: block;
    object-fit: contain;
    margin: 0 auto 5px;
}
.job h4 {
	margin: 5px auto;
	color: #555;
}
.job_format {
	margin-bottom: 10px;
}
.numbering {
	color: #666;
}
.application {
	display: block;
	margin: 20px auto;
	width: 45%;
	background: #a9d54c;
	color: #fff;
	padding-top: 5px;
	padding-bottom: 5px;
	border: none;
	cursor: pointer;
}
.job_explain {
	font-size: 14px;
}
.confirm hr {
	margin-bottom: 30px;
}
.job_hr {
	height: 1px;
	background-color: #8fc31f;
	border: none;
}
form .job input[type="text"] {
	margin: 10px auto;
}
form .job textarea {
	margin: 5px auto 0;
}
.for_mail {
	border: none;
}
.app_alert a {
	font-weight: bold;
	font-size: 17px;
	color: rgb(247, 125, 25);
	cursor: pointer;
	border-bottom: 3px solid rgb(247, 125, 25);
}
.app_alert small {
	background: rgb(251, 255, 233);
	animation: blinkAnime 1.1s infinite alternate;
}
@keyframes blinkAnime{
	0% { color: rgb(110, 165, 9) }
	100% { color: rgb(213, 255, 59)}
}
.app_del {
	display: block;
	margin: 20px auto;
	width: 45%;
	background: rgb(247, 125, 25);
	color: #fff;
	padding-top: 5px;
	padding-bottom: 5px;
	border: none;
	cursor: pointer;
}
.kidoku_chk {
	text-align: left;
	padding-left: 1%;
	margin-bottom: 5px;
}
.midoku {
	background: rgb(247, 125, 25);
	padding: 0 0.5%;
	border: none;
	color: #fff;
	cursor: pointer;
}
.kidoku {
	background: #89bb1d;
	padding: 0 0.5%;
	border: none;
	color: #fff;
	cursor: pointer;
}
.sns_p {
	margin-bottom: 5px;
}