@charset "utf-8";

@import url(./src/jQ.HumbergerNav.css);
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Jost:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Nothing+You+Could+Do&display=swap");

body {
	font-family : "Noto Sans JP";
}

* {
	scroll-margin-top : 120px;
}


ruby {
	line-height : 2.8;
}

.__pc {
	display : unset;
}
.__tab {
	display : none;
}
.__sp {
	display : none;
}

/* form */
input.long,
select.long,
textarea.long {
	width : 24em;
}
input.middle,
select.middle,
textarea.middle {
	width : 16em;
}
input.short,
select.short,
textarea.short {
	width : 8em;
}
input.tel {
	width : 4em;
}
input.zipcode {
	width : 4em;
}

/*  */
ul > li.mark,
ol > li.mark {
	padding-left : 2em;
	text-indent : -2em;
}

/* pagenation */
.pagenation {
	display : flex;
	justify-content : center;
	align-items : center;
	margin-top : 32px;
}
.pagenation a,
.pagenation .current span {
	display : block;
	padding : 8px;
	border : 1px solid #dddddd;
	border-radius : 3px;
	background-color : #ffffff;
}
.pagenation a:hover {
	color : #999999;
	background-color : #f3f3f3;
}
.pagenation .pagenation__body {
	display : flex;
	justify-content : center;
	align-items : center;
	margin : 0 1em;
}
.pagenation .pagenation__body li:not(:last-child) {
	margin-right : 0.5em;
}
.pagenation .pagenation__body li.current span {
	color : #ffffff;
	border : 1px solid #f7c242;
	border-radius : 3px;
	background-color : #f7c242;
}

/* pagetop */
#pageTop a {
	display : flex;
	z-index : 1;
	position : fixed;
	right : 0;
	bottom : 0;
	overflow : hidden;
	justify-content : center;
	align-items : center;
	width : 60px;
	height : 60px;
	background-color : #f7c242;
}
#pageTop a::before {
	display : inline-block;
	position : absolute;
	width : 12px;
	height : 12px;
	content : "";
	transform : translateY(50%) rotate(-45deg);
	border-top : 1px solid #ffffff;
	border-right : 1px solid #ffffff;
}

/*  */

body.__header_black #pageHeader {
	background-color : rgba(255, 255, 255, 0.9);
}
body.__header_black #globalNav .main > li a {
	color : #00297b;
}
body.__header_black #globalNav .sub > li a {
	color : #00297b;
}
body.__header_black #globalNav .sub > li {
	border-right : 1px solid #00297b;
}
body.__header_black #globalNav .sub > li:first-child {
	border-left : 1px solid #00297b;
}
body.__header_black #pageHeader .logo .copy {
	color : #00297b;
}
#pageHeader {
	z-index : 2;
	position : sticky;
	top : 0;
}
#pageHeader > .inner {
	margin : 0 auto;
	padding : 0 32px;
}
#pageBottom > .inner,
#pageFooter > .inner,
#pageBody > header > .inner,
#pageBody > section > .inner,
#copyright > .inner {
	width : 100%;
	max-width : 1220px;
	margin : 0 auto;
	padding : 0 32px;
}
#pageBody > header.narrow > .inner,
#pageBody > section.narrow > .inner {
	max-width : 1024px;
}


/* pageHeader */
#pageHeader {
	z-index : 2;
	position : fixed;
	top : 0;
	width : 100%;
	transition : background-color 0.3s ease-out;
}
#pageHeader > .inner {
	display : grid;
	grid-template-columns : auto 1fr;
	grid-gap : 40px;
	height : 95px;
	padding-right : 0;
}
#pageHeader .logo {
	display : flex;
	flex-direction : column;
	justify-content : center;
	align-items : center;
	color : #ffffff;
}
#pageHeader .logo .copy {
	font-size : 0.725em;
	margin-bottom : 6px;
}

