@font-face {
	font-family: 'NotoSansJP-Medium';
	src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.ttf) format('truetype');
}
@font-face {
	font-family: 'NotoSansJP-SemiBold';
	src: url(../fonts/Noto_Sans_JP/NotoSansJP-SemiBold.ttf) format('truetype');
}
@font-face {
	font-family: 'SourceHanSerifJP-SemiBold';
	src: url(../fonts/SourceHanSerifJP/SourceHanSerifJP-SemiBold.otf) format('opentype');
}
@font-face {
	font-family: 'RedditSans-SemiBold';
	src: url(../fonts/Reddit_Sans/RedditSans-SemiBold.ttf) format('truetype');
}

:root {
	--pc-height: 78px;
	--sp-height: 74px;
	--header_bg: rgba(255, 255, 255, 0.9);
	--footer_bg:      rgba(15, 50, 71, 1);
	--footer_bg_over: rgba(15, 50, 71, 0.85);
	--blue_1_bg: rgba(127, 210, 246, 0.25);
	--blue_1_border:  rgba(45, 158, 192, 1);
	--blue-link_out:  rgba(0, 151, 255, 1);
	--blue-link_over: rgba(0, 125, 212, 1);
	--logo_black_svg: url('data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22_x31_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%20200%20182%22%3E%0A%3Ccircle%20cx%3D%2266.7599494%22%20cy%3D%2266.262488%22%20r%3D%227.5111486%22%2F%3E%0A%3Cg%3E%0A%3Cpath%20d%3D%22M109.3080444%2C1c-26.7235718%2C0-50.7502441%2C11.7519531-67.196228%2C30.3543701h24.9222412c11.9335327-8.5264893%2C26.5220337-13.5647583%2C42.2739868-13.5647583%2C40.1981201%2C0%2C72.9023438%2C32.7037964%2C72.9023438%2C72.9023438%2C0%2C37.6622314-28.7086792%2C68.7446289-65.3911743%2C72.5165405v-14.694458c28.3808594-3.6685791%2C50.4262085-27.805603%2C50.7920532-57.0857544h-16.7896729c-.395813%2C22.5614014-18.859436%2C40.7958984-41.5135498%2C40.7958984-18.5396729%2C0-34.2770386-12.2123413-39.6002808-29.0136719h-17.354248c5.2214355%2C23.7709351%2C24.9758911%2C42.156311%2C49.4433594%2C45.317688v14.6695557c-33.59552-3.4570312-60.4868774-29.8193359-64.772644-63.1682129h-16.9235229c4.6850586%2C45.0843506%2C42.9039307%2C80.3543701%2C89.2073364%2C80.3543701%2C49.4558716%2C0%2C89.6919556-40.236084%2C89.6919556-89.6919556C199%2C41.2356567%2C158.763916%2C1%2C109.3080444%2C1Z%22%2F%3E%0A%3Cpath%20d%3D%22M37.1064453%2C80.5889282c.3278809-2.3527832.7724609-4.6681519%2C1.3203125-6.9439697h16.0941162v-15.9060059h-10.2251587c1.2191162-2.3935547%2C2.5666504-4.7111816%2C4.0333862-6.9439697h25.9421387v-15.9059448H14.7559204l-7.0692749%2C15.9059448h21.3144531c-1.1286621%2C2.2620239-2.1619263%2C4.5787964-3.1000366%2C6.9439697H4.593811l-3.0928345%2C15.9060059h19.7613525c-.4418945%2C2.2854614-.7962036%2C4.600769-1.0603638%2C6.9439697H1l2.2683105%2C15.9059448h71.5768433v-15.9059448h-37.7387085Z%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E');
	--logo_white_svg: url('data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22_x31_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%20200%20182%22%3E%0A%3Cdefs%3E%0A%3Cstyle%3E%0A.st0%20%7B%0Afill%3A%20%23fff%3B%0A%7D%0A%3C%2Fstyle%3E%0A%3C%2Fdefs%3E%0A%3Ccircle%20class%3D%22st0%22%20cx%3D%2266.7599494%22%20cy%3D%2266.262488%22%20r%3D%227.5111486%22%2F%3E%0A%3Cg%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M109.3080444%2C1c-26.7235718%2C0-50.7502441%2C11.7519531-67.196228%2C30.3543701h24.9222412c11.9335327-8.5264893%2C26.5220337-13.5647583%2C42.2739868-13.5647583%2C40.1981201%2C0%2C72.9023438%2C32.7037964%2C72.9023438%2C72.9023438%2C0%2C37.6622314-28.7086792%2C68.7446289-65.3911743%2C72.5165405v-14.694458c28.3808594-3.6685791%2C50.4262085-27.805603%2C50.7920532-57.0857544h-16.7896729c-.395813%2C22.5614014-18.859436%2C40.7958984-41.5135498%2C40.7958984-18.5396729%2C0-34.2770386-12.2123413-39.6002808-29.0136719h-17.354248c5.2214355%2C23.7709351%2C24.9758911%2C42.156311%2C49.4433594%2C45.317688v14.6695557c-33.59552-3.4570312-60.4868774-29.8193359-64.772644-63.1682129h-16.9235229c4.6850586%2C45.0843506%2C42.9039307%2C80.3543701%2C89.2073364%2C80.3543701%2C49.4558716%2C0%2C89.6919556-40.236084%2C89.6919556-89.6919556C199%2C41.2356567%2C158.763916%2C1%2C109.3080444%2C1Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M37.1064453%2C80.5889282c.3278809-2.3527832.7724609-4.6681519%2C1.3203125-6.9439697h16.0941162v-15.9060059h-10.2251587c1.2191162-2.3935547%2C2.5666504-4.7111816%2C4.0333862-6.9439697h25.9421387v-15.9059448H14.7559204l-7.0692749%2C15.9059448h21.3144531c-1.1286621%2C2.2620239-2.1619263%2C4.5787964-3.1000366%2C6.9439697H4.593811l-3.0928345%2C15.9060059h19.7613525c-.4418945%2C2.2854614-.7962036%2C4.600769-1.0603638%2C6.9439697H1l2.2683105%2C15.9059448h71.5768433v-15.9059448h-37.7387085Z%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E');

	--base_font_color: rgba(44, 52, 62, 1);
	--font-mincho: 'Hiragino Mincho ProN', 'SourceHanSerifJP Regular', 'ＭＳ Ｐ明朝', 'MS明朝', serif;
}

