@charset "utf-8";

/* all
-------------------------------------------------------------------*/
:root{
	--hover:background .4s,color .4s,border-color .4s,opacity .4s,text-decoration-color .4s,transform .4s,filter .4s,box-shadow .4s,outline .4s;
	--header: 120px;
	--container:1200px;
	--wide:1920px;
	--side:375px;
	--inner:5%;
	--outer:calc(var(--inner) * -1);
	--fontcolor:#282828;
	--cpcolor:#171f90;
	--key01: #171f90;
	--key02:#1a1c2e;
	--accent01:#1d4192;
	--subcolor:#f98925;
	--light:#ffff00;
	--gray:#9c9c9c;
	--lgray:#ededed;
	--lgray2:#f3f5f7;
	--dgray:#949494;
	--reverse:invert(1);
	--white:brightness(0) invert(1);
	font-weight:600;
}
:root img{
	transition:opacity .4s,filter .4s;
}
:root :is(a,button,label){
	transition:var(--hover);
}
:root a :is(span,b,i,img){
	transition:var(--hover);
}
:root .txt_link a[target="_blank"]{
	display:inline-flex;
	gap:0.5em;
}
:root .txt_link a[target="_blank"]:after{
	content:"";
	display:block;
	height:1em;
	aspect-ratio:1 / 1;
	margin-top:0.25em;
	background:var(--key01);
	mask-image: url(../img/common/ico_blank.png);
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}
:root .txt_link a:has(img)[target="_blank"]:after{
	display:none;
}
:root mark{
	background:none;
	text-decoration-line:underline;
	text-decoration-thickness:0.6em;
	text-decoration-color:var(--light);
	text-decoration-style:solid;
	text-underline-offset:-0.3em;
}

:root p{
	font-weight:inherit;
	line-height:1.8;
}
:root :is(header,footer) li{
	list-style:none;
	margin-left:0;
	padding-left:0;
}
html {
	background: #FFFFFF;
	color: var(--fontcolor);
	font-size: 16px;
	line-height: 1.6;
	scroll-padding:var(--header);
	scroll-behavior:smooth;
	font-feature-settings:'palt';
	font-optical-sizing: auto;
	font-style: normal;
	letter-spacing:0.06em;
}
body {
	width: 100%;
	font-size: 100%;
	text-align: center;
	min-width: var(--container);
	position: relative;
	z-index: 2;
	overflow-x: clip;
	font-family: "Noto Sans", sans-serif;
}
:root :is([lang="en"],.en){
	font-family:"Young Serif", sans-serif;
	letter-spacing: 0;
}
:root :is(.serif){
	font-family:"Noto Serif", serif;
	font-optical-sizing: auto;
}
:root a.skip-link{
	display:flex;
	font-size:0.75rem;
	align-items:center;
	justify-content: center;
	color:#fff;
	background:var(--key);
	position:absolute;
	top: calc(var(--header) + 1px);
	left:0;
	padding:0.5em;
	z-index:-5;
	box-shadow:0 0 1em rgba(0,0,0,0.25);
	opacity:0;
	width:8em;
	height:8em;
}
:root a.skip-link:focus{
	opacity:1;
	z-index:15;
	text-decoration:underline dotted 1px;
}
.all-content{
	overflow: clip;
}
main {
	width: 100%;
	position: relative;
	z-index: 5;
	padding-top:var(--header);
}
body img,
body svg {
	max-width: 100%;
	height: auto;
}
.sitewrap,
.widewrap{
	width: var(--container);
	margin: 0 auto;
	text-align: left;
	box-sizing: border-box;
}
.widewrap{
	max-width:var(--wide);
	padding-inline:4.75rem;
	width:auto;
}
*:has( > .sitewrap ){
	width:100%;
	overflow: clip;
}
.center_content {
	text-align:center;
}
.center_content > *{
	margin-inline:auto;
}
.right_content {
	text-align:right;
}
.right_content > *{
	margin-inline:auto 0;
}
@media screen and (max-width:1600px) {
	.widewrap{
		padding-inline:var(--inner);
	}
}
@media screen and (max-width:1240px) {
	:root{
		--container:100%;
	}
	.sitewrap{
		padding-inline:var(--inner);
	}
}
@media screen and (max-width:980px) {
	:root{
		--header: 70px;
	}	
}
@media screen and (max-width:767px) {
	header#fix_menu{
		--header:60px;
	}
	:root{
		--header: 60px;
		--inner:15px;
	}
	html {
		font-size: 14px;
	}
}
:is(header,footer) * {
	margin:0;
	padding:0;
	line-height:inherit;
}
/* header
-------------------------------------------------------------------*/

