/*  -----------------------------
	変数
 -----------------------------  */
:root {

	--green-1: #B4E650;
	--green-1_2: #8CB33E;
	--green-2: #123801;
	--blue-1: #1F65AA;
	--yellow-1: #EEF200;

	--glay-1: hsl(0,0%,97%);
	--glay-2: hsl(0,0%,92%);
	--glay-3: hsl(0,0%,85%);
	--glay-4: hsl(0,0%,60%);
	--glay-5: hsl(0,0%,20%);

	--link: #002BFF;

	--chapter-1: #DFED47;
	--chapter-1-2: #AFBA38;
	--chapter-2: #CDED64;
	--chapter-2-2: #A1BA4E;
	--chapter-3: #B4E650;
	--chapter-3-2: #8CB33E;
	--chapter-4: #6BDB65;
	--chapter-4-2: #52A84D;
	--chapter-5:#57D998;
	--chapter-5-2:#42A674;
	--column: #57C1D9;
	--column-2: #4494A6;

	--width: max(912px, 68vw);

	--mt-l: 160px;
	--mt-m: 88px;
	--mt-s: 48px;

	--hover-1: all 0.3s;

	--opacity: 0.7;
}

@media only screen and (max-width: 960px) {
	:root {
		--width: 90%;

		--mt-l: 144px;
		--mt-m: 72px;
		--mt-s: 40px;
	}
}

@media only screen and (max-width: 767px) {
	:root {
		--width: 95%;

		--mt-l: 120px;
		--mt-m: 64px;
		--mt-s: 32px;
	}
}

/*  -----------------------------
	全体共通
 -----------------------------  */
@font-face {
	font-family: OpenSans-Regular;
	src: url(../fonts/OpenSans-Regular.woff2);
}

@font-face {
	font-family: OpenSans-Italic;
	src: url(../fonts/OpenSans-Italic.woff2);
}

@font-face {
	font-family: OpenSans-Medium;
	src: url(../fonts/OpenSans-Medium.woff2);
}

@font-face {
	font-family: OpenSans-MediumItalic;
	src: url(../fonts/OpenSans-MediumItalic.woff2);
}

@font-face {
	font-family: OpenSans-SemiBold;
	src: url(../fonts/OpenSans-SemiBold.woff2);
}

@font-face {
	font-family: OpenSans-SemiBoldItalic;
	src: url(../fonts/OpenSans-SemiBoldItalic.woff2);
}

.only-pc {
	display: block;
}

.only-sp {
	display: none;
}

@media only screen and (max-width: 960px) {
	.only-pc {
		display: none;
	}

	.only-sp {
		display: block;
	}

	.only-sp--2 {
		display: none;
	}
}

@media only screen and (max-width: 767px) {
	.only-pc {
		display: none;
	}

	.only-sp,
	.only-sp--2 {
		display: block;
	}
}

html {
	scroll-behavior: smooth;
	width: 100vw;
	overflow-x: hidden;
}

body {
	position: relative;
	font-size: 1.6rem;
	font-family: 
		"Helvetica Neue",
		Arial,
		"Hiragino Kaku Gothic ProN",
		"Hiragino Sans",
		Meiryo,
		sans-serif;
	width: 100vw;
	overflow-x: hidden;
	transition: font-size 1s;
}

body.fix {
	position: fixed;
	left: 0;
	overflow: hidden;
}

main {
	width: 100%;
	overflow-x: hidden;
	text-align: center;
	margin-top: 80px;
}

main .block {
	max-width: var(--width);
	margin: auto;
}

h1,h2,h3,h4,h5,h6,p,a,li,td {
	font-feature-settings: "palt";
}

a {
	display: inline-block;
}

.flexBox {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}

.gridBox {
	display: grid;
}

.prohibited {
	pointer-events: none;
	user-select:none;
}


/*  -----------------------------
	リンクボタン
 -----------------------------  */
.linkBtnCnt {
    display: flex;
    justify-content: space-between;
	gap: 5%;
	width: 85vw;
	margin: 60px auto 70px;
}


.linkBtnCnt .linkBtn {
	position: relative;
}

.linkBtnCnt .linkBtn .linkBtn__btn {
	display: flex;
	place-content: center;
	gap: 1em;
	color: #1f3211;
	font-size: 22px;
	font-weight: 500;
	transform: translateY(0);
	transition: transform 0.2s;
}

.linkBtnCnt .linkBtn .linkBtn__btn span.partTxt{
	border-bottom: 2px solid #1f3211;
}

@media only screen and (max-width: 1150px) {
	.linkBtnCnt .linkBtn .linkBtn__btn{
		/* 20px @ 1024px increasing to 22px @ 1150px */
		font-size: calc(1.25rem + ((1vw - 10.24px) * 1.5873));
	}
}



.linkBtnCnt .linkBtn_blank {
	position: relative;
}

.linkBtn_blank .linkBtn__btn_blank{
	pointer-events: none;
	display: flex;
	place-content: center;
	gap: 1em;
	color: var(--green-2);
	font-size: 3.2rem;
	font-weight: 700;
	border-radius: 32px;
	transform: translateY(0);
	transition: transform 0.2s;
}


@media (hover: hover) {
	.linkBtnCnt .linkBtn .linkBtn__btn:hover {
		transform: translateY(3px);
	}
}

.linkBtnCnt .linkBtn .linkBtn__btn:active {
	transform: translateY(12px);
}

@media only screen and (max-width: 767px) {
	.linkBtnCnt {
		gap: var(--mt-s);
	}

	.linkBtnCnt .linkBtn {
		width: 90%;
		margin: auto;
	}

	.linkBtnCnt .linkBtn .linkBtn__btn {
		gap: 0.7em;
		font-size: 18px;
		padding: 0;
	}

	.linkBtnCnt .linkBtn .linkBtn__btn span.partTxt {
		border-bottom: none;
	}
}

