@charset "utf-8";

@import url("theme.css");
@import url("inview.css");
:root{
	scroll-padding:100px;
	scroll-behavior:smooth;}
@keyframes animation1{
	0%{right:-200px;}
	100%{right:0px;}
}
@keyframes opa1{
	0%{opacity:0;}
	100%{opacity:1;}
}

/* Customize
-------------------------*/
:where(ol:not([class*=lib]))>li:before,
:where(ul:not([class*=lib]))>li:before{
	display:none;}
:where(ol:not([class*=lib]))>li~li,
:where(ul:not([class*=lib]))>li~li{
	margin:0;}
:where(h3):not([class]){
	padding-bottom:0;
	border-bottom:none;
	margin-top:0;}
:where(table) td{
	border:none;}
.media-side__view{
	margin:1.5rem auto 0!important;}
.lib-link__btn{
	color:var(--primary-inverse-color);
	background-color:var(--primary-color);}
.lib-link__btn:hover{
	color:var(--primary-color);
	background-color:var(--primary-inverse-color);}
@media only screen and (max-width:767px){
	.lib-hero__outer{
		margin:10px 0 0;}
}

/* Common
-------------------------*/
body *{box-sizing:border-box;}
html{
	font-size:clamp(13px, 0.29vw + 11.9px, 16px);
	overflow-x:visible;}
body{
	margin:0;padding:0;
	font-family:var(--base-font);
	-webkit-text-size-adjust:none;
	background:var(--bg-color);
	color:var(--bg-inverse-color);
	line-height:2;
	overflow-x:hidden;}
figure{
	text-align:center;
	margin:0;}
li, th, td{
	line-height:1.75;}
dd{
	margin:0;}
nav, ul, li, ol{
	margin:0;
	padding:0;}
nav ul{
	list-style:none;}
table{
	border-collapse:collapse;}
img{
	border:none;
	max-width:100%;
	height:auto;
	vertical-align:middle;}
video{
	max-width:100%;}
iframe{
	width:100%;}
input{
	font-size:1rem;}
section{
	margin:var(--content-space-l) 0;}
p{
	margin:0 0 20px;}
p:last-of-type{
	margin:0;}
a{
	color:inherit;
	transition:0.3s;
	text-decoration:none;
	color:var(--primary-color);}
a:hover{
	filter:brightness(1.1);
	text-decoration:none;
	color:var(--sub-color);}
#container{
	animation:opa1 0.2s 0.2s both;
	display:flex;
	flex-direction:column;
	min-height:100vh;}
.inner{
	max-width:1100px;
	margin:auto;}
.inner-s{
	max-width:1000px;
	margin:auto;}
.sp_br{
	display:none;}
@media only screen and (max-width:480px){
	.pc_br{
		display:none;}
	.sp_br{
		display:block;}
}

/* Header
-------------------------*/
header{
	width:100%;
	position:fixed;
	top:0;
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:2rem;
	height:80px;
	z-index:999;
	background:var(--bg-color);
	padding-inline:var(--content-space-s);}
header .logo{
	margin:0;
	flex-shrink:0;}
header .logo img{
	display:block;
	width:330px;}
#menubar-overlay{
	display:none;
	position:fixed;
	z-index:99;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, 0.3);}
body.noscroll{
	overflow:hidden;}
.large-screen #menubar>nav>ul{
	display:flex;
	align-items:center;
	gap:1.5rem;
	height:80px;}
#menubar{
	margin:0;}
#menubar li{
	margin-top:0;}
#menubar li:before{
	display:none;}
#menubar li a{
	display:flex;
	text-decoration:none;
	align-items:center;
	height:80px;
	color:#000;
	position:relative;}
.large-screen #menubar ul ul{
	text-shadow:none;
	position:absolute;
	z-index:100;
	animation:opa1 0.5s 0.1s both;
	border-radius:10px;
	background-color:rgba(255,255,255,0.5);
	backdrop-filter:blur(10px);
	border:1px solid var(--primary-inverse-color);
	box-shadow:inset -2px -2px 6px 0px rgba(230, 230, 230, 0.4), inset 2px 2px 6px 0px rgba(230, 230, 230, 0.4);
	padding:10px 20px;
	width:200px;
	top:80px;
	left:-85%;}
