@charset "utf-8";

/*========= layoutcontrol ===============*/
	.boxPd {padding: 20px 10px;}
	.pd10a { padding: 10px;}
	.pd30a { padding: 30px;}
	.pd50a { padding: 50px;}

	.pd10 { padding: 10px 0;}
	.pd20 { padding: 20px 0;}
	.pd30 { padding: 30px 0;}
	.pd50 { padding: 50px 0;}
	.pd80 { padding: 80px 0;}
	.pd100 { padding: 100px 0;}
	.pdTop10 { padding-top: 10px;}
	.pdTop20 { padding-top: 20px;}
	.pdTop30 { padding-top: 30px;}
	.pdTop40 { padding-top: 40px;}
	.pdTop50 { padding-top: 50px;}
	.pdTop80 { padding-top: 80px;}
	.pdTop100 { padding-top: 100px;}
	.pdBtm20 { padding-bottom: 20px;}
	.pdBtm30 { padding-bottom: 30px;}
	.pdBtm50 { padding-bottom: 50px;}
	.pdBtm100 { padding-bottom: 100px	!important;}
	.pdSide40 { padding: 0 40px !important;}

	.mgTop_40 { margin-top: 40px	!important;}
	.mgTop_50 { margin-top: 50px	!important;}
	.mgTop100 { margin-top: 100px	!important;}
	.mgTop200 { margin-top: 200px	!important;}

	.mgBtm_30 { margin-bottom: 30px	!important;}
	.mgBtm_40 { margin-bottom: 40px	!important;}
	.mgBtm_80 { margin-bottom: 80px	!important;}

.pdL10 { padding-left: 10px	!important;;}
.pdL20 { padding-left: 20px	!important;;}
.pdL30 { padding-left: 30px	!important;;}
.pdL40 { padding-left: 40px	!important;;}

.lineheight__10{line-height: 1rem !important;}
.lineheight__15{line-height: 1.5rem !important;}
.lineheight__20{line-height: 2rem !important;}

.sml__txt{ font-size: 0.7rem !important;}
.mid__txt{ font-size: 1.2rem !important;}
.lg__txt{ font-size: 1.6rem !important;}


.bkcol__111 { background: #111;}

.txt__wht { color: #fff !important;}







/*========= 罫線 見出し===============*/
.has-lines {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
			-ms-flex-align: center;
				align-items: center;
		text-align: center;
		-webkit-box-pack: center;
		-webkit-justify-content: center;
			-ms-flex-pack: center;
				justify-content: center;
}
.has-lines:before,
.has-lines:after {
		content: '';
		-webkit-box-flex: 1;
		-webkit-flex-grow: 1;
			-ms-flex-positive: 1;
				flex-grow: 1;
		height: 1px;
		background: #ccc;
		min-width: 20px;
		display: inline-block;
		vertical-align: middle;
}
.has-lines:before {
		margin-right: 20px;
}
.has-lines:after {
		margin-left: 20px;
}

.box{opacity: 0;}









/*========= Youtube レスポンシブ ===============*/
.movie-wrap {
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9*/
	height: 0;
	overflow: hidden;
}
.movie-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}
	.youtubeBlock {
		height: 250px;
	}


/*========= Button ===============*/
.btn{
	position: relative;
	overflow: hidden;
	text-decoration: none;
	display: inline-block;
	padding: 20px 40px;
	text-align: center;
	outline: none;
	transition: ease .2s;
	background-color: #fff;
	border: 1px solid #073e11;
}

.btn span {
		position: relative;
		color:#333;
}

.btn:hover span{
		color:#fff;
}

.bgcenterx:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		z-index: 0;
		background: #073e11;
		width: 100%;
		height: 100%;
		transition: transform .3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
		transform: scale(0, 1);
		transform-origin: top;
}

.bgcenterx:hover:before{
		transform:scale(1, 1);
}



/*========= Loading ===============*/
#splash {
		position: fixed;
		width: 100%;
		height: 100%;
		background: #333;
		z-index: 9999999;
		text-align:center;
		color:#fff;
}

#splash-logo {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
}


.eachTextAnime span{opacity: 0;}
.eachTextAnime.appeartext span
{ animation:text_anime_on 1s ease-out forwards; }
@keyframes text_anime_on {
		0% {opacity:0;}
		100% {opacity:1;}
}




/*枠線が伸びて出現*/
.line{
		position: relative; /* 枠線が書かれる基点*/
}

/*上下線*/
.line::before,
.line::after{
		position: absolute;
		content:"";
		width:0;
		height:1px;
		background:#333;/* 枠線の色*/
}

/*左右線*/
.line2::before,
.line2::after{
		position: absolute;
		content:"";
		width: 1px;
		height:0;
		background:#333;/* 枠線の色*/
}

/*上線*/
.line::before {
	top:0;
	left:0;
	animation: lineAnime .5s linear 0s forwards;/*表示されて0秒後に上線が0.5秒かけて表示*/
}

/*右線*/
.line2::before{
	top:0;
	right:0;
	animation: lineAnime2 .5s linear .5s forwards;/*表示されて0.5秒後に右線が0.5秒かけて表示*/
}

/*下線*/
.line::after {
	bottom:0;
	right:0;
	animation: lineAnime .5s linear 1s forwards;/*表示されて1秒後に下線が0.5秒かけて表示*/
}

/*左線*/
.line2::after{
	bottom:0;
	left:0;
	animation: lineAnime2 .5s linear 1.5s forwards;/*表示されて1.5秒後に左線が0.5秒かけて表示*/
}

@keyframes lineAnime {
	0% {width:0%;}
				100%{width:100%;}
}