.linkBtnList{
	text-align: center;
	margin-bottom: 90px;
}

.linkBtnList a{
	background-color: #36b504;
	padding: 20px 30px;
	border-radius: 10px;
	font-size: 24px;
	color: #fff;
}

.linkBtnList a:hover{
	opacity: 0.6;
	transition: 1s;
}


/*  -----------------------------
	関連項目
 -----------------------------  */
.relation {
	margin-top: var(--mt-l);
}


.relation .title {
	display: flex;
	align-items: center;
	gap: 0.5%;
}

.relation .title__icon {
	width: 36px;
	height: 36px;
	flex: 0 0 36px;
	background-image: url(../img/common/relation-icon.svg);
	background-repeat: no-repeat;
	background-size: cover;
}

.relation .title__text {
	font-size: 3.2rem;
	font-weight: bold;
	flex: 0 0 4em;
}

@media only screen and (max-width: 767px) {
	.relation .title__text {
		font-size: 2.8rem;
	}
}

.relation .title__line {
	display: block;
	width: 100%;
	height: 4px;
	background-image: linear-gradient(to right, var(--green-2), var(--green-2) 12px, transparent 12px, transparent 24px);
	background-repeat: repeat-x;
	background-size: 24px 4px;
	border: 0;
	flex: 0 1 auto;
}

.relationBtnWrapper {
	display: block;
	width: 100%;
}

.relationBtn {
	display: inline-flex;
	align-items: stretch;
	border: 4px solid var(--green-2);
	border-radius: 24px;
	overflow: hidden;
	margin-top: var(--mt-s);
	transform: translateX(0);
	transition: var(--hover-1);
}

@media (hover: hover) {
	.relationBtn:hover {
		transform: translateX(8px);
	}	
}

.relationBtn__title,
.relationBtn__subtitle {
	display: grid;
	place-content: center;
	font-size: 2.8rem;
	padding: 1.5em;
}

.relationBtn__title {
	flex: 0 0 auto;
	color: white;
	background-color: var(--green-2);
}

.relationBtn__subtitle {
	color: var(--green-2);
}

@media only screen and (max-width: 767px) {
	.relationBtnWrapper {
		width: 90%;
		margin: auto;
	}

	.relationBtn {
		display: flex;
		flex-direction: column;
	}

	.relationBtn__title,
	.relationBtn__subtitle {
		font-size: 2.0rem;
		padding: 0.5em 2em;
	}

	.relationBtn__title {
		width: 100%;
	}
}

.imgWrapper {
	cursor: pointer;
	opacity: 1;
	transition: var(--hover-1);
}

.modal:hover{
	cursor: pointer;
	opacity: 0.6;
	transition: 0.6s;
}

.spn_only{
	display: none;
}

@media only screen and (max-width: 700px){
	.spn_only{
		display: block;
	}
}

/*  -----------------------------
	ヘッダー
 -----------------------------  */

header .header--pc {
	display: block;
	position: relative;
	color: white;
	font-size: 1.4rem;
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	border-bottom: 1px solid white;
	z-index: 10;
}

header .header--pc .headerNavBox {
	flex: 1 auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	background-color: #FFFFFF;
	padding: 0 5.20833333vw 0 1.94444444vw;
}

header .header--pc .headerNavBox .leftItem {

}

header .header--pc .headerNavBox .leftItem > .siteLogo {
	display: inline-block;
	width: clamp(346px, 33.75vw, 405px);
	margin: 26px 0 20px 0 ;
}

header .header--pc .headerNavBox .leftItem > .siteLogo > img {
	width: 100%;
}

header .header--pc .headerNavBox .rightItem {
	width: clamp(510px,50.41666667vw ,605px);
	height: 100%;
}

header .header--pc .headerNavBox .rightItem .headerNav {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	height: 100%;
}

header .header--pc .headerNavBox .rightItem .headerNav .headerNav__item ~ .headerNav__item {
	margin-left: clamp(8px,2.5em,80px);
}

header .header--pc .headerNav .headerNav__item {
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
}