* {
	margin: 0;
	padding: 0;
	line-height: 1;
	box-sizing: border-box;
}

html, body {
	font-size: 16px;
}

body {
	margin: 0;
	padding: 0;
	background-color: #fff;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', /* 'Hiragino Sans', */ 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, 'メイリオ', arial, sans-serif;
	/* color: #000; */
	color: var(--base_font_color);
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: unset;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),(min-resolution: 2dppx) {
	body {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}

ul, ol {
	list-style: none;
}

fieldset, img {
	border: none;
}

table {
	border-collapse: collapse;
}

a, a:focus, *:focus {
	outline: none;
}

a:link {
	text-decoration: none;
	color: rgba(0, 151, 255, 1);
}

a:visited {
	text-decoration: none;
	color: rgba(0, 151, 255, 0.5);
}

a:hover, 
a:active {
	text-decoration: underline;
}

#main {
	margin: 0;
	padding: 0;
}

/****************************
  header
****************************/

.header {
	position: fixed;
	z-index: 200;
	top: 0;
	left: 0;
	right: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: var(--sp-height);
	margin: 0;
	padding: 0 0 0 8px;
	background-color: var(--header_bg);
	transition: all 0.5s;
}

.header.hide {
	transform: translateY(calc(0px - var(--sp-height)));
}

#logo {
	display: table;
	height: 100%;
	margin: 0;
	padding: 0;
	background-image: var(--logo_black_svg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 40px auto;
}

#logo > a {
	display: table-cell;
	margin: 0;
	padding: 3px 0 0 46px;
	vertical-align: middle;
	text-align: left;
	font-size: 16px;
	color: var(--base_font_color);
	text-decoration: none;
}