/* globalNav */
#globalNav {
	display : grid;
	grid-template-columns : 1fr 95px;
	grid-gap : 0 32px;
	flex-direction : column-reverse;
}
#globalNav .main {
	display : flex;
	grid-column : 1/2;
	grid-row : 2/2;
	justify-content : flex-end;
	align-items : center;
}
#globalNav .main > li {
	display : flex;
	height : 100%;
}
#globalNav .main > li:not(:last-child) {
	margin-right : 1em;
}
#globalNav .main > li a {
	display : flex;
	justify-content : center;
	align-items : center;
	height : 100%;
	padding : 0.5em;
	color : #ffffff;
}
#globalNav .sub {
	display : flex;
	grid-column : 1/2;
	grid-row : 1/2;
	justify-content : flex-end;
	align-items : flex-end;
}
#globalNav .sub > li {
	padding : 0 0.75em;
	border-right : 1px solid #ffffff;
}
#globalNav .sub > li:first-child {
	border-left : 1px solid #ffffff;
}
#globalNav .sub > li a {
	display : flex;
	font-size : 0.875em;
	justify-content : center;
	align-items : center;
	color : #ffffff;
}
#globalNav .sub .bogo-language-switcher {
	display : flex;
	justify-content : center;
	align-items : center;
}
#globalNav .sub .bogo-language-switcher > li {
	display : flex;
	justify-content : center;
	align-items : center;
}
#globalNav .sub .bogo-language-switcher > li.current {
	display : none;
}
#globalNav .sub .bogo-language-switcher > li a {
	padding : 0;
}
#globalNav .sub .bogoflags {
	display : flex;
	justify-content : center;
	align-items : center;
	width : auto;
	height : auto;
	margin-right : 0.75em;
}
#globalNav .contact {
	grid-column : 2/3;
	grid-row : 1/3;
}
#globalNav .contact a {
	display : flex;
	justify-content : center;
	align-items : center;
	width : 100%;
	height : 100%;
	transition : 0.2s ease-out;
	color : #ffffff;
	background-color : #00297b;
}
#globalNav .contact a:hover {
	color : #ffffff;
	background-color : #103e9a;
}

#globalNav .groupCompany {
	position : relative;
}
#globalNav .groupCompany .dropdown_lists a {
	padding : 0.75em 2em 0.75em 0.75em;
}

/* dropdownlist 20250722 */
#globalNav .groupCompany .dropdown_lists {
	display : none;/*デフォルトでは非表示の状態にしておく*/
	position : absolute;
	top : 100%;
	right : 0;
}
#globalNav .groupCompany:hover .dropdown_lists {
	display : block;/*Gナビメニューにホバーしたら表示*/
}
#globalNav .groupCompany .dropdown_list {
	position : relative;
	height : auto;
	transition : all 0.3s;
	background-color : transparent;
}
#globalNav .groupCompany .dropdown_list:not(:first-child)::before {
	position : absolute;
	top : 0;
	left : 0;
	width : 100%;
	content : "";
	/* height: 1px; */
	background-color : transparent;
}
#globalNav .groupCompany .dropdown_list a {
	display : flex;
	position : relative;
	justify-content : flex-start;
	align-items : center;
	transition : all 0.3s;
	text-decoration : none;
	color : #ffffff;
	white-space : nowrap;
}
#globalNav .groupCompany .dropdown_list a:hover {
	background-color : #004d80;
}
body.__header_black #globalNav .groupCompany .dropdown_list a {
	color : #00297b;
	background-color : rgba(255, 255, 255, 0.9);
}
body.__header_black #globalNav .groupCompany .dropdown_list a:hover {
	color : #ffffff;
	background-color : #004d80;
}
#globalNav .groupCompany .dropdown_list a::before {
	display : block;
	position : absolute;
	top : calc(50% - 5px);
	right : 15px;
	width : 6px;
	height : 6px;
	content : "";
	transform : rotate(135deg);
	border-top : 2px solid #ffffff;
	border-left : 2px solid #ffffff;
}
body.__header_black #globalNav .groupCompany .dropdown_list a::before {
	border-top : 2px solid #00297b;
	border-left : 2px solid #00297b;
}
body.__header_black #globalNav .groupCompany .dropdown_list a:hover::before {
	border-top : 2px solid #ffffff;
	border-left : 2px solid #ffffff;
}