header .header--pc .headerNav .headerNav__item > a {
	position: relative;
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
	opacity: 1;
	transition: var(--hover-1);
	transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

header .header--pc .headerNav .headerNav__item > a,
header .header--pc .headerNav .headerNav__item > span,
header .header--pc .utilitiesNav .utilitiesNav__item > span {
	font-size: 16px;
	color: #000000;

}

@media only screen and (max-width: 1150px) {
	header .header--pc .headerNav .headerNav__item > a,
	header .header--pc .headerNav .headerNav__item > span,
	header .header--pc .utilitiesNav .utilitiesNav__item > span {
		/* 14px @ 1024px increasing to 16px @ 1150px */
		font-size: calc(0.875rem + ((1vw - 10.24px) * 1.5873));
	}
}

header .header--pc .headerNav .headerNav__item > a:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 50%;
    right: 50%;
    bottom: 35%;
    background: #b4e650;
    height: 4px;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

header .header--pc .headerNav .headerNav__item > a:hover:before, 
header .header--pc .headerNav .headerNav__item > a:focus:before,
header .header--pc .headerNav .headerNav__item > a:active:before {
    left: 0;
    right: 0;
}

header .header--pc .headerNav .subNav__item {
	position: relative;
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
}

header .header--pc .headerNav .subNav__item > a {
	opacity: 1;
	transition: var(--hover-1);	
}

header .header--pc .headerNav .headerNav__item > a.current::after,
header .header--pc .headerNav .subNav__item > a.current::after,
header .header--pc .utilitiesNav .subNav__item > button.current::after {
	content: "";
	display: inline-block;
	position: absolute;
	left: 0;
    bottom: 35%;
	z-index: 1;
	width: 100%;
	height: 4px;
	background-color: var(--green-1);
}

header .header--pc .headerNav .headerNav__item > span {
	position: relative;
}

header .header--pc .headerNav .headerNav__item > span,
header .header--pc .utilitiesNav .utilitiesNav__item > span {
	cursor: pointer;
}

header .header--pc .headerNav .headerNav__item:nth-of-type(2) > span::after,
header .header--pc .utilitiesNav .utilitiesNav__item:first-of-type > span::after {
	content: "\025bc";
	display: inline-block;
	font-size: .65em;
	width: .65em;
	height: .65em;
	margin-left: .5em;
	transform: translateY(-37.5%);
	transform-origin: right;
	transition: var(--hover-1);
}

header .header--pc .headerNav .headerNav__item:nth-of-type(7) {
	position: relative;
}

header .header--pc .headerNav .headerNav__item:nth-of-type(7) > a {
	margin-right: 1.2em;
}

header .header--pc .headerNav .headerNav__item:nth-of-type(7) > span {
	position: absolute;
	top: 50%;
	right: 0;
	display: inline-block;
	width: 0.8em;
	height: 0.7em;
	background-image: url(../img/common/link-icon-w.svg);
	background-size: cover;
	background-repeat: no-repeat;
	transform: translateY(-45%);
	opacity: 1;
	transition: var(--hover-1);
}

header .header--pc .utilitiesNav .utilitiesNav__item:first-of-type > span::before {
	content: "";
	display: inline-block;
	width: 1.25em;
	height: 1.25em;
	background-image: url(../img/common/fs-icon-w.svg);
	background-size: cover;
	background-repeat: no-repeat;
	transform: translateY(10%);
	margin-right: .5em;
}

header .header--pc .subNav {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100vw;
	height: 56px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 5em;
	background-color: var(--green-2);
	border-top: 1px solid white;
	transform: translateY(100%);
}

@media (hover: hover) {
	header .header--pc .headerNav .headerNav__item:hover .subNav,
	header .header--pc .headerNav .headerNav__item .subNav:hover {
		opacity: 1;
		visibility: visible;
		transition: all .3s;
	}

	header .header--pc .headerNav .headerNav__item:nth-of-type(2):hover > span::after,
	header .header--pc .utilitiesNav .utilitiesNav__item:first-of-type:hover > span::after {
		transform: translateY(37.5%) rotate(-180deg);
	}
}

header .header--pc .subNav[aria-hidden= "true"] {
	opacity: 0;
	visibility: hidden;
	transition: all .3s .15s;
}

header .header--pc .subNav[aria-hidden= "false"] {
	opacity: 1;
	visibility: visible;
	transition: all .3s;
}

header .header--pc .headerNav .leftItem {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}

header .header--pc .headerNav .rightItem {
}

header .header--pc .utilities {
    display: none;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	column-gap: 2.5rem;
	padding: calc(clamp(18px,2.8vw,20px) / 4) clamp(18px,2.8vw,20px);
	background-color: var(--blue-1);
}

header .header--pc .utilitiesNav {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}

header .header--pc .utilitiesNav .subNav {
	background-color: var(--blue-1);
}

header .header--pc .utilitiesNav .subNav__item {
	position: relative;
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
}

header .header--pc .utilitiesNav .subNav__item > button {
	opacity: 1;
	transition: var(--hover-1);	
}

header .header--pc .utilitiesNav .subNav .subNav__item--l {
	font-size: 2rem;
}

@media (hover: hover) {

	header .header--pc .utilitiesNav .utilitiesNav__item:hover .subNav,
	header .header--pc .utilitiesNav .utilitiesNav__item .subNav:hover {
		opacity: 1;
		visibility: visible;
		transition: all .3s;
	}
}

/*  -----------------------------
	ヘッダーFixed
 -----------------------------  */

header .header--pc-fixed {
	position: fixed;
	top: 0;
	color: white;
	font-size: 1.4rem;
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	border-bottom: 1px solid white;
	z-index: 50;
}

@media only screen and (max-width: 1024px) {
	header .header--pc-fixed {
		display: none !important;
	}
}

header .header--pc-fixed .headerNavBox {
	flex: 1 auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	background-color: rgba(255,255,255, 0.8);
	padding: 0 4.20833333vw 0 1.94444444vw;
}

@media only screen and (max-width: 1150px) {
	header .header--pc-fixed .headerNavBox {
		padding: 0 3.70731707vw 0 1.94444444vw;
	}
}

header .header--pc-fixed .headerNavBox .leftItem {

}

header .header--pc-fixed .headerNavBox .leftItem > .siteLogo {
	display: inline-block;
	width: clamp(346px, 33.75vw, 405px);
	margin: 26px 0 20px 0 ;
}

header .header--pc-fixed .headerNavBox .leftItem > .siteLogo > img {
	width: 100%;
}

header .header--pc-fixed .headerNavBox .rightItem {
	width: clamp(510px,50.41666667vw ,605px);
	height: 100%;
}

header .header--pc-fixed .headerNavBox .rightItem .headerNav {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	height: 100%;
}

header .header--pc-fixed .headerNavBox .rightItem .headerNav .headerNav__item ~ .headerNav__item {
	margin-left: clamp(8px,2.5em,80px);
}

@media only screen and (max-width: 1200px) {
    header .header--pc-fixed .headerNavBox .rightItem .headerNav .headerNav__item ~ .headerNav__item  {
        margin-left: clamp(5px, 1.5em, 80px);
    }
}

header .header--pc-fixed .headerNav .headerNav__item {
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
}

header .header--pc-fixed .headerNav .headerNav__item > a {
	position: relative;
	display: flex;
	flex-direction: column;
	place-content: center;
	height: auto;
	opacity: 1;
	transition: var(--hover-1);
	transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

header .header--pc-fixed .headerNav .headerNav__item > a,
header .header--pc-fixed .headerNav .headerNav__item > span,
header .header--pc-fixed .utilitiesNav .utilitiesNav__item > span {
	font-size: 16px;
	color: #000000;

}

@media only screen and (max-width: 1150px) {
	header .header--pc-fixed .headerNav .headerNav__item > a,
	header .header--pc-fixed .headerNav .headerNav__item > span,
	header .header--pc-fixed .utilitiesNav .utilitiesNav__item > span {
		/* 14px @ 1024px increasing to 16px @ 1150px */
		font-size: calc(0.875rem + ((1vw - 10.24px) * 1.5873));

	}
}

@media only screen and (min-width: 1024px) and (max-width: 1100px) {
	header .header--pc-fixed .headerNav .headerNav__item > a,
	header .header--pc-fixed .headerNav .headerNav__item > span,
	header .header--pc-fixed .utilitiesNav .utilitiesNav__item > span {

	}
}


header .header--pc-fixed .headerNav .headerNav__item > a:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 50%;
    right: 50%;
    bottom: -5px;
    background: #b4e650;
    height: 4px;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

header .header--pc-fixed .headerNav .headerNav__item > a:hover:before, 
header .header--pc-fixed .headerNav .headerNav__item > a:focus:before,
header .header--pc-fixed .headerNav .headerNav__item > a:active:before {
    left: 0;
    right: 0;
}

header .header--pc-fixed .headerNav .subNav__item {
	position: relative;
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
}

header .header--pc-fixed .headerNav .subNav__item > a {
	opacity: 1;
	transition: var(--hover-1);	
}

header .header--pc-fixed .headerNav .headerNav__item > a.current::after,
header .header--pc-fixed .headerNav .subNav__item > a.current::after,
header .header--pc-fixed .utilitiesNav .subNav__item > button.current::after {
	content: "";
	display: inline-block;
	position: absolute;
	left: 0;
    bottom: -5px;
/*    bottom: 0;*/
	z-index: 1;
	width: 100%;
	height: 4px;
	background-color: var(--green-1);
}

header .header--pc-fixed .headerNav .headerNav__item > span {
	position: relative;
}

header .header--pc-fixed .headerNav .headerNav__item > span,
header .header--pc-fixed .utilitiesNav .utilitiesNav__item > span {
	cursor: pointer;
}

header .header--pc-fixed .headerNav .headerNav__item:nth-of-type(2) > span::after,
header .header--pc-fixed .utilitiesNav .utilitiesNav__item:first-of-type > span::after {
	content: "\025bc";
	display: inline-block;
	font-size: .65em;
	width: .65em;
	height: .65em;
	margin-left: .5em;
	transform: translateY(-37.5%);
	transform-origin: right;
	transition: var(--hover-1);
}

header .header--pc-fixed .headerNav .headerNav__item:nth-of-type(7) {
	position: relative;
}

header .header--pc-fixed .headerNav .headerNav__item:nth-of-type(7) > a {
	margin-right: 1.2em;
}

header .header--pc-fixed .headerNav .headerNav__item:nth-of-type(7) > span {
	position: absolute;
	top: 50%;
	right: 0;
	display: inline-block;
	width: 0.8em;
	height: 0.7em;
	background-image: url(../img/common/link-icon-w.svg);
	background-size: cover;
	background-repeat: no-repeat;
	transform: translateY(-45%);
	opacity: 1;
	transition: var(--hover-1);
}

header .header--pc-fixed .utilitiesNav .utilitiesNav__item:first-of-type > span::before {
	content: "";
	display: inline-block;
	width: 1.25em;
	height: 1.25em;
	background-image: url(../img/common/fs-icon-w.svg);
	background-size: cover;
	background-repeat: no-repeat;
	transform: translateY(10%);
	margin-right: .5em;
}

header .header--pc-fixed .subNav {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100vw;
	height: 56px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 5em;
	background-color: var(--green-2);
	border-top: 1px solid white;
	transform: translateY(100%);
}

@media (hover: hover) {
	header .header--pc-fixed .headerNav .headerNav__item:hover .subNav,
	header .header--pc-fixed .headerNav .headerNav__item .subNav:hover {
		opacity: 1;
		visibility: visible;
		transition: all .3s;
	}

	header .header--pc-fixed .headerNav .headerNav__item:nth-of-type(2):hover > span::after,
	header .header--pc-fixed .utilitiesNav .utilitiesNav__item:first-of-type:hover > span::after {
		transform: translateY(37.5%) rotate(-180deg);
	}
}

header .header--pc-fixed .subNav[aria-hidden= "true"] {
	opacity: 0;
	visibility: hidden;
	transition: all .3s .15s;
}

header .header--pc-fixed .subNav[aria-hidden= "false"] {
	opacity: 1;
	visibility: visible;
	transition: all .3s;
}

header .header--pc-fixed .headerNav .leftItem {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}

header .header--pc-fixed .headerNav .rightItem {
}

header .header--pc-fixed .utilities {
    display: none;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	column-gap: 2.5rem;
	padding: calc(clamp(18px,2.8vw,20px) / 4) clamp(18px,2.8vw,20px);
	background-color: var(--blue-1);
}

header .header--pc-fixed .utilitiesNav {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}

header .header--pc-fixed .utilitiesNav .subNav {
	background-color: var(--blue-1);
}

header .header--pc-fixed .utilitiesNav .subNav__item {
	position: relative;
	display: flex;
	flex-direction: column;
	place-content: center;
	height: 100%;
}

header .header--pc-fixed .utilitiesNav .subNav__item > button {
	opacity: 1;
	transition: var(--hover-1);	
}

header .header--pc-fixed .utilitiesNav .subNav .subNav__item--l {
	font-size: 2rem;
}

@media (hover: hover) {

	header .header--pc-fixed .utilitiesNav .utilitiesNav__item:hover .subNav,
	header .header--pc-fixed .utilitiesNav .utilitiesNav__item .subNav:hover {
		opacity: 1;
		visibility: visible;
		transition: all .3s;
	}
}

header .header--sp {
	position: relative;
	display: none;
	visibility: hidden;
}

header .header--sp #menuBtnCheck {
	display: none;
}

header .header--sp .menuBtn {
	position: fixed;
	top: 10px;
	right: 10px;
	display: flex;
	height: 40px;
	width: 40px;
	justify-content: center;
	align-items: center;
	z-index: 6000;
	background-color: transparent;
}

header .header--sp .menuBtn > span,
header .header--sp .menuBtn > span::before,
header .header--sp .menuBtn > span::after {
	content: '';
	display: block;
	height: 3px;
	width: 25px;
	border-radius: 3px;
	background-color: var(--green-2);
	position: absolute;
	z-index: 6000;
}

header .header--sp .menuBtn > span {
	transition: all 0.2s 0.1s ease-out;
}

header .header--sp .menuBtn > span::before {
	bottom: 8px;
	transition: all 0.2s ease-out;
}

header .header--sp .menuBtn > span::after {
	top: 8px;
	transition: all 0.2s ease-out;
}

header .header--sp .menuBtn.is-active span {
	background-color: transparent;
	transition-delay: 0s;
}

header .header--sp .menuBtn.is-active span::before {
	bottom: 0;
	transform: rotate(45deg);
	background-color: var(--green-2);
	transition-delay: 0.1s;
}

header .header--sp .menuBtn.is-active span::after {
	top: 0;
	transform: rotate(-45deg);
	background-color: var(--green-2);
	transition-delay: 0.1s;
}

html:has(body #header .header--sp .headerNavBox .rightItem .humburgerMenu .menuBtn.is-active) {
	overflow: hidden;
	overflow-y: hidden;
	overscroll-behavior-y: none;
}

header .header--sp .headerNavCnt {
	width: 100%;
	height: 100%;
	color: var(--green-2);
	background: var(--glay-3);
	z-index: 5000;
	text-align: left;
	color: var(--green-2);
	font-size: 1.5rem;
	padding: 9vh 5vw;
	position: fixed;
	display: none;
}



header .header--sp .menuBtn.is-active ~ .headerNavCnt {
	display: block;
}

header .header--sp .headerNav {
	margin-top: var(--mt-m);
	padding: 0 5vw;
}

header .header--sp .headerNav__item a,
header .header--sp .subNav__item a {
	position: relative;
	opacity: 1;
	transition: var(--hover-1);
}

@media (hover: hover) {
	header .header--sp .headerNav__item a:hover,
	header .header--sp .subNav__item a:hover,
	header .header--sp .headerNav .headerNav__item:nth-of-type(7):hover span,
	header .header--sp .utilitiesNav .subNav__item {
		opacity: var(--opacity);
	}
}

header .header--sp .headerNav .headerNav__item > a.current::after,
header .header--sp .headerNav .subNav__item > a.current::after,
header .header--sp .utilitiesNav .subNav__item > button.current::after {
	content: "";
	display: inline-block;
	position: absolute;
	bottom: -6px;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 3px;
	background-color: var(--green-2);
}

header .header--sp .headerNav .headerNav__item ~ .headerNav__item {
	margin-top: 1.5em;
}

header .header--sp .headerNav .headerNav__item:nth-of-type(7) > span {
	display: inline-block;
	width: 0.55em;
	height: 0.475em;
	background-image: url(../img/common/link-icon-g.svg);
	background-size: cover;
	background-repeat: no-repeat;
	transform: translateY(15%);
	margin-left: .25em;
	opacity: 1;
	transition: var(--hover-1);
}

header .header--sp .logoCnt {
	margin-top: var(--mt-m);
	text-align: center;
}

header .header--sp .logoCnt .logo {
	display: inline-block;
	width: 50%;
}

header .searchForm {
}

header .searchForm .gsc-control-cse {
	border: none;
	transition: background-color 0.1s 0.3s; 
}

header .searchForm .gsc-input-box {
	padding-top: 5px;
	border-top-left-radius: 2px;
	border-bottom-left-radius: 2px;
}

header .searchForm form.gsc-search-box {
	margin: 0;
}

header .searchForm form.gsc-search-box .gsib_a {
	color: black;
}

header .gsc-search-button {
	margin-left: 0;
}

header .gsc-search-button-v2 {
	padding: 10px 15px;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

header input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus {
	border-color: white !important;
}

header table.gsc-search-box td.gsc-input {
	padding-right: 0;
}

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

	header .header--pc .headerNavBox .rightItem .headerNav .headerNav__item ~ .headerNav__item {
		margin-left: clamp(5px,1.5em,80px);
	}

	header .header--pc .utilities {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
		gap: 1.25rem;
	}

	header .header--pc .utilitiesNav__item {

	}

	header .header--pc .searchForm {
	
	}

	header .searchForm .gsc-control-cse {
		padding: 0.75em;
	}

	table.gsc-search-box {
		margin-bottom: -2px;
	}

}

@media only screen and (max-width: 1024px) {
	#header {
        height: 7.05566406vw;
    }

	header .header--pc {
		display: none;
	}

	header .js-arrowTrigger {
		position: absolute;
		top: 100vh;
		left: 0;
		display: block;
		width: 100vw;
		height: 100vh;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}

	header .header--sp {
		display: block;
		visibility: visible;
		height: 7.05566406vw;
        background-color: rgba(255, 255, 255, 0.5);
        position: fixed;
        z-index: 6000;
        top: 0;
        width: 100%;
	}

	header .searchForm .gsc-control-cse {
		background-color: var(--glay-4);
	}

	header .header--sp .headerNavBox .leftItem{
		padding: 0 1.953125vw;
	}

	header .header--sp .headerNavBox .leftItem > .siteLogo{
		display: inline-block;
	    width: clamp(260px, 14.789063vw, 346px);
	    margin: 2.24609375vw 0 1.7578125vw 0;
	}

	header .header--sp .headerNavBox .leftItem > .siteLogo img{
	    width: 100%;
	}

	header .header--sp .menuBtn {
	    top: 1.57470703vw;
	    right: 1.57470703vw;
	}

	header .header--sp .headerNavCnt {
	    top: 0;
	}
}

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