#global-header {
	position: absolute;
	z-index: 50;
	top: 0;
	left: 0;
	right: 0;
	display:flex;
	align-items: center;
	transition: top .4s .2s, background .2s;
	padding: 0;
	height:var(--header);
	width:100%;
	max-width:var(--wide);
	margin-inline:auto;
	justify-content:space-between;
	background:#fff;
}
#global-header #site_ttl {
	top: -5em;
	transition: top .2s;
}
#global-header .drop_menu{
	margin-right: 1em;
	margin-block:auto 0;
}
#global-header .drop_top{
	display:flex;
	gap: 0.5em;
	justify-content:flex-end;
	margin-block: 0.25em 0.25em;
	align-items: center;
}
#global-header #switch{
	appearance:none;
	background:none;
	border:none;
	z-index:-1;
	position:absolute;
	z-index:-1;
	opacity:0;
	width:1px;
	height:1px;
	border:none;
	background:none;
	outline:none;
}
#global-header #nav-switch{
	display:none;
}

@media (hover: hover) and (pointer: fine), (hover: none) and (pointer: coarse) {
	#global-header #site_ttl a:hover{
		opacity:0.6;
	}
	#global-header .header-tel a:hover{
		color:var(--key01);
		text-decoration-color:var(--key01);
	}
	#global-header .drop_bottom li a:hover{
		color:var(--key01)
	}
	#global-header .drop_bottom .drop_wrap:hover{
		background:var(--lgray);
	}
	#global-header .drop_wrap .drop_child a:hover{
		background:var(--key01);
		text-decoration-color:transparent;
	}
}

:root{
	--side:1127px;
	--header:98px;
}
#global-header #nav-switch{
	display:flex;
	position:absolute;
	height:60px;
	aspect-ratio:1 / 1;
	top:0;
	bottom:0;
	margin:auto;
	right:0em;
	appearance:none;
	padding:0.25em;
	border:none;
	align-items:center;
	justify-content:center;
	z-index:10;
	transition:background .2s,right .2s;
}
#global-header .drop_menu{
	padding-inline: 0 calc(1em + 60px);
	margin-block:auto;
	position: fixed;
	right: 0;
	top: 0;
}
#global-header .drop_menu .header-btn {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1em;
}
#global-header .drop_menu .cv-btn{
	position:relative;
	z-index:20;
	width: 180px;
}
#global-header:has(#switch:checked) .drop_menu .cv-btn{
	background:#fff;
	border-color:#fff;
	color:var(--key01);
	box-shadow:0 0 0 rgba(0,0,0,0);
}
#global-header:has(#switch:checked) .drop_menu .cv-btn span:after{
	opacity:0;
}
#global-header #nav-switch:before,
#global-header #nav-switch:after,
#global-header #nav-switch span{
	display:block;
	height:3px;
	width: 2.375em;
	background:var(--fontcolor);
	transition:transform .3s,inset .2s,opacity .2s .2s;
	transform:rotate(-180deg);
}
#global-header #nav-switch:before,
#global-header #nav-switch:after{
	content:"";
	position:absolute;
	inset:0 auto;
	margin:auto;
}
#global-header #nav-switch:before{
	top:-1.5em;
}
#global-header #nav-switch:after{
	bottom:-1.5em;
}
#global-header #NavWrap{
	position:fixed;
	width:var(--side);
	top:0;
	bottom: 0;
	right:calc(var(--side) * -1);
	flex-direction: column-reverse;
	z-index: 5;
	background:var(--accent);
	transition:right .2s;
	justify-content:flex-end;
	gap:0;
	overflow-y:auto;
	background-color:var(--key01);
	padding-top:var(--header);
	padding-bottom:1em;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow-y: auto;
}
#global-header #NavWrap .scroll_wrap{
	position:relative;
}
#global-header #NavWrap:after{
    background: url(../img/top/message-bg.png) no-repeat bottom;
    content:"";
    display:block;
    z-index: -1;
    inset:0;
    position: absolute;
    opacity:0.15;
}
#global-header #NavWrap > *{
	visibility:hidden;
}
#global-header:has(#switch:checked) #nav-switch{
	--fontcolor:#fff;
}
#global-header:has(#switch:checked)  #nav-switch span{
	transform:rotate(315deg);
	position: relative;
	z-index: 0;
}
#global-header:has(#switch:checked)  #nav-switch:before{
	transform:rotate(45deg);
	top:0;
}
#global-header:has(#switch:checked)  #nav-switch:after{
	transform:rotate(315deg);
	bottom:0;
	opacity:0;
}
#global-header label.bg{
	content:"";
	display:block;
	position:fixed;
	inset:0 100% 0 0;
	background:rgba(0,0,0,0);
	z-index:1;
	transition: .2s;
}
#global-header:has(#switch:checked) label.bg{
	inset:0 var(--side) 0 0 ;
	background:rgba(0,0,0,0.4);
}

