@charset "utf-8";
/*------------------------------------------------------------
	汎用スタイル
------------------------------------------------------------*/
/* clearfix */	
.clearfix:after {content: "";display: block;clear: both;}
/* flex */	
.flex,.flexA,.flexB,.flexC {display: flex;flex-wrap: wrap;}
.flexA {justify-content: space-around;}
.flexB {justify-content: space-between;}
.flexC {justify-content: center;}
/*------------------------------------------------------------
	content
------------------------------------------------------------*/
.content {
    margin: 0 auto;
    padding: 0 15px;
    max-width: 950px;
    box-sizing: border-box;
}
@media all and (max-width: 896px) {
	.content {
		max-width: inherit !important;
		padding: 0 19px;
	}
}
/*------------------------------------------------------------
	com-link
------------------------------------------------------------*/
.com-link {
    margin: 0 auto;
    width: 500px;
}
.com-link a {
    padding: 20px 10px 20px;
    display: block;
    color: #fff;
    font-size: 2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
    background: #FB6D62 url("../../images/common/icon01.png") no-repeat right 14px center / 24px;
	box-sizing: border-box;
	border: 1px solid #FB6D62;
}
@media all and (min-width: 897px) {
	.com-link a:hover {
		color: #FB6D62;
		background-color: #fff;
		background-image: url("../../images/common/icon01_on.png");
	}
}
@media all and (max-width: 896px) {
	.com-link {
		width: auto;
		max-width: 335px;
	}
	.com-link a {
		padding: 11px 10px 10px;
	}
}
/*------------------------------------------------------------
	head-line01
------------------------------------------------------------*/
.head-line01 {
    text-align: center;
    font-size: 1.6rem;
    font-weight: 500;
    color: #BB7B2F;
}
.head-line01 .en {
    margin-bottom: 5px;
    display: block;
}
.head-line01 .en img {
	height: 64px;
}
@media all and (max-width: 896px) {
	.head-line01 .en img {
		height: 50px;
	}
}
/*------------------------------------------------------------
	head-line02
------------------------------------------------------------*/
.head-line02 {
	width: 200px;
	margin: 0 auto 50px;
	padding: 5px 0;
	text-align: center;
	font-size: 2.4rem;
	font-weight: 500;
	border: 2px solid #573001;
	box-sizing: border-box;
	border-radius: 50px;
}
@media all and (max-width: 896px) {
	.head-line02 {
		margin-bottom: 38px;
		width: 178px;
		padding: 3px 0;
		font-size: 2rem;
	}
}
.fadeTxt span {
	opacity: 0;
	transition: all 0.3s ease-in-out;
}
.fadeTxt.on span {
	opacity: 1;
}
.loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10000;
	background-color: #fff;
	overflow: hidden;
}
.loading .loadImg {
	position: absolute;
	left: 49.4%;
	top: 52.5%;
	transform: translate(-50%,-50%);
}
.fadein {
	opacity: 0;
	transform: translateY(20px);
	transition: all 1.2s;
}
.fadein.visible {
	opacity: 1;
	transform: translateY(0);
}
.fadeleft {
	opacity: 0;
	transform: translateX(-70px);
	transition: 0.5s;
}
.fadeleft.visible {
	opacity: 1;
	transform: translateX(0);
}
.fadescale {
	transform: scale(0);
	transition: 0.5s;
}
.fadescale.visible {
	transform: scale(1);
}
.faderight {
	opacity: 0;
	transform: translateX(70px);
	transition: 0.5s;
}
.faderight.visible {
	opacity: 1;
	transform: translateX(0);
}
@media all and (max-width: 896px) {
	.loading .loadImg {
		left: 48%;
		top: 52%;
	}
}