/*いじらない！触らない！追加可（名称注意*/
html{
  font-family: "sans-serif","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

p,h1,h2,h3,h4,h5,h6,ul,li,table,dl {
	letter-spacing: 0.2em;
	/*line-height: 200%;*/
  /*font-family: "sans-serif","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
}
a {
	letter-spacing: 0.2em;
	
transition: color 1.0s ease 0s;
  /*font-family: "sans-serif","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
}
a:hover { text-decoration: none; }
.maxwidth{
    max-width: 100%;
}
html:before,
html:after,
body:before,
body:after {
  content: "";
  background: #3fb2e3;
  position: fixed;
  display: block;
 z-index: 10;
}
html { font-size: 2vmin; }
p,li,h3{font-size: medium;}
/* 上 */
html:before {
  height: 2%; 
  width: 100vw;
  left: 0;
  top: 0;
}

/* 右 */
html:after {
 width: 10px;
  height: 100vh;
  right: 0;
  top: 0;
}
/* 左 */
body:after {
 width: 10px;
  height: 100vh;
  top: 0;
  left: 0;
}

/* 下 */
body:before {
  height: 10px;
  width: 100vw;
  bottom: 0;
  left: 0;
}
		a {
			transition: 1.0s ;
			color: black ;
		}

		a:hover {
			color: #3fb2e3 ;
		}
.mb20{
	margin-bottom: 20px;
}
.mb40{
	margin-bottom: 40px;
}
.mb60{
	margin-bottom: 60px;
}
.mb80{
	margin-bottom: 80px;
}
.mb120{
	margin-bottom: 120px;
}
.fleft{
	float: left;
}
.fright{
	float: right;
}
.ffright{
	float: left;
}
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}
.br-sp{
	display:none;
		}
.br-pc{
	display:block;
		}
.w1000{
	max-width: 1000px;
}
.w10{
	width: 10%;
}
.w20{
	width: 20%;
}
.w30{
	width: 30%;
}
.w37{
	width:37%;
}
.w40{
	width: 40%;
}
.w50{
	width: 50%;
}
.w60{
	width: 60%;
}
.w70{
	width: 70%;
}
.w80{
	width: 80%;
}
.w90{
	width: 90%;
}
.w100{
	width: 100%;
}
.pconly{
	display: block;
}
.sponly{
	display:none;
}
	.side{
		float: left;
	}
	.sider{
		float: right;
	}
.toptop a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.toptop a::after {
  position: absolute;
  bottom: 2px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #3fb2e3;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
.toptop a:hover::after {
  bottom: -4px;
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 1105px){
	.w42{
	width:100%;
}
	.w10{
		width:15%;
	}
		.w51 {
			width: 80%;}}
@media screen and (max-width: 700px){
	p,li,h3{font-size: small;}
.br-sp{
	display:block;
		}
.br-pc{
	display:none;
	}
.sponly{
	display:block;
}
.pconly{
	display:none;
	}
	.side{
		float: none;
	}
	.sider{
		float: none;
	}
	.ffright{
	float: right;
}
.w10{
	width: 90%;
}
.w20{
	width: 90%;
}
.w30{
	width: 90%;
}
	.w37{
	width:90%;
}
.w40{
	width: 90%;
}
.w50{
	width: 90%;
}
.w60{
	width: 90%;
}
.w70{
	width: 100%;
}
.w80{
	width: 90%;
}
.w90{
	width: 90%;
}
.w100{
	width: 100%;}
}