/* pageBody */
#pageBody {
	text-align : left;
}
#pageBody > section {
	margin-bottom : 120px;
}
/*
#pageBody > section:last-child {
	margin-bottom : 0;
} */

#pageBody > section section {
	padding-top : 60px;
	padding-bottom : 60px;
	border-top : 3px dotted #dddddd;
}

#breadcrumb {
	padding : 1em 0;
	background-color : #eeeeee;
}
#breadcrumb ul {
	display : flex;
	margin-bottom : 1em;
}
#breadcrumb ul > li {
	display : flex;
	position : relative;
	overflow : hidden;
	line-height : 1;
	align-items : center;
}
#breadcrumb ul > li:not(:last-child) {
	margin-right : 0.25em;
}
#breadcrumb ul > li:not(:first-child) {
	padding-left : 20px;
}
#breadcrumb ul > li:not(:first-child)::before {
	position : absolute;
	top : 58%;
	left : 5px;
	width : 4px;
	height : 4px;
	margin-top : -4px;
	content : "";
	transform : rotate(45deg);
	border-top : solid 1px #222222;
	border-right : solid 1px #222222;
}
#breadcrumb ul > li > * {
	overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
}

#contentHeader {
	display : flex;
	justify-content : center;
	align-items : center;
	height : clamp(200px, 32vw, 400px);
	margin-bottom : 100px;
	background-color : #cccccc;
}
#contentHeader .pagetitle {
	display : flex;
	font-family : "Noto Serif JP", serif;
	font-size : 2em;
	font-weight : bold;
	flex-direction : column;
	justify-content : center;
	align-items : center;
	color : #ffffff;
}
#contentHeader .pagetitle .en {
	font-family : "Noto Serif JP", serif;
	font-size : 0.5em;
	margin-top : 16px;
	letter-spacing : 0.1em;
}

/* contentNav */
#contentNav {
	width : 100%;
	max-width : 1220px;
	margin : 0 auto;
	padding : 0 32px;
}
#contentNav ul {
	display : grid;
	grid-template-columns : 1fr 1fr 1fr;
	grid-gap : 8px;
	max-width : 1440px;
	margin : 0 auto 80px;
}
#contentNav ul > li a {
	display : flex;
	position : relative;
	line-height : 1.45;
	justify-content : center;
	align-items : center;
	height : 100%;
	padding : 24px 16px 42px;
	transition : 0.2s ease-in-out;
	text-align : center;
	text-decoration : none;
	color : #ffffff;
	background-color : #00297b;
}
#contentNav ul > li a:hover {
	text-decoration : none;
	background-color : #0c388f;
}
#contentNav ul > li:nth-child(2n) a {
	background-color : #001a4e;
}
#contentNav ul > li:nth-child(2n) a:hover {
	background-color : #052361;
}
#contentNav ul > li a::after {
	position : absolute;
	bottom : 16px;
	left : 50%;
	width : 7px;
	height : 7px;
	content : "";
	transform : translateX(-50%) rotate(135deg);
	border-width : 1px 1px 0 0;
	border-style : solid solid none none;
	border-color : #ffffff #ffffff transparent transparent;
	vertical-align : middle;
}

