/*-----
* basic-style.css ver1.0.0
-----*/
/***** variable *****/
:root{
	--basic-font-size:16px;
	--sans-font:Arial,Meiryo,sans-serif;
	--key-color:#bbe98d;
	--border-color:#afafaf;
}
/***** common *****/
html,body{
	font-size:var(--basic-font-size, 16px);
	font-family:var(--sans-font);
}
img{
	max-width: 100%;
}
.icon-size img{
	width:calc(var(--basic-font-size) * 1.5);
}
.pc-br{
	display:block;
}
.sp-br{
	display:none;
}
@media screen and (min-width:769px) and ( max-width:1100px){
	
}
@media screen and (max-width:768px){
	.pc-br{
		display:none;
	}
	.sp-br{
		display:block;
	}
}
/***** header *****/
.site-header{
	width:100%;
}
.site-header>.inner{
	width: 100%;
	max-width: 1200px;
	margin: auto;
	padding: 2rem 2%;
}
@media screen and (max-width:768px){
	
	
}
/***** footer *****/
.site-footer{
	width:100%;
}
.site-footer>.inner{
	width: 100%;
	max-width: 1200px;
	margin: auto;
	padding: 2rem 2%;
}
@media screen and (max-width:768px){
	
	
}
/***** content common *****/
.basic-box>.inner{
	width: 100%;
	max-width: 1200px;
	margin: auto;
	padding: 2rem 2%;
}
@media screen and (max-width:768px){
	
	
}


/***** back top top *****/
.backtoup{
	position: fixed;
	bottom: 10px;
	right: 10px;
	cursor: pointer;
	opacity: 0;
	transition: opacity 200ms 0s ease;
	z-index: 10;
}
.backtoup.btuActive{
	opacity: 1;
}
.backtoup>div{
	width: 100%;
	height: 100%;
	position: relative;
	border: 1px solid var(--border-color);
	border-radius: 50%;
	transform: scale(0.9);
	transition: all 200ms 0s ease;
}
.backtoup:hover>div{
	transform: scale(1);
}
.backtoup>div>svg>path{
	stroke: var(--border-color);
}
@media screen and (max-width:768px){
	
	
}
/***** 404 *****/
.not-found-box .text-box{
	text-align: center;
}
.not-found-box .text-box>.p-1{
	font-size: 2rem;
	font-weight: bold;
	font-family: monospace, monospace;
	margin-bottom: 2rem;
}
.not-found-box .text-box>div>p>a:hover{
	text-decoration: underline;
	-webkit-text-decoration: underline #000;
}
@media screen and (max-width:768px){
	
	
}
