@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@700&display=swap');

.header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	position:relative;
	z-index:100;
	height: 95px;
	background:#e60012;
	margin-bottom: 50px;
}

.header__logo{
	padding-left:59px;
}

.header__logo img{
	display:block;
	width:213px;
}

.header__nav{
	margin-left:auto;
	margin-right:72px;
}

.header__list{
	display:flex;
	align-items:center;
	gap:67px;
	margin:0;
	padding:0;
}

.header__item{
	list-style:none;
}

.header__link{
	position:relative;
	display:inline-block;
	padding-bottom:1px;
	font-size:16px;
	font-weight:700;
	color:#fff!important;
	text-decoration:none;
}

.header__link::after{
	content:"";
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:1px;
	background:#fff;
	transform:scaleX(0);
	transform-origin:left center;
	transition:transform .3s;
}

.header__link:hover::after{
	transform:scaleX(1);
}

.header__link.is-current::after{
	transform:scaleX(1);
}

.header__recruit{
	width: 160px;
	background: #fff;
	position: fixed;
	right: 0;
	top: 0;
}

.header__recruitLink{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-decoration:none;
}

.header__recruitText{
	margin-bottom:12px;
	font-size: 16px;
	font-weight:700;
	line-height:1.4;
	color:#e60012;
	text-align:center;
}

.header__recruitCircle{
	display:flex;
	align-items:center;
	justify-content:center;
	width:42px;
	height:42px;
	border:1px solid #e60012;
	border-radius:50%;
}

.header__recruitCircle img{
	display:block;
	width:18px;
}

.header__menu{
	display:none;
}

.spMenu{
	display:none;
}



/***************************************************
    footer
*******************************************************/
.footer{
	position:relative;
	overflow:hidden;
	padding: 140px 114px 150px;
	background:#e60012;
	border-radius:500px 0 0 0;
}

.footer__inner{
	position:relative;
	z-index:1;
}

.footer__top{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	margin: 275px 0 110px;
	position: relative;
}

.footer__company{
	width:320px;
}

.footer__name{
	margin:0 0 62px;
	font-size: 20px;
	font-weight:700;
	line-height:1.8;
	color:#fff;
}

.footer__address{
	margin:0;
	font-size: 20px;
	font-weight:700;
	line-height:1.7;
	color:#fff;
}

.footer__nav{
	display:flex;
	flex-wrap:wrap;
	column-gap: 42px;
	row-gap:34px;
	width: 650px;
	margin:0;
	padding:0;
	position: absolute;
	left: 490px;
	flex: 0 0 600px;
}

.footer__nav li{
	list-style:none;
}

.footer__nav a{
	position:relative;
	display:inline-block;
	padding-bottom:4px;
	font-size: 20px;
	font-weight:700;
	color:#fff;
	text-decoration:none;
}

.footer__nav a::after{
	content:"";
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:2px;
	background:#fff;
	transform:scaleX(0);
	transform-origin:left center;
	transition:transform .3s;
}

.footer__nav a:hover::after{
	transform:scaleX(1);
}

.footer__pageTop{
	display:flex;
	flex-direction:column;
	align-items:center;
	text-decoration:none;
	position: absolute;
	right: 0;
	top: -294px;
}

.footer__pageTopLine{
	position:relative;
	width: 2px;
	height:230px;
	background:#fff;
}

.footer__pageTopLine::before{
	content:"";
	position:absolute;
	top:0;
	left:50%;
	width:10px;
	height:10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform:translateX(-50%) rotate(-45deg);
}

.footer__pageTopText{
	margin-top:18px;
	font-size:16px;
	font-weight:700;
	line-height:1;
	color:#fff;
	writing-mode:vertical-rl;
}

.footer__bottom{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
}

.footerRecruit{
	display:flex;
	align-items:center;
	width: 600px;
	height:222px;
	padding: 30px;
	background:#fff;
	border-bottom-right-radius:120px;
	text-decoration:none;
}