/*  -----------------------------
	フッター
 -----------------------------  */
footer {
	position: relative;
	width: 100%;
	font-weight: 500;
}

footer > .footer--pc .upperCnt {
	gap: min(16px, 3vw);
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	color: var(--green-2);
	background-color: #68cb42;
	padding: 1.66666667vw 3.75vw 1.25vw 2.5vw;
}

@media only screen and (max-width: 1024px) {
    footer > .footer--pc .upperCnt {
        flex-direction: column;
    }
}

footer > .footer--pc .upperCnt .leftItem {
	width: 29.65277778vw;
	margin-right: 6.59722222vw;
}

@media only screen and (max-width: 1024px) {
	footer > .footer--pc .upperCnt .leftItem {
        margin: 15px auto 30px;
        width: auto;
	}
}

footer > .footer--pc .upperCnt .leftItem img{
	width: 100%;
}

footer > .footer--pc .upperCnt .middleItem {
	width: 50vw;
	margin: 0 5.75vw 0 0;
}

@media only screen and (max-width: 1024px) {
    footer > .footer--pc .upperCnt .middleItem {
        margin: 0 auto;
        width: 63.8671875vw;
	    min-width: 654px;
    }
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox {

}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > .footerNav {
	
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavMain li,
footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav li{
	color: #ffffff;

}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavMain{
	display: flex;
	justify-content: space-between;
	margin-bottom: 1.73611111vw;
}

@media only screen and (min-width: 360px) and (max-width: 1024px) {
	footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavMain {
	    margin-bottom: 30px;
	}
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavMain li{
	font-size: 32px;
    font-weight: 700;
}

@media only screen and (max-width: 1150px) {
	footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavMain li{
		 font-size: 30px;
	}
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns{
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li.footerNav__item{
    margin-right: 2.5vw;	
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li.footerNav__item:last-of-type{
    margin-right: 0;	
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.xTwitterIcon{
	width: 6.59722222vw;
	height: 6.73611111vw;
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.xTwitterIcon img{
	width: 100%;
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.youtubeIcon{
	width: 6.66666667vw;
	height: 4.72222222vw;
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.youtubeIcon img{
	width: 100%;
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.faceebookIcon{
	width: 6.73611111vw;
	height: 6.73611111vw;
}

footer > .footer--pc .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.faceebookIcon img{
	width: 100%;
}

footer > .footer--pc .upperCnt .middleItem .footerNavChapter{
	display: flex;
	justify-content: space-between;
}

@media only screen and (min-width: 360px) and (max-width: 1024px) {
	footer > .footer--pc .upperCnt .middleItem .footerNavChapter {
	    margin-top: 30px;
	}
}


footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav li{
	font-size: 20px;
	margin-bottom: 1.73611111vw;
	font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

@media only screen and (max-width: 1150px) {
	footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav li{
		 font-size: 18px;
	}
}

@media only screen and (min-width: 360px) and (max-width: 1024px) {
	footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav:first-of-type{
	    width: 55%;
	    margin-right: 5%;
	}

	footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav:last-of-type{
        width: 40%;
	}
}

footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav li a{
	display: flex;
	justify-content: flex-start;
}

footer > .footer--pc .upperCnt .middleItem .footerNavChapter > ol.ChapterNav li a span.shou{
	white-space: nowrap;
}

footer > .footer--pc .lowerCnt {
	color: white;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 32px;
	background-color: #253c16;
    padding: 1.25vw 6.25vw 1.25vw 5vw;
}

@media only screen and (max-width: 1024px) {
	footer > .footer--pc .lowerCnt {
		justify-content: center;
	}
}


footer > .footer--pc .lowerCnt > .leftItem {
	display: flex;
	gap: 48px;
}

footer > .footer--pc .lowerCnt > .leftItem .logo {
	display: inline-block;
	width: 245px;
}

footer > .footer--pc .lowerCnt > .leftItem .logo img {
	width: 100%;
}

footer > .footer--pc .lowerCnt .flexBox {
	gap: 16px;
}

footer > .footer--pc .lowerCnt .flexBox__copy {
	font-size: 1.8rem;
	font-family: OpenSans-SemiBold;
	font-weight: 700;
}

footer > .footer--pc .lowerCnt .flexBox__icon--x {
	width: 38px;
	height: 32px;
}

footer > .footer--pc .lowerCnt .flexBox__icon--youtube {
	width: 48px;
	height: 32px;
}

footer > .footer--pc .lowerCnt .flexBox__icon > img {
	width: 100%;
	height: 100%;
}

footer > .footer--pc .lowerCnt > .rightItem > .rights {
	/* 11.95px @ 1024px increasing to 16.8px @ 1440px */
	font-size: calc(0.746875rem + ((1vw - 10.24px) * 1.1659));
}

footer > .footer--sp {
	display: none;
}

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

	footer > .footer--pc .upperCnt .footerNavBox > .footerNav {
		grid-template-rows: repeat(7, auto);
	}

	footer > .footer--pc .upperCnt .leftItem {
		margin-top: 0;
	}

	footer > .footer--pc .upperCnt .rightItem {
		order: -2;
		place-self: end;
	}

	footer > .footer--pc .upperCnt .footerNav__item:nth-of-type(7) > span {
		right: auto;
		left: 7.5em;
	}
}

@media only screen and (max-width: 768px) {
	footer {

	}

	footer > .footer--pc {
		display: none;
	}

	footer > .footer--sp {
		display: block;
		color: white;
		text-align: center;
		padding: 0 0;
		background-color: #68cb42;
	}

	footer > .footer--sp .upperCnt {
        flex-direction: column;
		gap: min(16px, 3vw);
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
		color: var(--green-2);
		background-color: #68cb42;
		padding: max(40px, 4vw);
    }

    footer > .footer--sp .upperCnt .middleItem .footerNavBox .footerNavSns{
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin: 0 auto 30px;
        width: 80%;
    }

    footer > .footer--sp .upperCnt .middleItem .footerNavBox .footerNavSns li.footerNav__item{
        width: 20%;
    }

    footer > .footer--sp .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.xTwitterIcon{
    	width: 50px;
    	height: 50px;
    }

    footer > .footer--sp .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.youtubeIcon{
    	width: 50px;
    	height: 35px;
    }

    footer > .footer--sp .upperCnt .middleItem .footerNavBox > ol.footerNavSns li a.faceebookIcon{
    	width: 50px;
    	height: 50px;
    }

    footer > .footer--sp .upperCnt .middleItem .footerNavBox .footerNavSns li.footerNav__item a img{
        width: 100%;
    }

    footer > .footer--sp .upperCnt .leftItem {
        margin: 15px auto;
        width: auto;
    }

    footer > .footer--sp .upperCnt .leftItem img{
        width: 100%;
    }

	footer > .footer--sp .lowerCnt{
		background-color: #253c16;
	}

	footer > .footer--sp .lowerCnt .rightItem{
		font-size: 12px;
		padding: 5px;
	}

	footer::before {
		display: none;
	}

	footer > .footer--sp > .rights {
		font-size: 12px;
	}
}


/*  -----------------------------
	セカンドページ見出し
 -----------------------------  */
#heading {
	position: relative;
	display: grid;
	place-content: center;
	width: 100vw;
	height: 16.66666667;
	background-color: var(--glay-1);
}

#heading .heading_bg{
	position: relative;
	display: grid;
	place-content: center;
	width: 100vw;
    height: 16.66666667vw;
    background-color: #efefef;
}

#prologue_body #heading .heading_bg .icon80,
#chapter1_body #heading .heading_bg .icon80,
#chapter2_body #heading .heading_bg .icon80,
#chapter3_body #heading .heading_bg .icon80,
#chapter4_body #heading .heading_bg .icon80,
#chapter5_body #heading .heading_bg .icon80,
#chapter6_body #heading .heading_bg .icon80,
#chapter7_body #heading .heading_bg .icon80,
#chapter8_body #heading .heading_bg .icon80,
#chapter9_body #heading .heading_bg .icon80,
#references_body #heading .heading_bg .icon80,
#topics_body #heading .heading_bg .icon80,
#topics_test_body #heading .heading_bg .icon80,
#topics_detail_body #heading .heading_bg .icon80{
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 2;
	display: block;
	width: 22.41666667vw;
    height: 16.66666667vw;	
}

#prologue_body #heading .heading_bg .icon80 img,
#chapter1_body #heading .heading_bg .icon80 img,
#chapter2_body #heading .heading_bg .icon80 img,
#chapter3_body #heading .heading_bg .icon80 img,
#chapter4_body #heading .heading_bg .icon80 img,
#chapter5_body #heading .heading_bg .icon80 img,
#chapter6_body #heading .heading_bg .icon80 img,
#chapter7_body #heading .heading_bg .icon80 img,
#chapter8_body #heading .heading_bg .icon80 img,
#chapter9_body #heading .heading_bg .icon80 img,
#references_body #heading .heading_bg .icon80 img,
#topics_body #heading .heading_bg .icon80 img,
#topics_test_body #heading .heading_bg .icon80 img,
#topics_detail_body #heading .heading_bg .icon80 img {
	width: 100%;
}

body[data-category="column"] #heading .heading_bg .icon80 {
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 2;
	display: block;
	width: 22.41666667vw;
    height: 16.66666667vw;
}

body[data-category="column"] #heading .heading_bg img {
	width: 100%;
}

#heading::before {
	position: absolute;
	content: "";
    height: 16.66666667vw;
    width: 100vw;
    clip-path: polygon(0 0, 0% 100%, 100% 0);
    background-color: #d9d6ca;
    top: 0;
    left: 0;
    z-index: 1;
}

#heading::after {
	position: absolute;
	content: "";
	display: block;
    height: 7.08333333vw;
    max-height: 85px;
    width: 7.08333333vw;
    max-width: 85px;
    clip-path: polygon(0 0, 0% 100%, 100% 0);
    background-color: #253c16;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
    top: 0;
	left: 0;
    z-index: 1;
}

#heading .heading__title {
	position: relative;
	z-index: 5;
	font-size: 45px;
/*	font-size: 6.4rem;*/
	font-weight: 700;
	letter-spacing: 0.015em;
	text-align: center;
	padding: 0 1em;
}

@media only screen and (max-width: 1150px) {
	#heading .heading__title {
		/* 38px @ 1024px increasing to 45px @ 1150px */
		font-size: calc(2.375rem + ((1vw - 10.24px) * 5.5556));
	}
}

@media only screen and (min-width: 957px) and (max-width: 1024px) {
	#heading .heading__title {
		font-size: 38px;
	}
}