#logo > a > span {
	display: block;
	margin: 0;
	padding: 0;
	background-image: url(../../assets/images/logo_type_black.svg);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 170px auto;
	font-size: 25px;
	color: transparent;
}

#logo > a > span + span {
	padding: 0 0 0 3px;
	background: none;
	font-size: 10px;
	line-height: 1;
	color: var(--base_font_color);
}

@media (min-width: 1000px) {
	.header {
		height: var(--pc-height);
		padding: 0 50px;
	}

	.header.hide {
		transform: translateY(calc(0px - var(--pc-height)));
	}

	#logo {
		background-size: 48px auto;
	}

	#logo > a {
		display: table-cell;
		margin: 0;
		padding: 4px 0 0 54px;
		vertical-align: middle;
		text-align: left;
		font-size: 16px;
		text-decoration: none;
	}

	#logo > a > span {
		display: block;
		margin: 0;
		padding: 0;
		background-image: url(../../assets/images/logo_type_black.svg);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: 190px auto;
		font-size: 29px;
		color: transparent;
	}

	#logo > a > span + span {
		padding: 1px 0 0 2px;
		background: none;
		font-size: 12px;
		line-height: 1;
	}
}

#nav-toggle {
	position: fixed;
	z-index: 220;
	top: 14px;
	right: 12px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100px;
	height: 42px;
	margin: 0;
	padding: 0;
	border-radius: 42px;
	background-color: var(--footer_bg);
	text-align: left;
	font-size: 16px;
	line-height: 42px;
	cursor: pointer;
	text-decoration: none;
	user-select: none;
	visibility: visible;
	opacity: 1;
	transition: all 0.5s;
}

#nav-toggle.hide {
	opacity: 0;
	visibility: hidden;
}

#nav-toggle > div {
	display: block;
	width: 16px;
	height: 14px;
	margin: 0;
	padding: 0;
	position: relative;
}

#nav-toggle > span {
	transform: translateY(-1px);
	display: block;
	margin: 0;
	padding: 0 0 0 12px;
	text-align: left;
	font-size: 16px;
	line-height: 1;
	color: #fff;
	content: 'Menu';
}

#nav-toggle > div > span {
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #fff;
	transition: 0.2s;
}

#nav-toggle > div > span:nth-child(1) {
	top: 0;
}

#nav-toggle > div > span:nth-child(2) {
	top: 5px;
}

#nav-toggle > div > span:nth-child(3) {
	top: 10px;
}

.open #nav-toggle > div > span:nth-child(1) {
	top: 5px;
	transform: rotate(-45deg);
}

.open #nav-toggle > div > span:nth-child(2) {
	width: 0;
	left: 50%;
}

.open #nav-toggle > div > span:nth-child(3) {
	top: 5px;
	transform: rotate(45deg);
}

.open #nav-toggle {
	background-color: #fff;
}

.open #nav-toggle > span {
	color: var(--footer_bg);
}

.open #nav-toggle > div > span {
	background-color: var(--footer_bg);
}

@media (min-width: 1000px) {
	#nav-toggle {
		top: 16px;
		right: 50px;
		width: 118px;
		height: 46px;
		border-radius: 46px;
		font-size: 16px;
		line-height: 1;
	}

	#nav-toggle > div {
		width: 16px;
		height: 14px;
	}

	#nav-toggle > span {
		transform: translateY(0);
		padding: 0 0 0 13px;
		font-size: 17px;
	}

	#nav-toggle > div > span:nth-child(1) {
		top: 0;
	}

	#nav-toggle > div > span:nth-child(2) {
		top: 6px;
	}

	#nav-toggle > div > span:nth-child(3) {
		top: 12px;
	}

	.open #nav-toggle > div > span:nth-child(1) {
		top: 6px;
	}

	.open #nav-toggle > div > span:nth-child(3) {
		top: 6px;
	}
}

#global_nav {
	position: fixed;
	z-index: 210;
	top: 0;
	bottom: 0;
	right: 0;
	transform: translateX(100%);
	display: inline-block;
	margin: 0;
	padding: calc(var(--sp-height) + 10px) 0 80px;
	background-color: var(--footer_bg);
	text-align: left;
	transition: all 0.5s;
}