.footerRecruit__img{
	flex:0 0 219px;
	width:219px;
	margin-right:34px;
}

.footerRecruit__img img{
	display:block;
	width:100%;
}

.footerRecruit__body{
	display:flex;
	flex-direction:column;
}

.footerRecruit__text{
	display:block;
	margin-bottom:28px;
	font-size:26px;
	font-weight:700;
	line-height:1.5;
	color:#000;
}

.footerRecruit__link{
	display:flex;
	align-items:center;
	gap:16px;
	font-size:18px;
	font-weight:700;
	color:#000;
}

.footerRecruit__link::before{
	content:"";
	width:64px;
	height: 2px;
	background:#e60012;
}

.footerRecruit__link::after{
	content:"";
	width:14px;
	height:14px;
	background:url("/common/images/header/icon-recruit.svg") no-repeat center center/contain;
}

.footer__branding{
	display:flex;
	flex-direction:column;
	align-items:flex-end;
}

.footer__logo{
	margin-bottom:18px;
}

.footer__logo img{
	display: flex;
	flex: 0 0　400px;
	width: 400px;
}

.footer__copyright{
	margin:0;
	font-size: 13.5px;
	font-weight: 500;
	color:#fff;
}



@media screen and (max-width:980px){

  #container{
    margin-top:70px;
  }


  /**************************************************
    header
  *****************************************************/
	.header{
		position:fixed;
		top:0;
		left:0;
		z-index:100;
		width:100%;
		height:50px;
		background:#e60012;
	}

	.header__logo{
		padding-left:14px;
	}

	.header__logo img{
		display:block;
		width: 142px;
	}

	.header__nav{
		display:none;
	}

	.header__recruit{
		display:none;
	}

	.header__menu{
		display:flex;
		align-items:center;
		justify-content:center;
		width:50px;
		height:50px;
		margin-left:auto;
	}

	.header__menuButton{
		position:relative;
		z-index:120;
		width:30px;
		height:24px;
		padding:0;
		background:none;
		border:none;
		cursor:pointer;
	}

	.header__menuButton span{
		position:absolute;
		left:0;
		width:30px;
		height:2px;
		background:#fff;
	}

	.header__menuButton span:nth-child(1){
		top:0;
	}

	.header__menuButton span:nth-child(2){
		top:11px;
	}

	.header__menuButton span:nth-child(3){
		bottom:0;
	}

	/* =========================
		sp menu
	========================= */

	.spMenu{
    display:block;
    position:fixed;
    top:0;
    right:0;
    z-index:110;
    width:84%;
    min-height:100%;
    padding:64px 0 0 0;
    background:rgba(255,255,255,.96);
    box-sizing:border-box;
    border-radius:100px 0 0 0;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:translateX(100%);
    transition:
      transform .45s ease,
      opacity .45s ease,
      visibility .45s;
  }

  .spMenu.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;

    transform:translateX(0);
  }

	/* close */

	.spMenu__close{
		position:absolute;
		top:40px;
		right:32px;
		width:28px;
		height:28px;
		padding:0;
		background:none;
		border:none;
		cursor:pointer;
	}

	.spMenu__close span{
		position:absolute;
		top:13px;
		left:0;
		width:28px;
		height: 1.5px;
		background:#e60012;
	}

	.spMenu__close span:nth-child(1){
		transform:rotate(45deg);
	}

	.spMenu__close span:nth-child(2){
		transform:rotate(-45deg);
	}

	/* nav */

	.spMenu__nav{
		position:relative;
		height:100%;
	}

	.spMenu__title{
		margin: 40px 0 40px 40px;
		font-size:22px;
		font-weight: bolder;
		line-height:1;
		color:#e60012;
		font-family:"Noto Serif JP", serif;
	}

	.spMenu__list{
		display:flex;
		flex-direction:column;
		gap:30px;
		margin: 0 0 0 40px;
		padding:0;
	}

	.spMenu__list li{
		list-style:none;
	}

	.spMenu__list a{
		position:relative;
		display:inline-block;
		padding-bottom:4px;
		font-size:16px;
		font-weight:700;
		color:#e60012;
		text-decoration:none;
	}

	.spMenu__list a::after{
		content:"";
		position:absolute;
		left:0;
		bottom:0;
		width:100%;
		height:2px;
		transform:scaleX(0);
		transform-origin:left center;
		transition:transform .3s;
	}

	.spMenu__list a:hover::after,
	.spMenu__list a.is-current::after{
		transform:scaleX(1);
	}

	/* recruit */

	.spMenu__recruit{
		display:flex;
		align-items:center;
		position:absolute;
		left: 0;
		width: 285px;
		height: 99px;
		padding: 10px 0px 10px 9px;
		background:#e60012;
		box-sizing:border-box;
		text-decoration:none;
		border-radius: 0 0 65px 0;
		margin-top: 30px;
	}

	.spMenu__recruitImg{
		flex:0 0 100px;
		width: 100px;
		height:62px;
		margin-right: 5px;
	}

	.spMenu__recruitImg img{
		display:block;
		width:100%;
		height:100%;
		object-fit:cover;
	}

	.spMenu__recruitBody{
		display:flex;
		flex-direction:column;
		justify-content:center;
	}

	.spMenu__recruitText{
		display:block;
		margin-bottom:8px;
		font-size:15px;
		font-weight:700;
		line-height:1.35;
		color:#fff;
	}

	.spMenu__recruitLink{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:10px;
    font-weight:700;
    color:#fff;
  }

  .spMenu__recruitLink::before{
    content:"";
    width: 30px;
    height:2px;
    background:#fff;
  }

  .spMenu__recruitLink::after{
    content:"";
    width:14px;
    height:14px;
    background:url("/common/images/header/icon-recruit-white.svg") no-repeat center center/contain;
  }


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

  .footer{
		padding: 140px 20px 30px 0;
		border-radius: 0;
		position:relative;
		overflow:hidden;
		background:#e60012;
	}

  .footer::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:760px;
    height:760px;
    background:#fff;
    border-radius:50%;
    transform:translate(-50%,-50%);
  }


	.footer__top{
		flex-direction:column;
		margin-bottom:60px;
	}

	.footer__company{
		width:100%;
		margin-bottom:50px;
		margin-left: 20px;
	}

	.footer__name{
		margin-bottom: 15px;
		font-size:16px;
	}

	.footer__address{
		font-size:16px;
	}

	.footer__nav{
		width:100%;
		row-gap: 8px;
		column-gap: 30px;
		margin-bottom: 30px;
		left: 20px;
		top: 150px;
	}

	.footer__nav a{
		font-size: 14px;
	}

	.footer__pageTop{
		margin-left:auto;
		top: -100px;
	}

	.footer__pageTopLine{
		height:140px;
	}

	.footer__pageTopText{
		font-size:13px;
	}

	.footer__bottom{
		flex-direction:column;
		align-items:flex-start;
	}

	.footerRecruit{
		width:100%;
		height:auto;
		padding:20px;
		border-bottom-right-radius:70px;
		margin: 75px 0 75px;
	}

	.footerRecruit__img{
		flex:0 0 110px;
		width:110px;
		margin-right:18px;
	}

	.footerRecruit__text{
		margin-bottom:16px;
		font-size:16px;
	}

	.footerRecruit__link{
		gap:10px;
		font-size:12px;
	}

	.footerRecruit__link::before{
		width:40px;
	}

	.footerRecruit__link::after{
		width: 14px;
		height: 14px;
	}

	.footer__branding{
		align-items: center;
		width: 100%;
		margin-left: 3%;
	}

	.footer__logo{
		margin-bottom:12px;
	}

	.footer__logo img{
		width:220px;
	}

	.footer__copyright{
		font-size: 10px;
		line-height:1.6;
		margin: 20px 0 55px;
		font-weight: 600;
	}








}