@media only screen and (min-width: 769px) and (max-width: 956px) {

	#heading .heading__title {
		/* 28px @ 769px increasing to 38px @ 956px */
		font-size: calc(1.75rem + ((1vw - 7.69px) * 5.3476));
	}
}

@media only screen and (min-width: 701px) and (max-width: 768px) {
	#heading .heading__title {
		font-size: 28px;
	}
}

@media only screen and (max-width: 768px) {
	#header {
		height: 60px;
	}
}

@media only screen and (min-width: 360px) and (max-width: 700px) {
	#heading .heading__title {
		/* 24px @ 360px increasing to 28px @ 700px */
		font-size: calc(1.5rem + ((1vw - 3.6px) * 1.1765));
	}
}

@media only screen and (max-width: 359px) {
	#heading .heading__title {
		/* 24px @ 360px increasing to 28px @ 700px */
		font-size: 24px;
	}
}

#heading .heading__title--s {
	font-size: 4.0rem;
	letter-spacing: 0.015em;
	margin-bottom: 0.2em;
}

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

}

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

/*  -----------------------------
	パンくずリスト
 -----------------------------  */
 .breadcrumbsCnt {
 	width: 100%;
 }

.breadcrumbs {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	max-width: 90vw;
    margin: 0 auto;
	padding: 0.5em 0;
}

