
body{ 
margin: 0;
background-color: #4682b4;
}
@media screen and (min-width:768px) {
	div.hamburger{
		display: none;
	}
}
@media screen and (max-width:768px) {
	span.spanmenu{
		display: none;
	}
	.txtupinner > img{
		width:100vw;
		float:none;
		border: 2px #222 solid;
	}
	.waku{
	flex-wrap: nowrap;
	}

}
/*　ハンバーガーメニューボタン　*/
.hamburger {
	display : block;
	position: fixed;
	z-index : 11;
	right : 20px;
	top   : 20px;
	width : 42px;
	height: 42px;
	cursor: pointer;
	text-align: center;
	font-size:0.8em;
	
}
.hamburger span {
	display : block;
	position: absolute;
	width   : 30px;
	height  : 2px ;
	left    : 6px;
	background : #BBBBBB;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition   : 0.3s ease-in-out;
	transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
	top: 10px;
}
.hamburger span:nth-child(2) {
	top: 20px;
}
.hamburger span:nth-child(3) {
	top: 30px;
}

/* スマホメニューを開いてる時のボタン */
.hamburger.active span:nth-child(1) {
		top : 16px;
		left: 6px;
		background :#fff;
		-webkit-transform: rotate(-45deg);
		-moz-transform   : rotate(-45deg);
		transform        : rotate(-45deg);
}
	
.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
		top: 16px;
		background :#fff;
		-webkit-transform: rotate(45deg);
		-moz-transform   : rotate(45deg);
		transform        : rotate(45deg);
}

/* メニュー背景　*/
nav.globalMenuSp {
	position: fixed;
	z-index : 10;
	top  : 0;
	left : 0;
	color: #fff;
	background: rgba( 71,70,73,0.6 );
	text-align: center;
	width: 100%;
	transform: translateX(100%);
	transition: all 0.6s;

}

nav.globalMenuSp ul {
	margin: 0 auto;
	padding: 0;
	width: 100%;
}

nav.globalMenuSp ul li {
	list-style-type: none;
	padding: 0;
	width: 100%;
	transition: .4s all;
}
nav.globalMenuSp ul li:last-child {
	padding-bottom: 0;
}
nav.globalMenuSp ul li:hover{
	background :#ddd;
}

nav.globalMenuSp ul li a {
	display: block;
	color: #fff;
	padding: 1em 0;
	text-decoration :none;
}

