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

reset

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

#page,
#page .container {
	all: unset;
	display: block;
}

main {
	all: unset;
	display: flow-root;
}

.page .wrapper {
	all: unset;
	display: block;
}

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

カスタムプロパティ

webcompoentnsにしたheaderとfooterでも使えるようにセレクターに追加

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

:root, :where(.gheader.webcomponents, .gfooter.webcomponents) {
	--header-height: 106px;
	--inner-width: 1370;
	
	--green: #3caa0a;
	--green-light: #6eb92b;
	--green-aa: #2E8208;
	--orange: #ea5504;
	--orange-dark: #ea5404;
	--blue: #169ae9;
	--black: #515151;
	--gray: #686868;
	--gray-light: #d9e3d2;
	--beige-light: #fbf7ef;
	
	--icon-settings: "FILL" 0, "wght" 500, "GRAD" 0, "opsz" 20;

	--fs-lg: 18.5px;
	--fs-ml: 17px;
	--fs-md: 16px;

	--line-height-sm: 1.6;
  
	--border-radius-lg: 20px;
	--border-radius-xl: 30px;


	--gap-col-2: 40px;
	--gap-col-3: 40px;
	--gap-col-4: 40px;

	--hover-transition: .15s ease-in;
}

@media (max-width:1420px) {

	:root, :where(.gheader.webcomponents, .gfooter.webcomponents) {
		--border-radius-md: 10px;
		--border-radius-lg: 20px;
		--border-radius-xl: 20px;
	}

}

@media (max-width:992px) {

	:root, :where(.gheader.webcomponents, .gfooter.webcomponents) {
		
	}

}

@media (max-width:880px) {

	:root, :where(.gheader.webcomponents, .gfooter.webcomponents) {
		--fs-lg: inherit;
	}

}

@media (max-width:768px) {

	:root, :where(.gheader.webcomponents, .gfooter.webcomponents) {
		--fs-lg: inherit;
		--fs-sm: 12px;
		--border-radius-lg: 16px;
		--border-radius-xl: 16px;
		--btn-wrap-mt: min(32px, calc(24 / 375 * 100vw));
	}

}

html {
	/*remの計算を簡単にするため*/
	font-size: 62.5%;
	/* scroll-behavior: smooth; */
}

body, :where(.gheader.webcomponents, .gfooter.webcomponents) {
	font-size: 14px;
	line-height: 1.7;
	color: #444;
	font-family: "Noto Sans", sans-serif;
	font-weight: 500;
	-webkit-text-size-adjust: 100%;
	/* font-feature-settings: 'palt' 1; */
	/* letter-spacing: .05em; */
}

@media (max-width:768px) {
	body, :where(.gheader.webcomponents, .gfooter.webcomponents) {
		letter-spacing: .01em;
	}
}

img,
svg,
iframe,
picture,
video {
	vertical-align: top;
}

img {
	max-width: 100%;
	height: auto;
}

video {
	max-width: 100%;
}

b,strong {
	font-weight: bold;
}

strong {
	color: var(--green);
}

em,i {
	font-style: normal;
}

small {
	font-size: .8em;
}

a {
	color: inherit;
}

:where(a:any-link) {
	color: inherit;
	text-decoration: underline;
	transition: opacity 0.3s ease-in-out;
}

@media (any-hover: hover) {
	:where(a:any-link:hover) {
		opacity: .75;
		text-decoration: none;
	}
}

:target {
	scroll-margin-top: 70px;
}

@media screen and (max-width:575px) {
	:target {
		scroll-margin-top: 58px;
	}
}



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



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

body.overflow-hidden {
	overflow: hidden;
  }
  
  /* #page .container #contents {
	width: 100%;
	max-width: 1360px;
	margin: 0 auto;
	padding: 0 40px 0;
	box-sizing: border-box;
  } */

#cookie-law-info-bar span a {
	box-sizing: content-box;
}