.open #global_nav {
	transform: translateX(0);
	display: block;
	overflow-y: auto;
}

#global_nav > ul {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
}

#global_nav > ul > li {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	text-align: left;
	font-weight: normal;
	font-style: normal;
	font-size: 16px;
	line-height: 1;
}

#global_nav > ul > li > a {
	display: block;
	margin: 0;
	padding: 15px 0 15px 30px;
	text-align: left;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 1;
	color: #fff;
	text-decoration: none;
	user-select: none;
}

#global_nav > ul > li:last-child {
	border-bottom: none;
}

#global_nav > ul > li > ul {
	overflow: hidden;
	width: 100%;
	height: 0;
	margin: 0;
	padding: 0;
	transition: all 0.3s;
}

#global_nav > ul > li > ul > li {
	margin: 0;
	padding: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.25);
}

#global_nav > ul > li > ul > li > a {
	display: block;
	margin: 0;
	padding: 15px 0 15px 46px;
	text-align: left;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 1;
	color: #fff;
	text-decoration: none;
	user-select: none;
}

#global_nav li a:hover, 
#global_nav li a.active {
	background-color: rgba(255, 255, 255, 0.05);
	text-decoration: none;
}

#collapse_nav_button {
	transition: all 0.3s;
	position: relative;
}

#collapse_nav_button::after {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	display: block;
	font-family: 'FontAwesome';
	font-size: 18px;
	line-height: 1;
	color: #fff;
	content: '\f107';
}

#collapse_nav_button.active::after {
	content: '\f106';
}

#global_nav {
	width: 80%;
}

@media (min-width: 500px) {
	#global_nav {
		width: 70%;
	}
}
@media (min-width: 768px) {
	#global_nav {
		width: 40%;
	}
}
@media (min-width: 1000px) {
	#global_nav {
		width: 30%;
		padding: calc(var(--pc-height) + 10px) 0 80px;
	}
}

/****************************
  footer
****************************/

#footer {
	width: 100%;
	margin: 0;
	padding: 20px 15px;
	background-color: var(--footer_bg);
}

#footer > div {
	width: 100%;
	margin: 0;
	padding: 0;
}

#footer a {
	color: #fff;
	text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
}

#footer > div > div > a {
	display: block;
	margin: 0;
	padding: 0 0 0 36px;
	background-repeat: no-repeat;
	background-position: left top;
	background-size: auto 26px;
	background-image: var(--logo_white_svg);
	text-align: left;
	font-weight: normal;
	font-style: normal;
	font-size: 26px;
	line-height: 26px;
	white-space: nowrap;
}

#footer > div > div > a,
#footer > div > div > a:hover {
	text-decoration: none;
}

#footer > div > div > a > img {
	width: 180px;
	height: initial;
	vertical-align: 0px;
}

#footer > div > nav {
	margin: 0;
	padding: 0;
}

#footer > div > nav ul {
	margin: 0;
	padding: 1em 0 0;
	text-align: left;
}

#footer > div > nav ul + ul {
	padding-top: 0;
}

#footer > div > nav li {
	display: inline-block;
	margin: 0;
	padding: 15px 10px 0 0;
}

#footer > div > nav li a {
	font-size: 13px;
	line-height: 1;
}

#copy {
	display: block;
	width: 100%;
	margin: 0;
	padding: 20px 0 0;
	text-align: left;
	font-weight: normal;
	font-style: normal;
	font-size: 12px;
	line-height: 1;
	color: #fff;
}

#now_year {
	padding: 0 0.5em 0 0;
}