.breadcrumbs li {
	display: inline;
}

.breadcrumbs li:not(:last-child)::after {
	content: " > ";
	margin-left: 0.5em;
}

.breadcrumbs li ~ li {
	margin-left: 0.5em;
}

.breadcrumbs li a {
	text-decoration: underline;
	opacity: 1;
	transition: var(--hover-1);
}

@media (hover: hover) {
	.breadcrumbs li a:hover {
		opacity: var(--opacity);
	}	
}

/*  -----------------------------
	SNS
 -----------------------------  */
#sns {
	color: black;
	text-align: center;
	width: 100%;
	padding: 40px 0 48px;
	background-color: var(--glay-3);
	margin-top: var(--mt-l);
}

#sns h2 {
	font-size: 3.2rem;
	font-weight: 700;
}

#sns .gridBox {
	grid-template-rows: 80px;
	grid-template-columns: repeat(3, 80px);
	place-content: center;
	column-gap: 64px;
	margin-top: var(--mt-s);
}

#sns .gridItem {
	
}

#sns .gridItem > img {
	width: 100%;
	height: 100%;
	transform: scale(1);
	transition: var(--hover-1);
}

@media (hover: hover) {
	#sns .gridItem:hover > img {
		transform: scale(1.1);
	}
}

@media only screen and (max-width: 767px) {
	#sns {
		padding: 32px 0 40px;
		margin-top: var(--mt-m);
	}

	#sns h2 {
		font-size: 2.6rem;
	}
	
	#sns .gridBox {
		grid-template-rows: 56px;
		grid-template-columns: repeat(3, 56px);
		column-gap: calc(56px * 0.75);
	}	
}


