@charset "UTF-8";

html {
	width: 100%;
	height: 100%;
	color: #505050;
	margin: 0;
	padding: 0;
	font-feature-settings: "palt" 1;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,figure {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body{
	font-size: 14px;
	line-height: 2;
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	counter-reset:number;
	height: 100%;
	-webkit-text-size-adjust: none;
}

table {
	font: 100%;
	font-size: inherit;
	border-collapse: collapse;
	border-spacing: 0;
}
caption,th { text-align:left; }

fieldset,img { border: 0;}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: inherit;
}
address,caption,cite,code,dfn,em,th,var {
	font-style: normal;
	font-weight: normal;
}
ol,ul { list-style: none;}

q:before,q:after { content:'';}
abbr,acronym {
	border: 0;
	font-variant: normal;
}
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom;}
input,textarea,select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	outline: 0;
}
legend{ color:#555;}

select,input,button,textarea{ font-family: "Noto Sans JP", sans-serif; }

pre,code,kbd,samp,tt{
	font-family: monospace;
	line-height: 100%;
}

main { display: block; }

a {
	color: inherit;
	outline: none;
	text-decoration: none;
}
a:hover { text-decoration: none; }
a:focus { text-decoration: none; }
a:active { text-decoration: none; }

a img { border: none; }
img {
 max-width: 100%;
 vertical-align: top;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

html, body {
	height: 100%;
	text-align: justify;
	text-justify: inter-ideograph;
}
body { -webkit-text-size-adjust: 100%; }

/* ++++++++++++++++++++++++++++++
common style
++++++++++++++++++++++++++++++ */
#wrapper { position: relative; }
.bold { font-weight: 600; }
#mainHeader {
	color: #8246aa;
	background-color: #dca0ff;
	background-size: 100% 850px;
	background-repeat: no-repeat;
	background-position: center top;
	background-image: linear-gradient(0deg, #dca0ff 0px, #fff 850px);
}
#mainHeader span[class$="-title"] { display: block; }
#mainHeader #pageInfo { color: #505050; }
#mainHeader #pageInfo dd { word-break: break-all; }
a.overlink figure,
figure.overlink a { overflow: hidden; }
#mBack {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10000;
	position: fixed;
	background-color: rgba(0,0,0,0.5);
	cursor: pointer;
	display: none;
}
#mCont {
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 1000px;
	max-width: calc(100% - 50px);
	aspect-ratio: 16 / 9;
	z-index: 10001;
	position: fixed;
	display: none;
}
#mCont iframe {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: absolute;
}