@media (min-width: 1000px) {
	#footer {
		padding: 30px 30px;
	}

	#footer > div {
		display: flex;
		justify-content: space-between;
	}

	#footer > div > div > a {
		padding-left: 37px;
	}

	#footer > div > div > a > img {
		width: 180px;
		height: initial;
		vertical-align: 0px;
	}

	#footer > div > nav {
		margin: 0;
		padding: 0;
	}

	#footer > div > nav ul {
		margin: 0;
		padding: 0;
		text-align: right;
	}

	#footer > div > nav ul + ul {
		padding-top: 1.5em;
	}

	#footer > div > nav li {
		display: inline-block;
		margin: 0;
		padding: 0 0 0 1em;
		text-align: right;
	}

	#footer > div > nav li a {
		font-size: 14px;
		line-height: 1;
	}

	#copy {
		padding: 20px 0 0;
		text-align: left;
		font-size: 13px;
		line-height: 1;
	}
}

/****************************
  fix footer
****************************/

body, 
#wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

#footer {
	margin-top: auto;
}

/****************************
  toTop
****************************/

a#toTop {
	display: none;
	position: fixed;
	z-index: 150;
	right: 15px;
	bottom: 160px;
	width: 57px;
	height: 66px;
	margin: 0;
	padding: 0;
	background-position: left top;
	background-size: 57px 66px;
	background-repeat: no-repeat;
	background-image: url('data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22_x31_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2057%2066%22%3E%0A%3Cdefs%3E%0A%3Cstyle%3E%0A.st0%20%7B%0Afill%3A%20%230f3247%3B%0A%7D%0A.st1%20%7B%0Afill%3A%20none%3B%0Astroke%3A%20%230f3247%3B%0Astroke-miterlimit%3A%2010%3B%0Astroke-width%3A%202px%3B%0A%7D%0A%3C%2Fstyle%3E%0A%3C%2Fdefs%3E%0A%3Ccircle%20class%3D%22st1%22%20cx%3D%2228.5%22%20cy%3D%2244%22%20r%3D%2221%22%2F%3E%0A%3Cg%3E%0A%3Cg%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M2.2639999.176c1.0039999%2C0%2C1.5999999.132%2C2.1409998.548.6620002.515.895%2C1.339.895%2C2.03%2C0%2C2.5569999-2.3629999%2C2.5569999-3.2130001%2C2.5569999h-1.0489997v3.5120001H0V.176h2.2639999ZM2.197%2C4.368c.717%2C0%2C2.0650001%2C0%2C2.0650001-1.6030002%2C0-1.645-1.3140001-1.645-2.0650001-1.645h-1.159v3.2480001h1.159Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M8.0249996%2C6.2670002l-.9489994%2C2.5579996h-1.171L9.217.177h1.4569998l3.3120003%2C8.6479998h-1.1700001l-.9499998-2.5570002h-3.8410006v-.0009995ZM11.5249996%2C5.3460002l-1.5790005-4.2150002-1.5779991%2C4.2150002h3.1569996Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M22.0440006%2C1.79c-.8169994-.5929999-1.6450005-.846-2.6599998-.846-2.1860008%2C0-3.7539997%2C1.3399999-3.7539997%2C3.5239999%2C0%2C1.7220001.9720001%2C3.5879998%2C3.9080009%2C3.5879998%2C1.0489998%2C0%2C1.6889992-.2410002%2C1.9650002-.3400002v-2.6119995h-2.4279995v-.9330001h3.4549999v4.2259994c-.9610023.4050007-1.9880028.6030006-3.0360031.6030006-3.4330006%2C0-4.9020004-2.2720003-4.9020004-4.5110002%2C0-2.6229999%2C1.9869995-4.4889998%2C4.8029995-4.4889998%2C1.5890007%2C0%2C2.6049995.571%2C3.0130005.802l-.3639984.9879999Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M29.0090008%2C3.875v.9440002h-3.8530006v3.0620003h4.3829994v.9440002h-5.4209995V.176h5.2550011v.944h-4.2180004v2.7540001h3.8540001v.0009999Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M37.7949982%2C8.8249998h-1.0379982V1.12h-2.9150009V.176h6.8670006v.944h-2.9140015v7.7049998Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M45.862999%2C0c2.4830017%2C0%2C4.5040016%2C1.79%2C4.5040016%2C4.5%2C0%2C2.711-2.0209999%2C4.5-4.5040016%2C4.5-2.4729996%2C0-4.5149994-1.7670002-4.5149994-4.5s2.0419998-4.5%2C4.5149994-4.5ZM45.862999%2C8.0559998c2.1080017%2C0%2C3.4770012-1.7220001%2C3.4770012-3.5559998%2C0-1.8329999-1.3689995-3.556-3.4770012-3.556-2.1090012%2C0-3.4889984%2C1.7130001-3.4889984%2C3.556.0009995%2C1.8439999%2C1.3800011%2C3.5559998%2C3.4889984%2C3.5559998Z%22%2F%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M53.9640007.176c1.0040016%2C0%2C1.5999985.132%2C2.1409988.548.663002.516.8950005%2C1.339.8950005%2C2.0310001%2C0%2C2.5570002-2.362999%2C2.5570002-3.2130013%2C2.5570002h-1.0489998v3.5120001h-1.0379982V.176h2.2639999ZM53.8979988%2C4.368c.7169991%2C0%2C2.0649986%2C0%2C2.0649986-1.6030002%2C0-1.645-1.3139992-1.645-2.0649986-1.645h-1.1590004v3.2480001h1.1590004Z%22%2F%3E%0A%3C%2Fg%3E%0A%3Cpolyline%20class%3D%22st1%22%20points%3D%2238.1479988%2046.9609985%2028.4990005%2037.3590012%2018.8519993%2046.9609985%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E');
	text-decoration: none;
}