/*  -----------------------------
	ローダー
 -----------------------------  */
.loaderCnt {
	position: fixed;
	top: 0;
	left: 0;
	display: grid;
	place-content: center;
	width: 100vw;
	height: 100vh;
	background-color: var(--green-1);
	z-index: 500;
	opacity: 1;
	transform: translateX(0%);
	transform-origin: right;
}

.loaderCnt.loaded {
	animation: loaded 0.5s forwards;
}

@keyframes loaded {
	0%{
		transform: translateX(0%);
		opacity: 1;
	}
	100%{
		transform: translateX(100%);
		opacity: 0;
	}
}

#js-loader {
	display: grid;
	place-content: center;
	gap: 10%;
}

#js-loader progress {
	width: 100vw;
	block-size: 1.5vh;
	border-radius: 0;
}

#js-loader progress::-webkit-progress-bar {
	background-color: white;
}

#js-loader progress::-moz-progress-bar {
	background-color: white;
}

#js-loader progress::-webkit-progress-value {
	background-color: var(--green-2);
}

#js-loader progress::-ms-fill {
	background-color: var(--green-2);
}

#js-loader span {
	display: inline-block;
	color: var(--green-2);
	font-size: 2.4rem;
	font-weight: 500;
	text-align: center;
}


/*  -----------------------------
	スクロールアロー
 -----------------------------  */