.large-screen #menubar ul ul a{
	color:var(--bg-inverse-color);
	padding:10px 0;
	display:block;
	height:auto;
	border-bottom:1px solid var(--light-border-color);}
.large-screen #menubar ul ul a::before{
	display:none;}
.small-screen #menubar{
	animation:animation1 0.2s both;
	position:fixed;
	overflow:auto;
	z-index:100;
	right:0;
	top:0;
	width:50%;
	height:100%;
	padding:85px var(--content-space-l) 50px;
	background:var(--primary-inverse-color);}
.small-screen #menubar{
	display:none;}
.small-screen #menubar a{
	display:block;
	text-decoration:none;
	margin-bottom:1rem;
	height:auto;
	padding:1rem 2rem;
	border-radius:5px;
	background:var(--light-color);}
.small-screen #menubar .btn a{
	width:100%;
	color:var(--accent-inverse-color);
	padding:1rem 2rem !important;}
.small-screen #menubar ul ul a{
	margin-left:2rem;
	padding:0.5rem 1.5rem;}
#menubar ul ul{
	display:none;}
#menubar_hdr{
	display:none;
	animation:opa1 0s 0.2s both;
	cursor:pointer;
	position:fixed;
	z-index:101;
	right:0px;
	top:0px;
	width:70px;
	height:70px;
	border-bottom-left-radius:10px;
	z-index:999;}
#menubar_hdr span{
	display:block;
	transition:0.3s;
	position:absolute;
	left:18px;
	width:35px;
	height:1px;
	background:var(--bg-inverse-color);}
#menubar_hdr.ham{
	background:#fff;}
#menubar_hdr.ham span{
	background:#333;}
#menubar_hdr span:nth-of-type(1){
	top:24px;}
#menubar_hdr span:nth-of-type(2){
	top:34px;}
#menubar_hdr span:nth-of-type(3){
	top:44px;}
#menubar_hdr.ham span:nth-of-type(1){
	transform:translateY(10px) rotate(-45deg);}
#menubar_hdr.ham span:nth-of-type(2){
	opacity:0;}
#menubar_hdr.ham span:nth-of-type(3){
	transform:translateY(-10px) rotate(45deg);}
.small-screen #menubar_hdr{
	display:flex;}
#menubar li.btn a{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	border-radius:5px;
	background:linear-gradient(90deg, rgba(0, 31, 107, 1) 0%, rgba(11, 80, 148, 1) 100%);
	color:var(--primary-inverse-color);
	padding:0.4rem 2rem 0.4rem 1em !important;
	width:calc(160px + 1.5vw);
	height:45px;}
#menubar li.btn a::after{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:15px;
	margin:auto;
	width:24px;
	height:24px;
	background-image:url(/dcms_media/other/arrow.svg);
	background-size:contain;
	background-position:center;}
#menubar li.btn a::before{
	display:none;}
.btn.inverse a{
	background:transparent;
	color:var(--primary-color);}
.btn.accent a{
	background:var(--accent-color);
	color:var(--accent-inverse-color);
	border:1px solid var(--accent-color);}
.pagetop-show{
	display:block;}
.pagetop a{
	display:block;
	text-decoration:none;
	text-align:center;
	z-index:99;
	animation:opa1 1s 0.4s both;
	position:fixed;
	right:20px;
	bottom:20px;
	color:#fff;
	font-size:1.5rem;
	background:rgba(0, 0, 0, 0.2);
	width:60px;
	line-height:60px;
	border-radius:50%;}
@media screen and (max-width:1023px){
	header .logo img{
		width:220px;}
}
@media screen and (max-width:767px){
	header{
		height:70px;}
	header .logo{
		position:absolute;
		left:15px;
		z-index:101;}
	.small-screen #menubar{
		width:100%;}
}
@media screen and (min-width:768px){
	#menubar li a::before{
		position:absolute;
		left:0;
		content:'';
		width:100%;
		height:2px;
		background:var(--primary-color);
		bottom:20px;
		opacity:0;
		visibility:hidden;
		transition:0.3s;}
	#menubar li a:hover::before{
		visibility:visible;
		bottom:12px;
		opacity:1;}
}