@media (min-width: 1000px) {
	a#toTop {
		right: 40px;
		bottom: 150px;
	}
}

/****************************
  effect
****************************/

.effect,
.effect_scroll {
	overflow: hidden;
}

@media (min-width: 821px) {
	.effect .effect_each, 
	.effect_scroll .effect_scroll_each {
		opacity: 0;
		transition: opacity 1.0s ease 0s, transform 1.0s ease 0s;
	}

	.effect .effect_each.effect_view, 
	.effect_scroll .effect_scroll_each.effect_view {
		opacity: 1;
		transform: translate(0, 0);
	}

	.effect_slide_left {
		transform: translate(20px, 0);
	}

	.effect_slide_right {
		transform: translate(-20px, 0);
	}

	.effect_slide_top {
		transform: translate(0, 20px);
	}

	.effect_slide_bottom {
		transform: translate(0, -20px);
	}

	.effect .effect_each.delay1, 
	.effect_scroll .effect_scroll_each.delay1 {
		transition-delay: 0.4s;
		transition-delay: 0.2s;
	}

	.effect .effect_each.delay2, 
	.effect_scroll .effect_scroll_each.delay2 {
		transition-delay: 0.6s;
		transition-delay: 0.4s;
	}

	.effect .effect_each.delay3, 
	.effect_scroll .effect_scroll_each.delay3 {
		transition-delay: 0.8s;
		transition-delay: 0.6s;
	}

	.effect .effect_each.delay4, 
	.effect_scroll .effect_scroll_each.delay4 {
		transition-delay: 1.0s;
		transition-delay: 0.8s;
	}

	.effect .effect_each.delay5, 
	.effect_scroll .effect_scroll_each.delay5 {
		transition-delay: 1.2s;
		transition-delay: 1s;
	}

	.effect .effect_each.delay6, 
	.effect_scroll .effect_scroll_each.delay6 {
		transition-delay: 1.4s;
		transition-delay: 1.2s;
	}

	.effect .effect_each.delay7, 
	.effect_scroll .effect_scroll_each.delay7 {
		transition-delay: 1.6s;
		transition-delay: 1.4s;
	}
}