.topScrollArrowWrapper {
	background-color: #d9d6ca;
}

.topScrollArrowWrapper .topScrollArrowInner{
    width: 100%;
	padding: 0.20833333vw 0 0.69444444vw;
}

.topScrollArrowWrapper .topScrollArrowInner img{
    width: 4.65277778vw;
}

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

	.topScrollArrowWrapper {
		display: flex;
		justify-content: flex-end;
		margin-top: var(--mt-s);
	}

	.topScrollArrow {
		display: none;
		flex-direction: column;
		align-items: center;
		padding-right: var(--mt-s);
		transition: var(--hover-1);
	}

	.topScrollArrow__icon {
		display: grid;
		place-content: center;
		width: max(32px,14vw);
		height: max(32px,14vw);
		border: 3px solid var(--green-2);
		border-radius: 50%;
		padding: 8px;
	}

	.topScrollArrow__icon > img {
		height: 28px;
		transform: translateX(25%);
		transition: var(--hover-1);
	}

	@media (hover: hover) {
		.topScrollArrow__icon:hover > img {
			transform: translate(25%, -10%);
			transition: var(--hover-1);
		}
	}

	.topScrollArrow__text {
		font-family: OpenSans-SemiBold;
		font-size: 0.8rem;
		margin-top: 1em;
	}

	.topScrollArrowWrapper .topScrollArrowInner img{
	    width: auto;
	}
}

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

	.topScrollArrowWrapper {
		margin-top: 0;
	}
}