/* クリックでjQueryで追加・削除 */
nav.globalMenuSp.active {
	opacity: 100;
	display: block;
	transform: translateX(0%);
}
.headmenu{
	width:100%;
	height:auto;
	padding:0% 0% 0% 0%;
	/*border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;*/
	position: absolute;
	/*position: fixed;
	top:0;
	z-index: 5;*/
	display: flex;
	flex-direction: row;
	align-items: start;
	justify-content: space-between;
	/*background-image:url("https://www.chukyo-ch.ed.jp/zennichi/images/mainvisual/mainvisual-club-img02.jpg");*/
	background-color: transparent;
	background-size: 100%;
	font-size:0.8em;
	background-color: #4682b4;
}
span.spanmenu{
	width:100%;
	height:25px;
	line-height:25px;
	/*border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;*/
	border-radius: 5px 5px 0px 0px;
	padding:0.2% 0.2% 0.0% 0.2%;
	margin:2% 0% 0% 0%;
	/*background-color:#eee;*/
	/*background-color: rgba(255,255,255,0.3);*/
	color:#000;
	text-align:center;
	z-index: 6;
}
span.spanmenu:hover{
	background-color:#faf0e6;
	background-color: rgba(255,255,255,0.7);
}
h1{
	padding: 0 0 0% 2%;
	margin:2px -3px -3px -3px;
	font-size:1.0em;
	color:#fff;
}
h4{
	padding: 0 0 0% 2%;
	margin:2px -3px -3px -3px;
	font-size:1.0em;
	color:#555;
}
div.waku{
	width:90%;
	height:auto;
	/*position: relative;*/
	/*top:120px;*/
	line-height:30px;
	/*border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;*/
	/*margin:2.0% 0% 1.5% 0%;*/
	padding:2.0% 5% 10% 5%;
	display: flex;
	flex-direction: row;
	/*z-index: 0;*/
	background-color:#fff;
}
div.wakuin{
	position:relative;
	background-color:#eee;
	margin-top:-6px;
	padding-bottom:2%;
}
div.wakucenter{
	width:90%;
	height:100%;
	position: relative;
	top:100px;
	line-height:16px;
	border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;
	margin:2.0% 0% 1.5% 0%;
	padding:2.0% 5% 5% 5%;
	display: flex;
	flex-direction: row;
}
div.wakubottom{
	width:90%;
	height:100%;
	position: relative;
	top:80px;
	line-height:16px;
	border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;
	margin:2.0% 0% 1.5% 0%;
	padding:2.0% 5% 5% 5%;
	display: flex;
	flex-direction: row;
}
h2.bar-title {
	font-size: 1.7em;
	font-weight: 800;
	letter-spacing: .2em;
	padding-left: 20px;
	position: relative;
	line-height: 1.2;
	margin-bottom: 3vh;
}
h2.bar-title::before {
	content: "";
	position: absolute;
	background: #eb5919;
	width: 5px;
	height: 100%;
	left: 0;
	top: 0;
}
h3.bar-title {
	font-size: 1.5em;
	font-weight: 800;
	letter-spacing: .2em;
	padding-left: 20px;
	position: relative;
	line-height: 1.2;
	margin-bottom: 3vh;
}
h3.bar-title::before {
	content: "";
	position: absolute;
	background: #eb5919;
	width: 5px;
	height: 100%;
	left: 0;
	top: 0;
}
h4.bar-title {
	font-size: 1.0em;
	font-weight: 600;
	letter-spacing: .2em;
	padding-left: 5px;
	position: relative;
	line-height: 1.2;
	margin-bottom: 3vh;
}
h4.bar-title::before {
	content: "";
	position: absolute;
	/*background: #888;*/
	width: 5px;
	height: 100%;
	left: 0;
	top: 0;
}
div.txtup{
	padding:1% 2% 2% 20px;
	width:90%;
	color:#222;
}
div.foot{
	display: flex;
	flex-wrap:wrap;
	width:93%;
	height:100px;
	/*border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;*/
	/*position: sticky;*/
	/*top: 100vh;
	background-color:#808000;
	background-color: rgba(204,204,153,0.5);*/
	padding:5% 0% 5% 7%;
}
a{
	text-decoration: none;
}
div.sub{
	position: relative;
	position: fixed;
	top:0;
	z-index: 10;
	padding:1% 0% 0% 1%;
}
div.menu{
	position:fixed;
	width:100%;
	height:60px;
	background-color: #4682b4;
	z-index: 8;
	top:0px;
}
.txtupinner > img:hover{
	/* transformは変形プロパティ。値にscaleを指定すると拡大縮小することができる。 */
	transform: scale(1.3);
	border: 2px #888 solid;
}
div.txtupinner > img{
	width:50%;
	float:left;
	border: 2px #888 solid;
}
div.formwaku{
	width:90%;
	height:auto;
	padding:5% 5% 5% 5%;
	/*border: 1px solid #333;
	border-width:0.1em 0.1em 0.1em 0.1em;*/
	display: flex;
	background: #ddd;
	justify-content: center;
	flex-wrap: wrap;
	border-radius:1%;
}
.formwaku>div.formleft{
	width: 25%;
	background: #FFF;
	border: 0px solid #999;
	padding: 5px;
	text-align:right;
	background: #ddd;
}
.formwaku>div.formright{
	width: 65%;
	background: #FFF;
	border: 0px solid #999;
	padding: 5px;
	background: #ddd;
}
input {
font-size: 1.0em;
}
p.emsg {
	margin:0 0 0 0;
	color:red;
	font-size:0.8em;
}
.privacy-policy {
  color: #555;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 95%;
  height: 200px;
  overflow-y: scroll;
  padding: 6px 12px;
  background-color:#fff;
}
.subbox{
	display: flex;
	flex-direction: column;
	margin:2%;
	padding:0%;
	/*width:100%;*/
	height:300px;
	border:1px solid #666;
	border-radius: 10px;
	text-align:center;
	background-color:#fff;
	background-size:70%;
	background-repeat:no-repeat;
	background-position:center bottom;
	box-shadow: 10px 10px 15px -10px;
	/*width: calc(25% - 22px); *//* margin padding分を引く */
	width: calc(20%); /* margin padding分を引く */

}
.subbox_base{
	margin-top: auto;
	text-align:right;
	padding:0% 5% 5% 0%;
	text-shadow: 0px 8px 8px white;
}
div.subbox h3{
	font-size:0.9em;
	font-weight:normal;
	line-height: 1.5em
}
.subbox h2{
	padding-bottom:0%;
	margin-bottom:0%;
}
.foot .fmenu{
	width:25%;
	display: flex;
	flex-direction: column;
	margin:2%;
	line-height: 1.5em
}
@media screen and (max-width: 499px){
	.waku:has(h2){
	flex-direction:column;
	flex-wrap: nowrap;
	}
	.subbox{
		width:100%;
		background-size:60%;
		display: flex;
		flex-direction: column;
	}
	.foot .fmenu{
		width:100%;
		display: flex;
		flex-direction: column;
		margin:2%;
		line-height: 1.5em
	}
	div.txtupinner > img{
		width:100%;
		float:none;
		border: 2px #888 solid;
	}
}
.fmenu li{
	padding-left:3%;
	list-style-type: none;
	line-height: 2.0em;
	font-size:0.8em;
}
.foot a:link {
 color: #CCFFFF;
 //text-decoration: underline;
}

.foot a:visited {
 color: #99CCCC;
 //text-decoration: underline;
}

.foot a:hover {}

.foot a:active {
 color: #FFFFFF;
 //text-decoration: underline;
}
html {
    scroll-behavior: smooth;
}
.pagetop {
    height: 30px;
    width: 30px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    background: #fff;
    border: solid 2px #000;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 3px solid #000;
    border-right: 3px solid #000;
    transform: translateY(20%) rotate(-45deg);
}