/* pageFooter */
#pageFooter {
	background-color : #ffffff;
}
#pageFooter > .inner {
	display : grid;
	grid-template-columns : 40% 1fr;
	grid-gap : 40px;
	margin-bottom : 100px;
}
#footercontact {
	display : flex;
	justify-content : center;
	margin-bottom : 80px;
	padding : 80px 0;
	background-color : #f2f2f2;
}
#footercontact h2 {
	text-align : center;
}
#footercontact .text {
	margin-bottom : 40px;
	text-align : center;
}
#footercontact .link {
	display : grid;
	grid-template-columns : 1fr 1fr;
	grid-gap : 40px;
}
#footercontact .link a:first-child {
	display : flex;
	grid-gap : 40px;
	font-family : "Jost";
	font-size : 3em;
	justify-content : flex-end;
	color : #00297b;
}
#footercontact .link a:last-child {
	font-family : "Jost";
	font-size : 1em;
	color : #ffffff;
	background-color : #00297b;
}

#pageFooter .content .logo {
	margin-bottom : 40px;
}
#footerNav {
	display : grid;
	grid-template-columns : 1fr 1fr 1fr;
	grid-gap : 40px;
}
#footerNav a {
	display : block;
	font-family : "新ゴ B";
	font-size : 0.875em;
	padding : 0.75em 0;
}

#management {
	grid-column : 1 / 3;
	font-family : "新ゴ B";
	padding-top : 1em;
	border-top : 1px solid #000000;
}

#copyright {
	font-family : "Jost";
	font-size : 0.875em;
	padding : 2em 0;
	text-align : center;
	color : #ffffff;
	background-color : #00297b;
}

/* --- for 2K or more pc --- */
@media screen and (min-width: 1980px) {
}

/* --- for HD pc --- */
@media screen and (min-width: 1440px) and (max-width: 1979px) {
}

/* --- for normal pc --- */
@media screen and (min-width: 1024px) and (max-width: 1439px) {
}




/* --- for tablet --- */
@media screen and (max-width: 1023px) {
	.__humberger_toggle {
		height : 95px;
	}

	#globalNav {
		display : flex;
		z-index : -1;
		position : fixed;
		top : 50%;
		left : 50%;
		overflow-y : auto;
		flex-direction : column;
		width : 100%;
		height : 100%;
		padding : 80px 0;
		transition : 0.3s ease-out;
		transform : translateX(-50%) translateY(-50%);
		opacity : 0;
	}
	.__humberger_toggled.__humberger_open #globalNav {
		animation : SHOW_NAV 0.5s ease-out 0s forwards;
	}
	.__humberger_toggled.__humberger_close #globalNav {
		animation : HIDE_NAV 0.5s ease-out 0s forwards;
	}
	@keyframes SHOW_NAV {
		0% {
			z-index : -1;
			opacity : 0;
		}
		1% {
			z-index : 11;
			opacity : 0;
		}
		100% {
			z-index : 11;
			opacity : 1;
		}
	}
	@keyframes HIDE_NAV {
		0% {
			z-index : 11;
			opacity : 1;
		}
		99% {
			z-index : 11;
			opacity : 0;
		}
		100% {
			z-index : -1;
			opacity : 0;
		}
	}
	#globalNav .main {
		display : block;
		order : 1;
		text-align : center;
	}
	#globalNav .main > li {
		display : block;
		height : auto;
	}
	#globalNav .main > li:not(:last-child) {
		margin : 0;
	}
	#globalNav .main > li a {
		display : inline-block;
		font-size : 1.2em;
		font-weight : bold;
		height : auto;
		padding : 1em;
	}
	#globalNav .main > li.kidslib {
		min-width : unset;
		text-align : left;
		color : inherit;
		background-color : transparent;
	}
	#globalNav .sub {
		display : block;
		order : 2;
		text-align : center;
	}
	#globalNav .sub > li:first-child {
		border : none;
	}
	#globalNav .sub > li a {
		display : inline-block;
		font-size : 1.2em;
		font-weight : bold;
		padding : 1em;
	}
	#globalNav .sub > li a::before {
		display : none;
	}
	#globalNav .sub > li .bogo-language-switcher {
		padding : 1em;
	}
	#globalNav .sub > li:not(:first-child) {
		border-left : none;
	}
	#globalNav .contact {
		display : flex;
		justify-content : center;
		order : 3;
		margin-top : 32px;
	}
	#globalNav .contact a {
		font-size : 1.2em;
		font-weight : bold;
		width : auto;
		padding : 1em 2em;
		border-radius : 3em;
	}


	#pageHeader > .inner {
		display : flex;
		justify-content : center;
		padding : 0;
	}
	#pageHeader .logo {
		display : flex;
		align-items : center;
	}
}