@keyframes lineAnime2 {
	0% {height:0%;}
				100%{height:100%;}
}

/*枠線内側の要素*/
.line .lineinappear{
	animation: lineInnerAnime .5s linear 1.5s forwards;/*1.5秒後に中央のエリアが0.5秒かけて表示*/
	opacity: 0;/*初期値を透過0にする*/
}

@keyframes lineInnerAnime{
	0% {opacity:0;}
				100% {opacity:1;}
}





/*========= marker ===============*/
.markerTitle{background:linear-gradient(transparent 75%, #fce439 75%);}
.marker15{background:linear-gradient(transparent 75%, #ff9ece 75%);}
.marker__bold {font-weight: bold;}

/* TOP Information */
ul.list-group { margin-left: 5px !important;}
.list-group a{ color: #333;}
.list-group a:hover{ color: #666;}
.list-group-item {
	list-style: none;
	font-size: 100%;
	line-height: 2em;
}
span.dateToppage,
span.cateListToppage,
span.cateListToppage2{ font-size: 80%;
	/* border: 1px solid #ccc; */
	border-radius: 3px;
	padding: 2px;
}
span.cateListToppage,
span.cateListToppage2{
	background: #333;
	color: #fff;
}
.shopButton {
	margin: 0 0 20px 0;
	padding: 5px;
	text-align: center;
}
span.topShopLink {
	font-size: 100%;
	padding: 12px 50px;
	margin-right: 10px;
	border: 1px solid #333;
	border-radius: 3px;
	background-color: #333;
	color: #fff;
	}


/*========= Loading ===============*/

	/* Loading背景画面設定　*/
	#splash {
					/*fixedで全面に固定*/
			position: fixed;
			width: 100%;
			height: 100%;
			z-index: 99999;
			background:#fff;
			text-align:center;
			color:#fff;
	}

	/* Loading画像中央配置　*/
	#splash_logo {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
	}

	/* Loading アイコンの大きさ設定　*/
	#splash_logo img {
			width:260px;
	}

	/* fadeUpをするアイコンの動き */

	.fadeUp{
	animation-name: fadeUpAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity: 0;
	}

	@keyframes fadeUpAnime{
			from {
					opacity: 0;
			transform: translateY(100px);
			}

			to {
					opacity: 1;
			transform: translateY(0);
			}
	}

@media screen and (min-width:1280px) {
/* TOP Information */
ul.list-group { margin-left: 5px !important;}
.list-group a{ color: #333;}
.list-group a:hover{ color: #666;}
.list-group-item {
	list-style: none;
	font-size: 160%;
	line-height: 2em;
}
span.dateToppage,
span.cateListToppage,
span.cateListToppage2{ font-size: 80%;
	/* border: 1px solid #ccc; */
	border-radius: 3px;
	padding: 2px;
}
span.cateListToppage,
span.cateListToppage2{
	background: #333;
	color: #fff;
}
.shopButton {
	margin: 0 0 20px 0;
	padding: 5px;
	text-align: center;
}
span.topShopLink {
	font-size: 100%;
	padding: 12px 50px;
	margin-right: 10px;
	border: 1px solid #333;
	border-radius: 3px;
	background-color: #333;
	color: #fff;
	}


/*========= Form ===============*/
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family:"Segoe UI", "Helvetica Neue", sans-serif;
	font-size: 1.2rem;
	line-height: 1.5;
}

input[type=checkbox] {
	transform: scale(2) !important;
	margin: 0 6px 0 0 !important;
}

.formSyslayout {
		width: 100%;
		max-width: 780px;
		margin: 0 auto;
		padding-top: 50px;
}
.formSyslayout a{
	color: #333 !important;
	border-bottom: #ccc;
}
.formSyslayout a:visited{
	color: #333 !important;
	border-bottom: #ccc;
}

p.formMn {
	width: 100%;
}

p.formMnAge {
	width: 30%;
}

span.wpcf7-list-item {
	padding-top: 10px;
	display: inline-block;
}
span.required {
	font-size: 70%;
	background: #cc0000;
	color: #fff;
	border-radius: 3px;
	padding: 5px;
	margin-left: 20px;
}
}



/*========= table ===============*/
table {
		border-collapse: collapse;
		width: 100%;
		line-height: 2.2rem;
}
.std__table th,
.std__table td{
		padding: 25px 0;
		border-top: solid 1px #ccc;
		border-bottom: solid 1px #ccc;
		box-sizing:border-box;
}
.std__table th,
.std__table td:last-child{
		padding: 25px 0;
		border-top: solid 1px #ccc;
		border-bottom: none;
		box-sizing:border-box;
}
.wide__table th,
.wide__table td{
		padding: 13px;
		border-top: solid 1px #ccc;
		border-bottom: solid 1px #ccc;
		box-sizing:border-box;
}
@media screen and (max-width: 640px) {
.std__table {
				width: 100%;
				font-size: 0.8rem;
		}
.std__table th {
				background: #f0f0f0;
				color: #333;
		}
		table.std__table th,
		table.std__table td {
				padding: 10px 20px;
				display: block;
				width: 100%;
				border:none;
		}
.std__table tr:last-child{
				/* border-bottom: solid 1px #e9e9e9; */
		}
.wide__table {
						width: 100%;
						font-size: 0.8rem;
						white-space: nowrap;
				}
		.wide__table th {
						background: #f0f0f0;
						color: #333;
				}
				table.std__table th,
				table.std__table td {
						padding: 10px 20px;
						width: 100%;
				}
		.wide__table tr:last-child{
						/* border-bottom: solid 1px #e9e9e9; */
				}
}