/* Button
-------------------------*/
.section-button a{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	border-radius:5px;
	background:linear-gradient(90deg, rgba(0, 31, 107, 1) 0%, rgba(11, 80, 148, 1) 100%);
	color:var(--primary-inverse-color);
	padding:0.4rem 2rem 0.4rem 1em !important;
	margin:auto;
	width:200px;
	height:45px;}
.section-button a::after{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:15px;
	margin:auto;
	width:24px;
	height:24px;
	background-image:url(/dcms_media/other/arrow.svg);
	background-size:contain;
	background-position:center;}

/* Contents
-------------------------*/
#contents{
	width:calc(100% - 40px);
	max-width:1100px;
	margin:auto;}
#contents .kazari-text img{
	display:block;}
#contents h2{
	font-weight:400;
	position:relative;
	font-weight:bold;
	letter-spacing:0;}
#contents h2.c{
	justify-content:center;}
.bg1-parts{
	background-color:var(--bg-inverse-color);
	color:var(--bg-color);}
.bg1-primary-parts{
	background-color:var(--primary-color);
	color:var(--primary-inverse-color);}
.bg1-light-parts{
	padding:0 20px;
	overflow:hidden;
	background-color:var(--light-color);
	--bg-border-color:var(--light-border-color);}
.bg1-light2-parts{
	background-color:var(--light2-color);
	--bg-border-color:var(--light2-border-color);}
.bg1-accent-parts{
	background-color:var(--accent-color);
	color:var(--accent-inverse-color);}
.bg-parts{
	padding-top:var(--content-space-l);
	padding-bottom:var(--content-space-l);}
.bg-parts+.bg-parts{
	margin-top:calc(-1 * var(--content-space-l)) !important;}
.bleed-x-parts{
	--bleed-x:var(--content-space-l);
	width:calc(100% + (var(--bleed-x) * 2));
	margin-left:calc(var(--bleed-x) * -1);
	margin-right:calc(var(--bleed-x) * -1);
	max-width:none;}
.bleed-left-parts{
	width:calc(100% + var(--content-space-l));
	margin-left:calc(-1 * var(--content-space-l));}
.bleed-right-parts{
	width:calc(100% + var(--content-space-l));
	margin-right:calc(-1 * var(--content-space-l));}