/* --- for tablet --- */
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.__pc {
		display : none;
	}
	.__tab {
		display : unset;
	}
	.__sp {
		display : none;
	}
	#pageBody > section {
		margin-bottom : 80px;
	}

	#contentHeader .pagetitle {
		font-size : 1.8em;
		transform : translateY(40px);
	}
	#contentNav ul {
		flex-direction : column;
	}
	#contentNav ul > li:not(:last-child) {
		margin-right : 0;
		margin-bottom : 24px;
	}


	
	
}

/* 20250722 */
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.gnavi_list {
		position : static;
		text-align : center;
	}
	.gnavi_list > a {
		display : block;
		font-size : 1.2em;
		font-weight : bold;
		padding : 1em;
		color : #ffffff;
	}
	.dropdown_lists {
		display : block;
		position : static;
		width : 100%;
		margin-top : 0.5em;
		background-color : transparent;
	}
	.dropdown_list {
		height : auto;
		border-top : none;
		background-color : transparent;
	}
	.dropdown_list a {
		justify-content : center;
		padding : 1em;
		color : #ffffff;
	}
	.dropdown_list a::before {
		display : none;
	}
}

/* 20250722 */
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.dropdown_list::before {
		display : none !important;
		content : none !important;
	}
}

/* --- for mobile --- */
@media screen and (max-width: 767px) {
	.__pc {
		display : none;
	}
	.__tab {
		display : none;
	}
	.__sp {
		display : unset;
	}
	#pageHeader .logo img {
		max-width : 60vw;
	}
	#pageBody > section {
		margin-bottom : 80px;
	}
	#pageBody > header#contentHeader .inner {
		grid-template-columns : 1fr;
		grid-gap : 0;
		height : clamp(10em, 72vw, 600px);
	}
	#contentHeader {
		height : clamp(320px, 42vw, 480px);
		margin-bottom : 100px;
		background-color : #cccccc;
	}
	#contentHeader .pagetitle {
		transform : translateY(40px);
	}
	#footercontact .link {
		grid-template-columns : 1fr;
	}
	#footercontact .link a:first-child {
		justify-content : center;
	}
	#pageFooter > .inner {
		grid-template-columns : 1fr;
	}
	#footerNav {
		grid-template-columns : 1fr 1fr;
	}
	body.__header_black #globalNav .main > li a {
		color : #FFFFFF;
	}
	body.__header_black #globalNav .sub > li a {
		color : #FFFFFF;
	}
	body.__header_black #globalNav .groupCompany .dropdown_list a {
		color : #FFFFFF;
		background-color: #00297b;
	}
	
	
	
}

/* 20250722 */
@media screen and (max-width: 1023px) {
	.gnavi_list {
		position : static;
		text-align : center;
	}
	#globalNav .groupCompany .dropdown_lists {
		display : block;
		position : static;
		width : 100%;
		margin-top : 0.5em;
		background-color : transparent;
	}
	#globalNav .groupCompany .dropdown_list {
		height : auto;
		background-color : transparent;
	}
	#globalNav .groupCompany .dropdown_list a {
		justify-content : center;
		padding : 1em;
	}
	#globalNav .groupCompany .dropdown_list a::before {
		display : none;
	}

	#globalNav .groupCompany .dropdown_list a:hover {
		background-color : revert;
	}
	body.__header_black #globalNav .groupCompany .dropdown_list a:hover {
		color : revert;
		background-color : revert;
	}
	body.__header_black #globalNav .groupCompany .dropdown_list a:hover::before {
		border-top : revert;
		border-left : revert;
	}
}