.article #mainHeader .inner .archiveLink a {
	color: #505050;
	display: block;
	text-align: center;
	background-color: #fff;
}
.wBox {
	box-sizing: border-box;
	background-color: #fff;
	border-top-right-radius: 20px;
}
.pagerCont {
	color: #6633cc;
	display: flex;
	justify-content: center;
}
.pagerCont ul {
	display: flex;
}
.pagerCont ul::before,
.pagerCont ul li::after {
	content: "｜";
	display: inline-block;
}
.pagerCont ul a { text-decoration: underline; }
.pagerCont .nolink { opacity: 0; }
.pageNavi {
	color: #6633cc;
	display: flex;
	justify-content: center;
}
.pageNavi .nolink { opacity: 0; }
@media screen and (min-width:769px), print{
	#wrapper {
		display: flex;
		min-height: 100vh;
		flex-direction: column;
		overflow: hidden;
	}
	#container { flex-grow: 1; }
	.sp { display: none !important; }
	.inner {
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 50px;
		padding-right: 50px;
		box-sizing: content-box;
	}
	a[href^="tel:"] { pointer-events: none; }

	#mainHeader {
		padding-top: 150px;
	}
	#mainHeader .ja-title {
		font-size: 40px;
		line-height: 65px;
	}
	#mainHeader .en-title {
		font-size: 14px;
		font-family: "Noto Sans JP", sans-serif;
	}
	#mainHeader #pageInfo { margin-top: 80px; }
	#mainHeader #pageInfo dt { font-size: 24px; }
	#mainHeader #pageInfo dd {
		margin-top: 30px;
		padding-right: 190px;
	}
	a.overlink figure img,
	figure.overlink a img {
		transition-duration: .3s;
		transition-property: transform;
		transform-origin: center center;
	}
	a.overlink:hover figure img,
	figure.overlink a:hover img { transform: scale(1.2); }
	.link a, a.link {
		transition-duration: .3s;
		transition-property: color, border-color, background-color;
	}

	.pagerCont a:hover { color: #000; }
	.pagerCont .prevLink { margin-right: 80px; }
	.pagerCont .nextLink { margin-left: 80px; }
	.article #mainHeader .inner {
		display: flex;
		justify-content: space-between;
	}
	.article #mainHeader .inner #mainTitle {
		width: calc(100% - 390px);
	}
	.article #mainHeader .inner .archiveLink {
		width: 140px;
		line-height: 32px;
		margin-top: 18px;
		margin-right: 200px;
	}
	.article #mainHeader .inner .archiveLink a {
		transition-duration: .3s;
		transition-property: color, background-color;
	}
	.article #mainHeader .inner .archiveLink a:hover {
		color: #fff;
		background: #8246aa;
	}
	.wBox {
		padding: 100px;
		margin-top: 90px;
	}
	.page_title { font-size: 24px; }
	.pageNavi { margin-top: 185px; }
	.pageNavi .return { margin: 0 80px; }
	.pageNavi a:hover { text-decoration: underline; }
}
@media screen and (max-width:768px){
	.pc { display: none !important; }
	#mainHeader {
		background-size: 100% 440px;
		background-image: linear-gradient(0deg, #dca0ff 0px, #fff 440px);
	}
	.article #mainHeader { padding-bottom: 85px; }
	#mainTitle {
		height: 210px;
		padding: 40px 25px 0;
	}
	#mainTitle .ja-title {
		font-size: 24px;
		line-height: 39px;
	}
	#mainTitle .en-title {
		font-size: 8.4px;
		margin-top: 10px;
	}
	.article #mainTitle {
		height: auto;
		padding-bottom: 1px;
	}
	.article #mainHeader .inner .archiveLink {
		padding: 0 25px;
		text-align: right;
	}
	.article #mainHeader .inner .archiveLink a {
		font-size: 10.5px;
		padding: 2px 32px 1px;
		display: inline-block;
	}
	#mainHeader #pageInfo {
		padding: 0 25px 25px;
		dt {
			font-size: 15px;
			margin-top: 37px;
		}
		dd {
			font-size: 12px;
			margin-top: 12px;
			letter-spacing: -0.05em;
		}
	}
	#lowerBox {
		position: relative;
		padding: 0 25px 200px;
	}
	#lowerBox .page_title {
		top: -70px;
		left: 25px;
		position: absolute;
	}
	#lowerBox #postList {
		padding: 50px 40px;
		.thumb { border-radius: 0 20px; }
	}
	#lowerBox #postList .number,
	#lowerBox #postList .date {
		font-size: 10.5px;
		margin-top: 10px;
	}
	#lowerBox #postList .postTitle {
		font-size: 12px;
		margin-top: 5px;
	}
	#lowerBox #postList li + li { margin-top: 42px; }
	.article #lowerBox { margin-top: -65px; }
	.pagerCont {
		font-size: 12px;
		.prevLink { margin-right: 2em; }
		.nextLink { margin-left: 2em; }
	}
	.pageNavi {
		margin-top: 80px;
		justify-content: space-between;
	}
}