#global-header:has(#switch:checked) #NavWrap{
	right:0;
}
#global-header:has(#switch:checked) #NavWrap > *{
	visibility:visible;
}
#global-header #site_ttl a{
	position:absolute;
	top:1em;
	left:0.75em;
	margin-inline: 2.5em;
}
:root .logo_style a{
	display:flex;
	align-items:flex-end;
	gap:1em;
	padding:1em;
	text-decoration:none;
}
:root .logo_style a .site-name{
	display:flex;
	flex-direction:column;
	gap:0.25em;
	margin-bottom:1em;
	white-space: nowrap;
}
:root .logo_style a .site-name b{
	background:var(--cpcolor);
	color:#fff;
	border-radius:1em;
	font-size:0.875em;
	font-weight:600;
}
:root .logo_style a .site-name em{
	color:var(--cpcolor);
	letter-spacing:0;
}
#global-header .logo{
	display:block;
}
:is(.kaso #global-header,#global-header.fixedMenu) #site_ttl{
	position:fixed;
	top:0;
	left:0;
	right:0;
	background:rgba(255,255,255,0.75);
	height:var(--header);	
}
:is(.kaso #global-header,#global-header.fixedMenu) #site_ttl a{
	padding-block:0;
	top:0.5em;
}
:is(.kaso #global-header,#global-header.fixedMenu) .logo img{
	max-width:130px;
}
#global-header #global-nav {
	font-size:1.25rem;
}
#global-header #global-nav > li{
	padding:0;
	border-bottom:solid 1px var(--gray);
}
#global-header .scroll_wrap{
	max-width:787px;
	margin:auto;
	width:100%;
	max-height:100%;
	overflow-y:auto;
	scrollbar-width: thin;
	scrollbar-color: #fff transparent;
}
#global-header #global-nav a{
	text-decoration-color:transparent;
	color:#fff;
	font-weight: 500;
	display:flex;
	text-decoration-thickness:1px;
	text-underline-offset:0.3em;
	text-align: left;
}
#global-header #global-nav a[target="_blank"]:after{
	background:#fff;
}
#global-header #global-nav .main_link{
	margin-bottom:2em;
	padding:0 1em;
	display:flex;
	justify-content:space-between;
}
#global-header #global-nav .main_link ul{
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	align-items:flex-start;
	gap: 2em;
}
#global-header #global-nav .other_link{
	display:flex;
	flex-wrap:wrap;
	gap: 1em;
	border-top:solid 1px #fff;
	margin-inline:1em;
	padding-top:2em;
}
#global-header #global-nav ul li{
	border:none;
	padding:0;
}
#global-header #global-nav a[target="_blank"]:after{
	
}
@media (hover: hover) and (pointer: fine),
(hover: none) and (pointer: coarse) {
	#global-header #global-nav a:hover{
		transform:translateX(0.75em);
		text-decoration-color:#fff;
	}
}
@media  (max-width:1600px) {
	:root{
		--side:760px;
	}
	#global-header #site_ttl{
		position:fixed;
		top:0;
		left:0;
		right:0;
		background:rgba(255,255,255,0.75);
		height:var(--header);
		display: block;
	}
	#global-header #site_ttl a{
		padding-block:0;
		top:0.5em;
	}
	#global-header .logo img{
		max-width:130px;
	}
	#global-header .scroll_wrap{
		padding-inline:var(--inner);		
	}
}
@media screen and (max-width:767px) {
	:root{
		--side:calc(100% - 60px);
		--header:60px;
	}
	#global-header #site_ttl{
	}
	#global-header #site_ttl a{
		position:static;
		gap: 0.5em;
		justify-content: flex-start;
		height:var(--header);
		align-items: center;
		padding: 0;
		margin-inline: var(--inner) auto;
	}
	:root .logo_style a .site-name{
		margin-bottom:0;
		font-size:min(3vw,0.85rem);
		gap:0;
	}
	#global-header #site_ttl .logo,
	#global-header #site_ttl .logo img{
		max-width: min(100%,75px);
	}
	#global-header .drop_menu .header-btn{
		display:none;
	}
	#global-header .drop_menu .cv-btn{
		font-size:min(3vw,0.85rem);
		width:auto;
		padding-inline:0.75em;
		letter-spacing:0;
		margin: auto 0;
		min-height: 3.5em;
	}
	#global-header #nav-switch{
		margin-right:0;
		background:transparent;
		z-index:50;
		position:fixed;
		top:0;
		bottom:auto;
	}
	#global-header #nav-switch:before, 
	#global-header #nav-switch:after, 
	#global-header #nav-switch span{
		background:var(--fontcolor);
		filter: drop-shadow(0 0px 2px rgb(255 255 255));
	}
	#global-header .drop_menu {
        margin-inline: 0;
        margin-block: auto;
        padding-inline: 0 var(--header);
		height:var(--header);
		align-items:center;
		display:flex;
    }
	#global-header #NavWrap{
		position:fixed;
		width:var(--side);
		top:0;
		bottom: 0;
		right:calc(var(--side) * -1);
		flex-direction: column-reverse;
		z-index: 40;
		background:var(--accent);
		transition:right .2s;
		justify-content:flex-end;
		gap:0;
		overflow-y:auto;
		display:block;
		background:var(--key01);
		padding-top:1em;
	}
	#global-header:has(#switch:checked) #NavWrap{
		right:0;
	}
	#global-header #global-nav{
		position:static;
		width:100%;
		font-size:1rem;
	}
	#global-header #global-nav > *{
		visibility:visible;
	}
	#global-header .drop_top > *{
		flex-basis:49%;
	}
	#global-header:has(#switch:checked) #nav-switch{
		right: calc(100% - var(--header));
		background:transparent;
	}
	#global-header #global-nav .main_link{
		padding:0;
		display:block;
		margin: 0;
	}
	#global-header #global-nav .main_link ul{
		display:block;
	}
	#global-header #global-nav .main_link li{
		border-bottom:solid rgba(255,255,255,0.5) 1px;
	}
	#global-header #global-nav .main_link a{
		display:flex;
		text-align:left;
		width:100%;
		min-height: 3em;
		align-items:center;
		padding-block: 0.5em;
	}
	#global-header #global-nav .other_link{
		border:none;
		font-size:0.875rem;
		padding:1.5em 0;
		margin:0;
	}
	#global-header #NavWrap:after{
		background-size:960px auto;
	}
}
/* footer
-------------------------------------------------------------------*/

