@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;}
/*------------------------------------------------------------
	font
------------------------------------------------------------*/
.montserrat {
	font-family: "Montserrat", sans-serif;
}
.roboto {
	font-family: "Roboto", sans-serif;
}
/*------------------------------------------------------------
	content
------------------------------------------------------------*/
.content {
	padding: 0 30px;
}
@media all and (min-width: 820px) {
	.content {
		padding: 0;
		width: 1100px;
		margin: 0 auto;
		box-sizing: border-box;
	}
}
/*------------------------------------------------------------
	headline01
------------------------------------------------------------*/
.headline01 {
	margin-bottom: 40px;
	text-align: center;
	font-size: 3rem;
	font-weight: 500;
	letter-spacing: 3px;
}
.headline01 .en {
	margin-bottom: 1px;
	display: block;
	color: #F38300;
	font-size: 1.6rem;
	letter-spacing: 1.6px;
	font-family: "Roboto", sans-serif;
}
@media all and (max-width: 360px) {
	.headline01 {
		font-size: 8vw;
		letter-spacing: 0;
	}
}
@media all and (min-width: 820px) {
	.headline01 {
		margin-bottom: 77px;
		font-size: 3.5rem;
		letter-spacing: 3.5px;
	}
	.headline01 .en {
		margin-bottom: 8px;
		letter-spacing: 0.32px;
	}
}
/*------------------------------------------------------------
	headline02
------------------------------------------------------------*/
.headline02 {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	letter-spacing: 1.8px;
}
.headline02 .ico {
	padding-left: 24px;	
	display: inline-block;
	position: relative;
}
.headline02 .ico::before {
	position: absolute;
	width: 14px;
	height: 14px;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	border-radius: 50%;
	background-color: #FFF490;
	content: "";
}
.headline02_big01 {
	margin-bottom: 17px;
	font-size: 20px;
	letter-spacing: 2px;
}
@media all and (min-width: 820px) {
	.headline02 {
		margin-bottom: 24px;
		font-size: 26px !important;
		letter-spacing: 2.6px !important;
	}
	.headline02 .ico {
		padding: 0 10px 0 34px;	
	}
	.headline02 .ico::before {
		width: 19px;
		height: 19px;
		margin-top: 2px;
	}
	.headline02_big01 {
		margin-bottom: 31px;
	}
}
/*------------------------------------------------------------
	headline03
------------------------------------------------------------*/
.headline03 {
	margin-bottom: 15px;
	padding-left: 30px;	
	position: relative;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 1.8px;
}
.headline03::before {
	position: absolute;
	width: 20px;
	height: 5px;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	background-color: #FFF062;
	content: "";
}
@media all and (max-width: 374px) {
	.headline03 {
		font-size: 4.8vw;
	}
}
@media all and (min-width: 820px) {
	.headline03 {
		margin-bottom: 19px;
		padding-left: 57px;	
		font-size: 22px;
		letter-spacing: 2.2px;
	}
	.headline03::before {
		width: 35px;
		height: 6px;
		margin-top: 3px;
		left: 3px;
	}
}
/*------------------------------------------------------------
	com-link
------------------------------------------------------------*/
.com-link a {
	height: 50px;
	padding: 0 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #fff;
	letter-spacing: 1.4px;
	border-radius: 50px;
	background: url(../../images/common/icon08.svg) no-repeat left 37px center,url(../../images/common/icon09.svg) no-repeat right 17px center #F38300;
	background-size: 14px auto,16px auto;
	box-sizing: border-box;
}
.com-link.yellow a {
	background-color: #F2C72F;
	background-image: url(../../images/common/icon13.svg),url(../../images/common/icon09.svg);
}
@media all and (max-width: 819px) {
	.com-link {
		max-width: 315px;
		margin: 0 auto;
	}
	.com-link.yellow a {
		background-size: 15px auto,16px auto;
	}
}
@media all and (min-width: 820px) {
	.com-link a {
		height: 80px;
		padding: 0 80px;
		font-size: 1.9rem;
		letter-spacing: 1.9px;
		background-image: url(../../images/common/icon08_pc.svg),url(../../images/common/icon09_pc.svg);
		background-position: left 54px center,right 53px center;
		background-size: 20px auto,19px auto;
	}
	.com-link.yellow a {
		background-image: url(../../images/common/icon13_pc.svg),url(../../images/common/icon09_pc.svg);
		background-size: 21px auto,19px auto;
	}
	.com-link a:hover {
		background-color: #FFC47E !important;
	}
	.com-link.yellow a:hover {
		background-color: #FFE589 !important;
	}
}
/*------------------------------------------------------------
	loading
------------------------------------------------------------*/
.loading {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 101;
	background: url(../../images/common/loading_bg01.png) no-repeat right top,url(../../images/common/loading_bg02.png) no-repeat left bottom #FCF8F0;
	background-size: 192px auto,254px auto;
}
.loading .load-info {
	height: 100%;
	padding: 0 0 29px 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}
.loading .load-logo {
	opacity: 0;
	visibility: hidden;
	width: 267px;
	transition: all 0.6s ease-in-out;
}
.loading .load-logo.show {
	opacity: 1;
	visibility: visible;
}
@media all and (min-width: 820px) {
	.loading {
		background: url(../../images/common/loading_bg01_pc.png) no-repeat right top 48px,url(../../images/common/loading_bg02_pc.png) no-repeat left bottom #FCF8F0;
		background-size: 231px auto,462px auto;
	}
	.loading .load-info {
		padding: 0 0 78px 202px;
	}
	.loading .load-logo {
		width: 746px;
	}
}
/*------------------------------------------------------------
	fade-in
------------------------------------------------------------*/
.fade-in {
	opacity: 0;
	transform: translate(0,100px);
	-webkit-transition: all 1s;
	transition: all 1s;
}
.fade-in.on {
	transform: translate(0,0);
	opacity: 1;
}