/* ++++++++++++++++++++++++++++++
header style
++++++++++++++++++++++++++++++ */
#headCont {
	display: flex;
	justify-content: space-between;
}
#headLogo {
	display: flex;
	align-items: center;
}
#headCont .snsLink {
	display: flex;
	align-items: center;
}
#headCont .snsLink li a {
	height: 0;
	display: block;
	overflow: hidden;
	background: no-repeat center center;
	background-size: 100% 100%;
}
#headCont .snsLink li.fb a { background-image: url(../images/icon_fb_v.svg); }
#headCont .snsLink li.inst a { background-image: url(../images/icon_inst_v.svg); }
#gNavCont { position: absolute; }
#gNavCont .icon {
	top: 0;
	right: 0;
	color: #fff;
	z-index: 9999;
	background-color: #6633cc;
	position: fixed;
	cursor: pointer;
	text-align: center;
	border-bottom-left-radius: 20px;
	font-family: "Noto Sans JP", sans-serif;
}
#gNavCont .icon::before,
#gNavCont .icon::after,
#gNavCont .icon span::before {
	content: "";
	left: 0;
	right: 0;
	display: block;
	background-color: #fff;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	transition-duration: .3s;
	transition-property: top, width, transform;
}
#gNavCont .icon span {
	display: inline-block;
	transition-duration: .3s;
	transition-property: opacity;
}
#gNavInner {
	top: 0;
	right: -360px;
	color: #fff;
	z-index: 9998;
	position: fixed;
	background: #6633cc;
	width: 360px;
	height: 100vh;
	max-width: calc(100vw - 50px);
	font-size: 14px;
	line-height: 34px;
	box-sizing: border-box;
	overflow-y: auto;
	transition-duration: .3s;
	transition-property: right;
}
#gNavCont.open #gNavInner {
	right: 0;
}
#gNavCont.open .icon span::before { width: 0; }
#gNavCont.open .icon span { opacity: 0; }
#gNavInner > ul > li {
	border-top: 1px solid #784bd2;
}
#gNavInner > ul > li > a,
#gNavInner .sns {
	display: block;
	padding: 10px 10px 10px 30px;
}
#gNavInner > ul > li > a:hover {
	text-decoration: underline;
}
#gNavInner > ul > li > a::before {
	content: "〉 ";
	display: inline;
}
#gNavBack {
	z-index: 9997;
	display: none;
	top: 0;
	right: 0;
	width: 100vw;
	height: 100vh;
	position: fixed;
	cursor: pointer;
	background: rgba(255, 255, 255, 0.7);
}
@media screen and (min-width:769px), print{
	#headCont {
		height: 90px;
		padding-left: 20px;
		padding-right: 90px;
	}
	#headLogo img { height: 70px; }
	#headLogo .text {
		font-size: 12px;
		margin-left: 10px;
	}
	#headCont .snsLink { margin-right: 20px; }
	#headCont .snsLink li + li { margin-left: 15px; }
	#headCont .snsLink a {
		width: 20px;
		padding-top: 20px;
		transition-duration: .3s;
		transition-property: background-image;
	}
	#headCont .snsLink li.fb a:hover { background-image: url(../images/icon_fb_b.svg); }
	#headCont .snsLink li.inst a:hover { background-image: url(../images/icon_inst_b.svg); }
	#gNavCont .icon {
		width: 90px;
		height: 90px;
	}
	#gNavCont .icon::before,
	#gNavCont .icon::after,
	#gNavCont .icon span::before {
		width: 36px;
		height: 2px;
	}
	#gNavCont .icon::before { top: 25px; }
	#gNavCont .icon::after { top: 34px; }
	#gNavCont .icon span::before { top: 43px; }
	#gNavCont .icon:hover::before { top: 22px; }
	#gNavCont .icon:hover span::before { top: 46px; }
	#gNavCont .icon span { margin-top: 50px; }
	#gNavCont.open .icon::before {
		top: 34px;
		transform: rotate(45deg);
	}
	#gNavCont.open .icon::after {
		top: 34px;
		transform: rotate(-45deg);
	}
	#gNavInner {
		padding-top: 90px;
	}
	#hNavCont {
		top: 130px;
		right: 50px;
		color: #000;
		z-index: 9997;
		font-size: 15px;
		font-weight: 600;
		position: absolute;
		text-align: right;
	}
	#hNavCont li + li { margin-top: 25px; }
	#hNavCont a {
		position: relative;
		display: inline-block;
	}
	#hNavCont a::after {
		content: "";
		bottom: 2px;
		right: 0;
		width: 0;
		height: 1px;
		display: block;
		position: absolute;
		background: rgba(0,0,0,0.1);
		transition-duration: .3s;
		transition-property: width;
	}
	#hNavCont a:hover::after {
		width: 100%;
	}
}
@media screen and (max-width:768px){
	#headLogo a {
		display: block;
		padding: 10px;
	}
	#headLogo img {
		height: 30px;
	}
	#headLogo .text {
		font-size: 9px;
		font-weight: bold;
	}
	#headCont .snsLink { display: none; }
	#gNavCont .icon {
		width: 50px;
		height: 50px;
		padding-top: 18px;
		border-bottom-left-radius: 10px;
	}
	#gNavCont .icon span {
		font-size: 7px;
	}
	#gNavCont .icon::before,
	#gNavCont .icon::after,
	#gNavCont .icon span::before {
		width: 20px;
		height: 1px;
	}
	#gNavCont .icon::before { top: 14px; }
	#gNavCont .icon::after { top: 24px; }
	#gNavCont .icon span::before { top: 19px; }
	#gNavCont.open .icon::before {
		top: 24.5px;
		transform: rotate(45deg);
	}
	#gNavCont.open .icon::after {
		top: 24.5px;
		transform: rotate(-45deg);
	}
	#hNavCont {
		position: fixed;
		left: 100%;
		top: 0;
	}
	#gNavInner {
		padding-top: 55px;
	}
	#gNavInner .sns a::before {
		content: "";
		width: 1.2em;
		height: 1.2em;
		display: inline-block;
		vertical-align: middle;
		background: no-repeat center center;
		background-size: cover;
		margin-top: -0.2em;
		margin-right: 0.5em;
	}
	#gNavInner .sns .fb a::before { background-image: url(../images/icon_fb_w.svg); }
	#gNavInner .sns .inst a::before { background-image: url(../images/icon_inst_w.svg); }
}