#global-footer {
	padding:4em 0 0;
	background:var(--lgray);
	--width:920px;
}
#global-footer .footer-menu{
	display:flex;
	justify-content:space-between;
}
#global-footer .logo_style a{
	padding-inline:0;
}
#global-footer .footer-menu .foot_btn_area .cv-btn + .cv-btn{
	margin-top:1em;
}
#global-footer .footer-menu .cv-btn{
	margin-block:0;
}
#global-footer .company-data{
	font-size:0.875rem;
	margin-bottom:1.5em;
	line-height:1.8;
	font-weight:500;
}
#global-footer .sns{
	display:flex;
	gap:1em;
}
#global-footer .foot_right{
	display:flex;
	justify-content:space-between;
	width:var(--width);
	align-items:flex-start;
}
#global-footer .foot_right ul{
	display:flex;
	flex-direction:column;
	gap:1.25em;
	font-size:0.875rem;
}
#global-footer .foot_right ul a{
	color:var(--fontcolor);
	display:inline-flex;
}
#global-footer .foot_right ul a:after{
	background:var(--fontcolor);
}

#global-footer .foot_bottom{
	background:var(--key02);
	color:#fff;
	margin-top: 5em;
	padding-block:1em;
}
#global-footer .foot_bottom .widewrap{
	display:flex;
	align-items:center;
	justify-content:space-between;
	font-weight:500;
}
#global-footer .foot_bottom a{
	font-size:0.875rem;
}
#global-footer .foot_bottom a:after{
	background:#fff;
}