@media (min-width: 821px) {
	.effect .effect_slide_height {
		transform: scaleY(0);
		transform-origin: left bottom;
		transition: transform 0.5s ease-out 0.5s;
	}

	.effect .effect_slide_height.effect_view {
		transform: scaleY(1);
	}

	.effect_scroll .effect_each_slide_height {
		transform: scaleY(0);
		transform-origin: left top;
		transition: transform 0.5s ease-out 0s;
	}

	.effect_scroll .effect_each_slide_height.effect_view {
		transform: scaleY(1);
	}

	.effect .effect_slide_height.delay1,
	.effect_scroll .effect_each_slide_height.delay1 {
		transition-delay: 1.4s;
	}

	.effect .effect_slide_height.delay2,
	.effect_scroll .effect_each_slide_height.delay2 {
		transition-delay: 1.7s;
	}

	.effect .effect_slide_height.delay3,
	.effect_scroll .effect_each_slide_height.delay3 {
		transition-delay: 2.0s;
	}

	.effect .effect_slide_height.delay4,
	.effect_scroll .effect_each_slide_height.delay4 {
		transition-delay: 2.4s;
	}

	#home_service .effect_scroll .effect_each_slide_height.delay1 {
		transition-delay: 0s;
	}

	#home_service .effect_scroll .effect_each_slide_height.delay2 {
		transition-delay: 0.5s;
	}

	#home_service .effect_scroll .effect_each_slide_height.delay3 {
		transition-delay: 1.0s;
	}
}

/****************************
  pagination
****************************/

.pagination {
	display: block;
	width: 100%;
	margin: 30px auto 0px;
	padding: 0;
	text-align: center;
}

.pagination a, 
.pagination span {
	display: inline-block;
	min-width: 28px;
	height: 28px;
	line-height: 28px;
	margin: 0 2px;
	padding: 0 2px;
	text-align: center;
	font-weight: normal;
	font-size: 14px;
}

.pagination a:link, 
.pagination a:visited {
	background-color: #f3f3f3;
	color: var(--base_font_color);
	text-decoration: none;
}

.pagination a:hover, 
.pagination a:active, 
.pagination a.active, 
.pagination span {
	background-color: var(--footer_bg);
	color: #fff;
	text-decoration: none;
}

.pagination a.active {
	pointer-events : none;
}

.pagination span.disabled {
	background-color: transparent;
	color: #aaa;
}

.icon_angle {
	font-size: 14px;
}

.pagination a.nav_page {
	background-color: transparent;
	color: var(--base_font_color);
}

@media (max-width: 768px) {
	.pagination {
		text-align: left;
	}
}

/****************************
  misc
****************************/

.clearfix:before {
	display: table;
	content: '';
}

.clearfix:after {
	display: table;
	content: '';
	clear: both;
}

.responsive {
	width: 100%;
	height: initial;
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}

@media (max-width: 999px) {
	.hide_if_sp {
		display: none;
	}
}
@media (min-width: 1000px) {
	.hide_if_pc,
	#global_nav > ul > li.hide_if_pc {
		display: none;
	}
}

.error_wrapper {
	height: calc(100svh - 530px);
	margin: 0;
	padding: 150px 0 0;
}

.error_h1 {
	margin: 0;
	padding: 0;
	text-align: center;
	font-style: normal;
	font-weight: normal;
	font-size: 20px;
	line-height: 1;
}

.error_h2 {
	margin: 0;
	padding: 30px 0 0;
	text-align: center;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 1;
}

@media (min-width: 1000px) {
	.error_wrapper {
		height: calc(100vh - 450px);
		padding: 150px 0 0;
	}

	.error_h1 {
		font-size: 26px;
	}

	.error_h2 {
		font-size: 16px;
	}
}

/**/

.article_title {
	margin: 0;
	padding: 0;
	font-size: 20px;
	line-height: 1;
	color: #333;
}

.article_title > b {
	display: inline-block;
	margin: 0;
	padding: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 1em;
}

.article_title > i {
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 0 0 0 11px;
	border-left: 1px solid #333;
	font-style: normal;
	font-weight: normal;
	font-size: 1.1em;
}

@media (min-width: 1000px) {
	.article_title {
		font-size: 23px;
	}

	.article_title > i {
		margin: 0 0 0 12px;
		padding: 0 0 0 13px;
		border-left: 2px solid #333;
	}
}

a.readmore {
	display: inline-block;
	margin: 0;
	padding: 0 20px;
	background-color: var(--footer_bg);
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 3;
	color: #fff;
	text-decoration: none;
	white-space: nowrap;
	user-select: none;
	transition: all 0.3s;
}

a.readmore:hover {
	background-color: var(--footer_bg_over);
	text-decoration: none;
}