/* ++++++++++++++++++++++++++++++
footer style
++++++++++++++++++++++++++++++ */
#footCont {
	color: #fff;
	background: #b4ade4;
	font-family: "Noto Sans JP", sans-serif;
}
#footLogo .text { font-family: "Noto Serif JP", serif; }
#footMenuCont li:not(.privacy) a::before {
	content: "> ";
	display: inline;
}
@media screen and (min-width:769px), print{
	#footCont { padding: 50px 25px 100px; }
	#footInner {
		display: flex;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
	#footInner > * { width: 50%; }
	#footInner > * + * {
		border-left: 1px solid #fff;
	}
	#footLogo {
		display: flex;
		align-items: center;
		margin-bottom: 10px;
	}
	#footLogo img { width: 88px; }
	#footLogo .text {
		font-size: 12px;
		margin-left: 10px;
	}
	#footInfo .copyright { font-size: 12px; }
	#footMenuCont {
		display: flex;
		font-size: 12px;
		padding-top: 1px;
		padding-left: 50px;
		padding-right: 40px;
		justify-content: flex-start;
	}
	#footMenuCont ul { margin: -0.6em 0 ; }
	#footMenuCont ul + ul { margin-left: 50px; }
	#footMenuCont li + li { margin-top: 8px; }
	#footMenuCont li:not(.privacy) a:hover { text-decoration: underline; }
	#footMenuCont .privacy {
		width: 50px;
	}
}
@media screen and (max-width:768px){
	#footInner {
		position: relative;
		padding: 24px 25px 45px;
	}
	#footMenuCont {
		right: 25px;
		bottom: 50px;
		position: absolute;
	}
	#footMenuCont li:not(.privacy) { display: none; }
	#footMenuCont li.privacy { width: 44px; }
	#footLogo img {
		width: 77px;
		vertical-align: middle;
	}
	#footLogo .text {
		font-size: 10.5px;
		margin-left: 9px;
		vertical-align: middle;
	}
	#footInfo address {
		font-size: 12px;
		margin-top: 8px;
	}
	#footInfo .copyright {
		font-size: 10.5px;
	}
}

/* 横スクロール処理 */
.scNav {
	display: none;
	margin-bottom: 30px;
	justify-content: space-between;
	& > p {
		width: 15px;
		height: 0;
		padding-top: 15px;
		overflow: hidden;
		cursor: pointer;
		border-top: 1.5px solid #c8c8c8;
		&.left {
			transform: rotate(-45deg);
			border-left: 1.5px solid #c8c8c8;
		}
		&.right {
			transform: rotate(45deg);
			border-right: 1.5px solid #c8c8c8;
		}
	}
}
.active .scNav { display: flex; }
.active .scInner { overflow-x: scroll; }