a.pagetop{
	position: absolute;
	z-index: 15;
	bottom: 2.5em;
	right:2%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	background:var(--key01);
	color:#fff;
	aspect-ratio:1 / 1;
	width:5em;
	border-radius:50%;
	font-weight:600;
	filter:drop-shadow(0 0.25em 5px rgba(0,0,0,0.25))
}
a.pagetop:is(:hover,:focus){
	text-decoration-color:transparent;
}
a.pagetop span{
	display:block;
	height:1.0em;
	aspect-ratio:1 / 1;
	border-top:solid 2px ;
	border-right:solid 2px ;
	transform:rotate(-45deg);
	margin-top:0.35em;
}
:root aside.sp-fixed {
    display: none;
}
@media (hover: hover) and (pointer: fine), (hover: none) and (pointer: coarse) {
	#global-footer .foot_left a:hover{
		opacity:0.6
	}
	#global-footer .foot_right ul a:hover{
		--fontcolor:var(--key01);
		transform:translateX(0.5em);
	}

}
@media screen and (max-width:1200px) {
	#global-footer .footer-menu{
		flex-direction:column;
		align-items:center;
	}
	#global-footer .foot_right{
		width: 100%;
		margin-top: 2.5em;
	}
}
@media screen and (max-width:767px) {
	a.pagetop{
		position:absolute;
		bottom:auto;
		margin-top:-1em;
		z-index: 1;
		width: 3.5em;
		z-index:10;
	}
	#global-footer{
		padding-top:1.25em;
	}
	#global-footer .logo_style a{
		align-items:center;
		justify-content: center;
	}
	#global-footer .logo_style .logo img{
		max-width:84px;
	}
	#global-footer .company-data{
		font-size:0.75rem;
	}
	#global-footer .sns{
		justify-content:center;
	}
	#global-footer .foot_right{
		width: 100%;
		margin-top: 1.5em;
		display:grid;
		grid-template-columns: repeat(2, 1fr);
		gap:2px;
	}
	#global-footer .foot_right ul{
		display:contents;
	}
	#global-footer .foot_right ul li{
	}
	#global-footer .foot_right ul li a{
		height:3.5em;
		background:#fff;
		display:flex;
		align-items:center;
		padding:0.25em 1em;
		line-height:1.2;
		font-size:0.75rem;
	}
	#global-footer .foot_right .cv-btn{
		grid-column: span 2;
		margin-top:1.5em;
	}
	#global-footer .foot_bottom {
		margin-top:2.5em;
	}
	#global-footer .footer-menu .foot_btn_area{
		grid-column: span 2;
	}
	#global-footer .foot_bottom .widewrap{
		display:block;
		text-align:center;
	}
	:root aside.sp-fixed{
		position:fixed;
		inset:auto 0 0 0;
		margin:auto;
		display:flex;
		justify-content:center;
		align-items:center;
		z-index: 15;
	}
	:root aside.sp-fixed .cv-btn{
		margin:0;
		border-radius:0;
	}
}


/* print
-------------------------------------------------------------------*/
@media print {
	*html body {
		zoom:60%;
	}
	#global-header{
		position: relative;
	}
}