@charset "utf-8";

html {
	/*font-size: 15.3374233px;*/
	font-size: 10px;
}

@media screen and (max-width:1199px){
	html {
		font-size: 10px;
	}
}

@media screen and (max-width:767px){
}

@media screen and (max-width:480px){
	html {
		font-size: 1.25vw;
		/*font-size: 1.23333333vw;*/
		/*font-size: 1.33333333vw;*/
	}
}


/**********************************

 general

***********************************/
.u-corporate-logo {
	font-family: "corporate-logo-ver2", sans-serif;
}
.u-din {
	font-family: "din-2014", sans-serif;
}
.u-full {
	max-width: none;
	width: 100%;
}
.u-floatL {
	float: left;
}
.u-floatR {
	float: right;
}
.u-alignC {
	text-align: center;
}
.u-alignR {
	text-align: right;
}
.u-alignL {
	text-align: left;
}
.u-veralignT {
	vertical-align: top;
}
.u-veralignM {
	vertical-align: middle;
}
.u-veralignB {
	vertical-align: bottom;
}
.u-indent {
	text-indent: -1em;
	padding-left: 1em;
}
.u-bold {
	font-weight: bold;
}
.u-color-primary {
	color: var(--text-color-primary);
}
.u-white {
	color: #fff;
}
.u-red {
	color: #ff3f00;
}
.u-blue {
	color: #1184df;
}
.u-yellow {
	color: #ffff00;
}
.u-bgYellow {
	background-color: #fff100;
}
.u-marker {
	background: linear-gradient(transparent 70%, #ffbf00 70%);
}
.u-underline {
	text-decoration: underline;
	text-underline-offset: .4em;
}

@media screen and (min-width:768px){
	.u-sp {
		display: none !important;
	}
}
@media screen and (max-width:767px){
	.u-pc {
		display: none !important;
	}
}


/**********************************

 c-wrap

***********************************/
.c-wrap {
	margin-top: 51px;
	margin-bottom: -28px;
	color: #333333;
	font-family: "YakuHanJP", 'Noto Sans JP', 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	background: #e5e761 url(../images/hero_bg01.png) no-repeat center top / 192rem auto;
}

@supports (background-image: url("../images/hero_bg01.webp")) {
	.c-wrap {
		background-image: url(../images/hero_bg01.webp);
	}
}

.c-main {
}

@media screen and (min-width:1921px){
	.c-wrap {
		background-position: center top;
		/*background-position: center 63%;*/
		background-size: 100% auto;
	}

}

@media screen and (max-width:767px){

}

@media screen and (max-width:480px){

	.c-wrap {
		margin-top: 107px;
		margin-bottom: 25px;
	}
}


/**********************************

 header

***********************************/


@media screen and (max-width:480px){

	header {
		height: auto;
	}
}


/**********************************

 pagetop_f

***********************************/
.pagetop_f {
	position: relative;
	z-index: 2;
}

/**********************************

 c-hero

***********************************/
.c-hero {
}

.c-hero__inner {
	padding: 8.5rem 0 2rem;
	margin: 0 auto;
}

.c-hero__ttl {
	color: #67544a;
	font-size: 6.6rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
	text-shadow: .1rem .1rem .3rem rgba(0,0,0,.3);
}

.c-hero__signboard {
	display: flex;
	align-items: center;
	width: 76.7rem;
	height: 36.9rem;
	margin: 4rem auto 0;
	text-align: center;
	background: url(../images/hero_signboard.png) no-repeat center / contain;
}

.c-hero__signboard p {
	display: block;
	width: 57rem;
	margin: 0 auto;
	color: #67544a;
	font-size: 2.4rem;
	font-weight: bold;
	line-height: calc(42 / 24);
	text-align: justify;
}

.c-hero__main {
	width: 65.2rem;
	margin: 0 auto;
}

.c-hero__main img {
	width: 100%;
	max-width: none;
}

@media screen and (min-width:1921px){

	.c-hero__inner {
		padding: 4.427vw 0 1.042vw;
	}

	.c-hero__ttl {
		font-size: 3.438vw;
	}

	.c-hero__signboard {
		width: 39.948vw;
		height: 19.219vw;
		margin-top: 2.083vw;
	}

	.c-hero__signboard p {
		width: 29.688vw;
		font-size: 1.25vw;
	}

	.c-hero__main {
		width: 33.958vw;
	}
}

@media screen and (max-width:767px){

}


/**********************************

 c-detail

***********************************/
.c-detail {
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.c-detail:before {
	content: "";
	display: block;
	width: 123.5rem;
	/*max-width: 100%;*/
	height: 19rem;
	background: url(../images/bg_star01.png) no-repeat center / contain;
	position: absolute;
	top: 14rem;
	left: 50%;
	z-index: -1;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}

.c-detail__inner {
	/*width: 72rem;*/
	width: 65.2rem;
	max-width: 100%;
	margin: 0 auto;
	padding-bottom: 10rem;
}

.c-detail__sec {
	box-shadow: .1rem .1rem .6rem rgba(0,0,0,.3);
	border-radius: 3rem;
	overflow: hidden;
}

.c-detail__head {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 14rem;
	padding: 1rem 3rem;
	background: #008f18;
}

.c-detail__head-ttl {
	color: #f0ead4;
	font-size: 5rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
}

.c-detail__body {
	padding: 4.5rem 3.5rem 5.5rem;
	background: #ffffff;
}

.c-detail__intro {

}

.c-detail__intro-ttl {
	color: #67544a;
	font-size: 4.8rem;
	font-weight: bold;
	text-align: center;
	line-height: calc(60 / 48);
}

.c-detail__intro-txt01 {
	margin-top: 2rem;
	font-size: 2.4rem;
	font-weight: bold;
	text-align: center;
	line-height: 2;
}

.c-detail__intro-txt02 {
	margin-top: -.3em;
	font-size: 2.4rem;
	font-weight: bold;
	text-align: justify;
	line-height: 2;
}

.c-detail__example {
	margin-top: 8rem;
}

.c-detail__example:first-child {
	margin-top: 0;
}

.c-detail__example-ttl {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 12rem;
	color: #fff;
	font-size: 3.6rem;
	font-weight: bold;
	text-align: center;
	background: #705e53;
	border-radius: 1rem;
	position: relative;
	z-index: 1;
}

.c-detail__example-ttl:before {
	content: "";
	display: block;
	width: 12.7rem;
	height: 5.6rem;
	background: url(../images/detail_example.png) no-repeat center / contain;
	position: absolute;
	top: -2.4rem;
	left: 1.2rem;
	z-index: 1;
}

.c-detail__example-avator {
	display: flex;
	justify-content: space-between;
	margin-top: 3.5rem;
}

.c-detail__example-avator .pic {
	width: 10rem;
	margin-right: 1rem;
}

.c-detail__example-avator .pic img {
	width: 100%;
	max-width: none;
}

.c-detail__example-avator .copy {
	flex: 1;
	margin-right: -.5em;
	padding-top: .1em;
	color: #705e53;
	font-size: 3.2rem;
	font-weight: bold;
	line-height: calc(48 / 32);
	letter-spacing: -.04em;
}

.c-detail__example-avator .copy .dot {
	display: inline-block;
	margin-right: -.5em;
}

.c-detail__example-txt01 {
	margin-top: 2rem;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__example-term {
	margin-top: 2rem;
	padding: 2.5rem 3rem;
	border: .1rem solid #705e53;
	border-radius: 2rem;
}

.c-detail__example-term .ttl {
	color: #67544a;
	font-size: 2.4rem;
	font-weight: bold;
}

.c-detail__example-term .txt01 {
	margin-top: .2em;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__example-term ol {
	margin-top: .2em;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__example-term ol li {
	text-indent: -1em;
	margin-left: 1em;
}

.c-detail__example-pic {
	margin-top: 3.5rem;
}

.c-detail__example-pic img {
	width: 100%;
	max-width: none;
}

.c-detail__chain {
	height: 8.4rem;
	position: relative;
	z-index: 2;
}

.c-detail__chain:before {
	content: "";
	display: block;
	width: 2.2rem;
	height: 15.9rem;
	background: url(../images/chain.png) no-repeat center / contain;
	position: absolute;
	top: -3.8rem;
	left: 1.8rem;
	z-index: 1;
}

.c-detail__chain:after {
	content: "";
	display: block;
	width: 2.2rem;
	height: 15.9rem;
	background: url(../images/chain.png) no-repeat center / contain;
	position: absolute;
	top: -3.8rem;
	right: 1.8rem;
	z-index: 1;
}

.c-detail__terms {
	margin-top: 5rem;
}

.c-detail__terms-sec {
	margin-top: 5.5rem;
}

.c-detail__terms-sec:first-child {
	margin-top: 0;
}

.c-detail__terms-ttl {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 12rem;
	color: #fff;
	font-size: 3.6rem;
	font-weight: bold;
	text-align: center;
	line-height: calc(48 / 36);
	background: #705e53;
	border-radius: 1rem;
	position: relative;
	z-index: 1;
}

.c-detail__terms-body {
	margin-top: 3.5rem;
}

.c-detail__terms-body p {
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__terms-body p.intro {
	margin-top: -.5em;
}

.c-detail__terms-body-sec {
	margin-top: 5rem;
}

.c-detail__terms-body-sec:first-child {
	margin-top: 0;
}

.c-detail__terms-body-sec-ttl {
	display: flex;
}

.c-detail__terms-body-sec-ttl .num {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 3.5rem;
	height: 3.5rem;
	margin-right: .5rem;
	color: #fff;
	font-size: 2.4rem;
	font-weight: bold;
	text-align: center;
	background: #67544a;
}

.c-detail__terms-body-sec-ttl .txt01 {
	flex: 1;
	display: block;
	margin-top: -.05em;
	color: #67544a;
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.5;
}

.c-detail__terms-body-sec-content {
	margin-top: 1.5rem;
}

.c-detail__terms-body-sec .parentheses-list {
	margin-top: .3em;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__terms-body-sec .parentheses-list:first-child {
	margin-top: 0;
}

.c-detail__terms-body-sec .parentheses-list > li {
	text-indent: -1.6em;
	margin-left: 1.6em;
}

.c-detail__terms-body-sec .circle-list {
	margin-top: .3em;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__terms-body-sec .circle-list:first-child {
	margin-top: 0;
}

.c-detail__terms-body-sec .circle-list > li {
	text-indent: -1em;
	margin-left: 1em;
}

.c-detail__terms-body-sec .note-list {
	margin-top: .5em;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.5;
	text-align: justify;
}

.c-detail__terms-body-sec .note-list:first-child {
	margin-top: 0;
}

.c-detail__terms-body-sec .note-list > li {
	text-indent: -1em;
	margin-left: 1em;
}

.c-detail__terms-body-sec .relation-link {
	margin-top: 5rem;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__terms-body-sec .relation-link:first-child {
	margin-top: 0;
}

.c-detail__terms-body-sec .relation-link dt {
}

.c-detail__terms-body-sec .relation-link dd {
}

.c-detail__terms-body-sec .relation-link dd a {
	color: #ff0000;
}

.c-detail__sec-link-list {
	padding: 3rem 3.5rem 6.5rem;
	background: #fff;
}

.c-detail__sec-link-item {
	padding: 3.4rem 0 3.4rem;
	border-bottom: .2rem dashed #bcbcbc;
}

.c-detail__sec-link-item:first-child {
	padding-top: 0;
}

.c-detail__sec-link-item:last-child {
	padding-bottom: 0;
	border-bottom: none;
}

.c-detail__sec-link-ttl {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 8rem;
	color: #f0ead4;
	font-size: 4.2rem;
	font-weight: bold;
	text-align: center;
	background: #008f18;
	border-radius: 20rem;
}

.c-detail__sec-link-desc {
	margin-top: 2.5rem;
	color: #67544a;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 2;
	text-align: justify;
}

.c-detail__sec-link-btn {
	margin-top: 2.5rem;
	font-size: 2.8rem;
	font-weight: 900;
	text-align: center;
	letter-spacing: .1em;
}

.c-detail__sec-link-btn a {
	display: inline-block;
	padding: 1.75rem 10rem;
	color: #fff;
	text-shadow: .1rem .1rem .3rem rgba(0, 0, 0, .3);
	text-decoration: none;
	border: .8rem solid #fff;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fd6f6b+0,ff8f52+100 */
	background: linear-gradient(to bottom,  rgba(253,111,107,1) 0%,rgba(255,143,82,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	box-shadow: .1rem .1rem .6rem rgba(0, 0, 0, .3);
	border-radius: 20rem;
	position: relative;
	z-index: 1;
}

@media (hover: hover) {

	.c-detail__sec-link-btn a {
		transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}

	.c-detail__sec-link-btn a:hover {
		transform: scale(1.1, 1.1);
		-webkit-transform: scale(1.1, 1.1);
	}

	.c-detail__sec-link-btn a:before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		border-radius: 20rem;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff8f52+0,fd6f6b+100 */
		background: linear-gradient(to bottom,  rgba(255,143,82,1) 0%,rgba(253,111,107,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		opacity: 0; /* 初期状態は非表示 */
		transition: opacity 0.5s;
	}

	.c-detail__sec-link-btn a:hover:before {
		opacity: 1;
	}

}

@media screen and (max-width:767px){

}

@media screen and (max-width:480px){

	.c-detail:before {
		width: 110rem;
		height: 19rem;
		top: 14rem;
	}

	.c-detail__inner {
		width: 65.2rem;
	}

}


/**********************************

 xxx

***********************************/

@media screen and (max-width:767px){

}