.color-check, .color-check a{
	color:#c3547b !important;}

/* Contact
-------------------------*/
.contact-area{
	padding:40px 20px;}
.contact-inner{
	max-width:1100px;
	margin:auto;}
.contact-box{
	position:relative;
	overflow:hidden;
	box-shadow:0 4px 8px rgba(0, 0, 0, 0.1);
	background-size:cover;
	background-position:center;}
.contact-box.tel,
.contact-box.mail{
	border-radius:30px 10px 10px 10px;}
.contact-box.tel{
	margin:0 0 20px;}
.contact-box a{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;}
.contact-link{
	display:none;}
.contact-flex{
	display:flex;
	align-items:center;
	padding:20px;
	color:#fff;
	height:150px;}
.contact-box .icon{
	margin-right:20px;}
.contact-box .icon img{
	width:25px;
	height:auto;}
.contact-box .text p{
	margin:0;
	font-size:15px;
	font-weight:bold;}
.contact-box .text p.tel-number{
	font-size:24px;
	font-family:"Oswald", sans-serif;}
.contact-box .tel-number{
	font-size:32px;
	font-weight:bold;
	margin-top:10px;}
.contact-arrow{
	margin-left:auto;
	display:flex;
	justify-content:center;
	align-items:center;
	width:30px;
	height:30px;
	border-radius:50%;
	color:#333;
	text-decoration:none;
	transition:0.4s;}
.contact-box:hover .contact-arrow{
	margin-right:-10px;}
@media screen and (min-width:768px){
	.contact-area{
		padding:80px 20px;}
	.contact-inner{
		display:flex;
		gap:20px;}
	.contact-box{
		width:50%;}
	.contact-box.tel{
		border-radius:20px 20px 80px 20px;}
	.contact-box.mail{
		border-radius:80px 20px 20px 20px;}
	.contact-box.tel{
		margin:0;}
	.contact-flex{
		padding:30px;
		height:100%;}
	.contact-box .icon img{
		width:50px;}
	.contact-box .text p{
		font-size:20px;}
	.contact-box .text p.tel-number{
		font-size:32px;}
	.contact-arrow{
		width:50px;
		height:50px;}
}
@media screen and (min-width:1024px){
	.contact-inner{
		gap:40px;}
	.contact-box .icon img{
		width:70px;}
	.contact-box .text p.tel-number{
		font-size:45px;}
}

/* Footer
-------------------------*/
.footer{
	position:relative;
	padding:50px 20px;
	background:linear-gradient(0deg,rgba(0, 31, 107, 1) 0%, rgba(11, 80, 148, 1) 100%);}
.footer::after{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	width:100%;
	margin:auto;
	height:100%;
	background-position:center right;
	background-image:url(/dcms_media/image/myrss.webp);
	background-repeat:no-repeat;
	background-size:contain;}
.footer-inner,
.footer-bottom{
	max-width:1100px;
	position:relative;
	z-index:2;}
.footer-inner{
	margin:auto;}
.footer-address{
	font-style:normal;
	color:var(--primary-inverse-color);}
.footer-logo{
	margin:0 0 15px;}
.footer-info{
	margin:0 0 30px;}
.footer-tel a{
	color:var(--primary-inverse-color);}
.footer-nav{
	display:flex;
	flex-wrap:wrap;}
.footer-nav-column{
	width:50%;}
.footer-nav-list li{
	margin-top:0;}
.footer-nav-list li::before{
	display:none;}
.footer-nav-list li a{
	color:var(--primary-inverse-color);
	text-decoration:none;}
.footer-nav-list li a:hover{
	color:var(--sub-color);}
.footer-contact{
	margin:20px 0 0;}
.footer-contact-button{
	color:var(--primary-inverse-color);
	text-decoration:none;
	border:1px solid var(--primary-inverse-color);
	display:block;
	padding:10px 2em 10px 10px;
	text-align:center;
	border-radius:5px;
	position:relative;}
.footer-contact-button::after,
.footer-contact-button span::after{
	content:'';
	position:absolute;
	bottom:0;
	margin:auto;
	background-image:url(/dcms_media/other/mail.svg);
	background-size:contain;
	background-position:center;}
.footer-contact-button::after{
	top:0;
	right:15px;
	width:18px;
	height:18px;
	background-image:url(/dcms_media/other/arrow.svg);}
.footer-contact-button span{
	position:relative;
	padding:0 0 0 45px;}
.footer-contact-button span::after{
	top:0.2em;
	left:15px;
	width:20px;
	height:16px;
	background-image:url(/dcms_media/other/mail.svg);}
.footer-contact-button:hover{
	color:var(--primary-inverse-color);
	background-color:rgba(255,255,255,0.1);}
.footer-bottom{
	margin:40px auto 0;}
.footer-sub-menu li{
	list-style:none;
	text-align:center;
	font-size:13px;}
.footer-sub-menu li::before{
	display:none;}
.footer-sub-menu li a{
	color:var(--primary-inverse-color);
	text-decoration:none;}
.footer-widget2{
	margin:30px 0 0;}
.footer-copyright{
	margin:0;
	font-size:11px;
	text-align:center;
	color:var(--primary-inverse-color);}
@media only screen and (min-width:768px){
	.footer{
		padding:80px 20px;}
	.footer::after{
		height:calc(100% - 200px);}
	.footer-inner,
	.footer-bottom{
		display:flex;
		flex-wrap:wrap;}
	.footer-info{
		width:calc(45% - 30px);
		margin:0 30px 0 0;}
	.footer-link{
		width:55%;}
	.footer-nav-column{
		width:calc(100%/3);}
	.footer-nav-list li{
		border-left:1px solid var(--primary-inverse-color);
		padding:10px 0 10px 20px;}
	.footer-contact{
		margin:50px 0 0;}
	.footer-contact-button{
		font-size:24px;}
	.footer-contact-button::after{
		width:24px;
		height:24px;}
	.footer-contact-button span{
		padding:0 0 0 55px;}
	.footer-contact-button span::after{
		width:30px;
		height:24px;}
	.footer-bottom{
		margin:60px auto 0;}
	.footer-widget1{
		width:calc(45% - 30px);
		margin:0 30px 0 0;}
	.footer-widget2{
		width:55%;}
	.footer-sub-menu{
		display:flex;
		flex-wrap:wrap;}
	.footer-sub-menu li{
		padding:0 14px 0 0;
		margin:0 14px 0 0;
		position:relative;}
	.footer-sub-menu li:last-child{
		padding:0;
		margin:0;}
	.footer-sub-menu li::after{
		position:absolute;
		content:'';
		display:block;
		width:1px;
		height:calc(100% - 10px);
		background:#FFF;
		transition:0.4s;
		top:0;
		right:0;
		bottom:0;
		margin:auto;}
	.footer-sub-menu li:last-child::after{
		display:none;}
	.footer-widget2{
		margin:0;}
}
@media only screen and (min-width:1024px){
	.footer{
		padding:110px 20px;}
	.footer::after{
		height:calc(100% - 100px);}
	.footer-info{
		width:calc(40% - 50px);
		margin:0 50px 0 0;}
	.footer-link{
		width:60%;}
	.footer-nav-list li{
		padding:10px 0 10px 30px;}
	.footer-widget1{
		width:calc(45% - 50px);
		margin:0 50px 0 0;}
}

/* Text
-------------------------*/
.l{ text-align:left !important; }
.c{ text-align:center !important; }
.r{ text-align:right !important; }

.fw-bold{ font-weight:bold !important; }
.fw-bolder{ font-weight:bolder !important; }
.fw-semibold{ font-weight:semibold !important; }
.fw-medium{ font-weight:medium !important; }
.fw-normal{ font-weight:normal !important; }
.fw-light{ font-weight:light !important; }
.fw-lighter{ font-weight:lighter !important; }
.fst-italic{ font-weight:!important; }
.fst-normal{ font-weight:normal !important; }
.fs-1{ font-size:calc(1.375rem + 1.5vw)!important; }
.fs-2{ font-size:calc(1.325rem + .9vw)!important; }
.fs-3{ font-size:calc(1.3rem + .6vw)!important; }
.fs-4{ font-size:calc(1.275rem + .3vw)!important; }
.fs-5{ font-size:1.25rem!important; }
.fs-6{ font-size:1rem!important; }
@media only screen and (min-width:1200px){
	.fs-1{ font-size:2.5rem!important; }
	.fs-2{ font-size:2rem!important; }
	.fs-3{ font-size:1.75rem!important; }
	.fs-4{ font-size:1.5rem!important; }
}
@media only screen and (min-width:768px){
	.pc-c{ text-align:center; }
}

/* Margin
-------------------------*/
.m-0{ margin:0!important; }
.m-1{ margin:0.25rem!important; }
.m-2{ margin:0.5rem!important; }
.m-3{ margin:1rem!important; }
.m-4{ margin:1.5rem!important; }
.m-5{ margin:3rem!important; }
.m-auto{ margin:auto!important; }
.mx-0{ margin-right:0!important; margin-left:0!important; }
.mx-1{ margin-right:0.25rem!important; margin-left:0.25rem!important; }
.mx-2{ margin-right:0.5rem!important; margin-left:0.5rem!important; }
.mx-3{ margin-right:1rem!important; margin-left:1rem!important; }
.mx-4{ margin-right:1.5rem!important; margin-left:1.5rem!important; }
.mx-5{ margin-right:3rem!important; margin-left:3rem!important; }
.mx-auto{ margin-right:auto!important; margin-left:auto!important; }
.my-0{ margin-top:0!important; margin-bottom:0!important; }
.my-1{ margin-top:0.25rem!important; margin-bottom:0.25rem!important; }
.my-2{ margin-top:0.5rem!important; margin-bottom:0.5rem!important; }
.my-3{ margin-top:1rem!important; margin-bottom:1rem!important; }
.my-4{ margin-top:1.5rem!important; margin-bottom:1.5rem!important; }
.my-5{ margin-top:3rem!important; margin-bottom:3rem!important; }
.my-auto{ margin-top:auto!important; margin-bottom:auto!important; }
.mt-0{ margin-top:0!important; }
.mt-1{ margin-top:0.25rem!important; }
.mt-2{ margin-top:0.5rem!important; }
.mt-3{ margin-top:1rem!important; }
.mt-4{ margin-top:1.5rem!important; }
.mt-5{ margin-top:3rem!important; }
.mt-auto{ margin-top:auto!important; }
.me-0{ margin-right:0!important; }
.me-1{ margin-right:0.25rem!important; }
.me-2{ margin-right:0.5rem!important; }
.me-3{ margin-right:1rem!important; }
.me-4{ margin-right:1.5rem!important; }
.me-5{ margin-right:3rem!important; }
.me-auto{ margin-right:auto!important; }
.mb-0{ margin-bottom:0!important; }
.mb-1{ margin-bottom:0.25rem!important; }
.mb-2{ margin-bottom:0.5rem!important; }
.mb-3{ margin-bottom:1rem!important; }
.mb-4{ margin-bottom:1.5rem!important; }
.mb-5{ margin-bottom:3rem!important; }
.mb-auto{ margin-bottom:auto!important; }
.ms-0{ margin-left:0!important; }
.ms-1{ margin-left:0.25rem!important; }
.ms-2{ margin-left:0.5rem!important; }
.ms-3{ margin-left:1rem!important; }
.ms-4{ margin-left:1.5rem!important; }
.ms-5{ margin-left:3rem!important; }
.ms-auto{ margin-left:auto!important; }

/* Display
-------------------------*/
.d-inline{ display:inline!important; }
.d-inline-block{ display:inline-block!important; }
.d-block{ display:block!important; }
.d-grid{ display:grid!important; }
.d-inline-grid{ display:inline-grid!important; }
.d-table{ display:table!important; }
.d-table-row{ display:table-row!important; }
.d-table-cell{ display:table-cell!important; }
.d-flex{ display:flex!important; }
.d-inline-flex{ display:inline-flex!important; }
.d-none{ display:none!important; }

/* List
-------------------------*/
.list-num li{ list-style-type:decimal; margin:0 0 0 20px; }
.disc-list{ text-align:justify; font-size:15px; padding:0 0 0 18px; }
.disc-list li{ line-height:1.8em; list-style:disc; }
.heart,.diamond{ text-align:justify; font-size:15px; padding:0; }
.heart li,.diamond li{ line-height:1.8em; list-style:none; padding:0 0 0 18px; position:relative; }
.heart li::after,
.diamond li::after{ position:absolute; top:0.05em; left:0; }
.heart li::after{ content:'\2665'; color:#eb6e9f; }
.diamond li::after{ content:'\25c6'; color:#0083b0; }

/* Others
-------------------------*/
.ws{ width:100%; display:block; }
.wl{ width:100%; display:block; }
.padding-x{ padding:0 var(--content-space-l); }
.look{ display:inline-block; padding:0px 10px; background:rgba(0, 0, 0, 0.4); color:#fff; border-radius:3px; margin:5px 0; word-break:break-all; }
.small{ font-size:0.75em; }
.large{ font-size:2em; letter-spacing:0.1em; }
.pc{ display:none; }
.dn{ display:none !important; }
.block{ display:block !important; }
.is-clip{ overflow:hidden; }

/* Anchor
-------------------------*/
.anchor{
	padding-top:80px;
	margin-top:-80px;}