@charset "utf-8";

.shippori-mincho-regular {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "RobotoNormal";
  src: url("https://fonts.gstatic.com/s/roboto/v48/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3GUBHMdazTgWw.woff2") format("woff2");
  font-weight: 100 200 300 400 500 600 700 800 900;
  font-style: normal;
}

.roboto {
  font-family: "RobotoNormal", sans-serif !important;
  font-style: normal !important;
  font-weight: 400;
}

html{
font-size: 62.5%;
font-family:"Shippori Mincho", '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
		font-weight: normal;
		letter-spacing:-0.01em; 
		line-break: 1.4em;
		width: 100vw;
		overflow-x: hidden;
}
*,html,body{
	letter-spacing: 0.04em;
    line-break:strict;
    scroll-behavior: smooth;
}
img{
	display: block;
	max-width: 100%;
}

p span.fadein{
	display: block;
}
a i{
	padding-left: 4px;
}

header{
	position: fixed;
    z-index: 999;
    width: 100%;
    transition: .3s;
}
header .inner{
	display: flex;
	justify-content: space-between;
	padding-top: 24px;
	align-items: center;
}
header nav ul{
	display: flex;
	gap: 24px;
}
header nav ul li a{
	color: #fff;
	font-size: 1.5rem;
}
h2 img{
	width: fit-content;
	margin: 0 auto;
}
h2{
	font-size: 7rem;
	text-align: center;
}
h2 .sub{
	font-size:2.4rem;
	display: block;
}
a.more_btn,a span.more_btn,a p.more_btn,button.more_btn{
	position: relative;
	transition: .3s;
	font-weight: normal;
	display: block;
}
a span.more_btn,a p.more_btn,button.more_btn{
	width: fit-content;
}
a.more_btn:after,a.return_btn:after,a span.more_btn:after,a p.more_btn:after,button.more_btn:after{
	content: "";
	display: block;
	width: 16px;
	height: 10px;
	position: absolute;
	right: -24px;
	top: 0;
	bottom: 0;
	margin: auto;
	background-image: url(../img/next.png);
	background-repeat: no-repeat;
	transition: .3s;
}
table a.more_btn.recruit_more_btn{
	display: block;
	width: fit-content;
}
a.more_btn.recruit_more_btn:after{
	display: none;
}
a.more_btn.recruit_more_btn span{
	position: absolute;
	right: -24px;
	top: 0;
	bottom: 0;
	margin: auto;
	transition: .3s;
}
a.more_btn.recruit_more_btn:hover span{
	right: -28px;
}
a.more_btn.white:after,a.return_btn:after{
	background-image: url(../img/next_wh.png);
	right: 8px;
}
a.return_btn:hover:after{
	right: 3px;
}
a.more_btn.out_link:after{
	background-image: url(../img/link_icon.png);
	background-size: contain;
	width: 1.6rem;
	height: 1.6rem;
}
a.more_btn:hover:after,a:hover span.more_btn:after,button.more_btn:hover:after{
	right: -29px;
}
a.more_btn.out_link:hover:after{
	right: -24px;
	bottom: -4px;
}
a.more_btn.more_btn_i:after,
.company_menu.detail_page.recruit_menu .gridbox.column6 .c_menu_card .more_btn.more_btn_i:after{
display: none!important;
}
a.more_btn.more_btn_i i,
.company_menu.detail_page.recruit_menu .gridbox.column6 .c_menu_card .more_btn.more_btn_i i{
	transition: .3s;
	margin-left: 4px;
}
a.more_btn.more_btn_i:hover i,
.company_menu.detail_page.recruit_menu .gridbox.column6 .c_menu_card:hover .more_btn.more_btn_i i{
	margin-left: 8px;
}

img{
	transition: .3s;
}
a.return_btn{
	color: #fff;
	width: fit-content;
	margin: 40px auto;
	display: block;
	background-color: #204246;
	    padding: 8px 80px;
    border-radius: 22px;
    position: relative;
    font-size: 1.6rem;
}

.video-wrap video{
		height: auto;
		position: absolute;
		bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
		min-height: 100vh;
		min-width: 100vw;
		width: auto;
}
.video-wrap{
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	width: 100vw;
	height: 100vh;
	z-index: -1;
}
footer{
	color: #fff;
	font-size: 1.6rem;
	position: relative;
	overflow: hidden;
}
footer .footer_top{
	padding-top: 40px;
}
footer .footer_top .column2,
footer .footer_top nav{
	display: grid;
	grid-template-columns: 1fr 1fr;
}
footer .footer_top .column2{
	align-items: center;
	gap: 80px;
	grid-template-columns: 1fr 1.2fr;
	justify-content: space-between;
}
footer .footer_top nav{
	gap: 40px;
}
footer .footer_top nav ul li a,
.sitemap nav ul li a{
	font-size: 2rem;
	font-weight: bold;
}
footer .footer_top nav ul li ul a,
.sitemap nav ul li ul a{
	font-size: 1.6rem;
	font-weight: normal;
}
.sitemap nav ul li{
	margin-bottom: 16px;
}
.sitemap nav ul li ul{
	margin-top: 8px;
}
.sitemap nav ul li ul li{
	margin-bottom: 0;
}
.sitemap nav ul li ul{
padding-left: 1rem;
}
footer .footer_top nav ul:nth-child(2) ul:nth-child(1){
	margin-bottom: 108px;
}
footer .footer_top nav li{
	padding: 4px;
}
footer .footer_top nav li a{
	color: #fff;
}
footer .footer_top nav li ul{
	margin-left: 1em;
}
footer .footer_btn,
#nav_sub .mm_btn{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	    padding: 50px 0;
}
footer .footer_btn a,
#nav_sub .mm_btn a{
	font-size: 2.4rem;
	display: block;
	width: 100%;
	border: 1px solid #fff;
	padding: 16px;
	text-align: center;
	background-color: rgba(255,255,255,.2);
	border-radius: 4px;
	transition: .3s;
}
footer .footer_btn a:hover,
#nav_sub .mm_btn a:hover{
background-color: rgba(255,255,255,.4);
}
/**#nav_sub .mm_btn a{
	font-size: 1.4rem;
}**/
footer .footer_service p{
	font-size: 2rem;
}
#nav_sub .mm_service p{
	font-size: 1.5rem;
}
footer .footer_service a{
	font-size: 1.3rem;
	font-weight: normal;
}
#nav_sub .mm_service a{
	font-size: 1.2rem;
}
footer .footer_service ul,
#nav_sub .mm_service ul{
display: grid;
flex-wrap: wrap;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
padding: 16px 0;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
gap: 0 8px;
margin-top: 4px;
}
footer .footer_service ul li,
#nav_sub .mm_service ul li{
	padding: 4px 0;
}
footer .footer_sns{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 40px;
	padding: 40px 0;
}
footer .copy{
	background-color: #015697;
	padding: 8px 0;
}
footer .copy copy{
	color: #fff;
	font-size: 1.6rem;
	text-align: center;
	width: 100%;
	display: block;
}
article{
	width: 100vw;
}
#wrap_main{
	position: relative;
}
.fadein {
  opacity: 0;
  transform: translateY(40px);
}
#nav_sub{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 999;
	background-image: url(../img/nav_bg.jpg);
	background-size: cover;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	overflow: scroll;
}
#nav_sub a,#nav_sub p{
	color: #fff;
}
#nav_sub .inner{
	    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: auto;
}
#nav_sub .mm_sns{
	position: absolute;
	right: 0;
	top: 60px;
	display: flex;
	gap: 40px;
}
#nav_sub .mm_sns a{
	display: block;
	width: fit-content;
}
#nav_sub .logo{
	display: block;
	width: fit-content;
	margin: 24px auto;
}
#nav_sub nav.gridbox{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 40px;
	margin-top: 45px;
}
#nav_sub nav.gridbox div > a{
	font-size: 1.8rem;
	margin-bottom: 20px;
	display: block;
	    line-height: 1em;
}
#nav_sub nav.gridbox div ul{
	margin: 16px 0 16px 16px;
}
#nav_sub nav.gridbox div ul li{
	margin-bottom: 8px;
}
#nav_sub nav.gridbox div ul li a{
	font-size: 1.4rem;
	margin-bottom: 8px;
line-height: 1.6;
display: block;
}
#nav_sub .mm_bottom_nav{
	display: flex;
	justify-content: center;
	gap: 40px;
	margin-top: 24px;
}
#nav_sub .mm_bottom_nav a{
	font-size: 1.5rem;
}
#nav_box,#nav_close{
width: 44px;
height: 44px;
position: absolute;
	right: 6vh;
	top: 30px;
display: block;
}
#nav_close{
	right: 4vh;
}
#nav_close{
	height: 44px;
	z-index: 999;
	top: 28px;
}
/*#nav_box{
	top: 4.5vh;
}*/
#nav_box span:before,
#nav_box span:after,
#nav_close span:before,
#nav_close span:after{
	content: "";
	display: block;
	width: 100%;
	height: 3px;
	background-color: #fff;
	border-radius: 2px;
	position: absolute;
	left: 0;

}
#nav_close span:before{
	top: 24px;
	transform: rotate(45deg);
}
#nav_close span:after{
	transform: rotate(-45deg);
	bottom: auto;
	top: 24px;
}
#nav_close,#nav_box{
	cursor: pointer;
}
#nav_sub{
	opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity .8s ease,
    visibility .8s ease;
}
#nav_box span:before{
	top: 16px;
}
#nav_box span:after{
	bottom: 16px;
}
header.nav_open + #nav_sub{
	opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
a.text_link,
.recruit .recruit_column2 a,a.text_link_bk{
	position: relative;
	width: fit-content;
}
a.text_link:after,.recruit .recruit_column2 a:before,a.text_link_bk:before{
	content: "";
	display: block;
	width: 0;
	height: 1px;
	background-color: #fff;
	transition: .3s;
	position: absolute;
	bottom: -4px;
	left: 0;
}
a.text_link_bk.more_btn:before{
	display: none;
}
a.text_link_bk:before{
background-color: #111;
}
a.text_link:hover:after,.recruit .recruit_column2 a:hover:before,a.text_link_bk:hover:before{
	width: 100%;
}

header.hidden {
    transform: translateY(-120px);
}
.scroll-hint-icon{
	background: rgba(2, 134, 169,.9)!important;
}

@media screen and (min-width:1025px){
	.sp{
		display: none!important;
	}
.inner{
	width: 1200px;
	margin: 0 auto;
	max-width: 96%;
}
#nav_sub .inner{
	padding: 80px 0;
}
#nav_sub .mm_sns{
	top: 125px;
}
#nav_sub .inner{
	position: relative;
}
#nav_sub nav.gridbox div ul{
margin-top: 16px
}
#nav_box{
	top: 30px;
}
footer .footer_top nav li.sp_small a{
	font-size: 1.7rem;
	font-weight: normal;
}
}

@media screen and (max-width:1400px){
header nav ul{
	margin-right: 100px;
}
}
@media screen and (max-width:1024px){
	main{
		    max-width: 100vw;
    overflow-x: hidden;
	}
	.pc{
		display: none!important;
	}
	header .header_logo{
		width: 100px;
	}
	#nav_box{
		width: 26px;
		top: 3vh;
	}
	 #nav_close{
		        width: 26px;
        height: 26px;
		top: 4vh;
		z-index: 999;
	}
	#nav_box span, #nav_close span{
		    display: block;
    width: 100%;
    height: 100%;
	}
	#nav_sub .inner{
		position: relative;
		overflow-y: scroll;
		height: fit-content;
		max-width: 100vw;
		padding-bottom: 80px;
	}
	#nav_sub .logo{
		width: 310px;
		margin-top: 60px;
	}
	#nav_sub nav.gridbox{
		grid-template-columns: 1fr;
		padding: 0 24px;
		gap: 0;
	}
	#nav_sub nav.gridbox ul{
		margin-left: 16px;
		margin-top: 16px;
	}
	footer .footer_btn, #nav_sub .mm_btn{
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 24px;
	}
	footer .footer_btn{
		padding: 24px 0;
	}
	header.nav_open + #nav_sub{
		overflow-y: scroll;
	}
	footer .footer_btn a, #nav_sub .mm_btn a{
		font-size: 2.3rem;
		padding: 8px 16px;
	}
	#nav_sub .mm_service p{
		padding-left: 24px;
		font-size: 2rem;
		padding-bottom: 4px;
	}
	footer .footer_service ul, #nav_sub .mm_service ul{
		display: block;
		max-width: 94%;
        margin: 4px auto 16px;
	}
	footer .footer_service ul{
		max-width: 100%;
	}
	footer .footer_service ul li, #nav_sub .mm_service ul li{
		padding: 4px 16px;
		font-size: 1.4rem;
		font-weight: normal;
	}
	#nav_sub nav.gridbox div.sp > a{
		font-size: 1.4rem;
	}
	#nav_sub .mm_sns{
		top: auto;
    bottom: 24px;
    left: 0;
    right: 0;
    margin: auto;
    width: fit-content;
    gap: 32px;

	}
	#nav_box, #nav_close{
		right: 4vh!important;
	}
	#nav_close span:after,
	#nav_close span:before{
		top: 16px!important;
	}
	.inner{
		max-width: 90%;
		margin: 0 auto;
	}
	footer .footer_top .column2{
		grid-template-columns: 1fr;
	}
	footer .footer_top nav{
		grid-template-columns: 1fr;
		gap: 0;
	}
	footer .footer_top nav ul li a,
	.sitemap nav ul li a{
		font-size: 1.8rem;
	}
	footer .footer_top nav ul li.sp_small a,
	footer .footer_top nav ul li ul a,
	.sitemap nav ul li ul li a{
		font-size: 1.4rem;
		font-weight: normal;
	}
	footer .footer_service p{
		/*padding-left: 10px;*/
		font-size: 2rem;
	}
	footer .footer_service ul li{
		padding-left: 0;
	}
	footer .footer_service a{
		font-size: 1.6rem;
	}
	#nav_sub .inner{
		min-height: 100dvh;
	}
	#nav_sub{
		padding-bottom: 80px;
	}

.sp_1_line{
	white-space: nowrap;
	display: block;

}
header{
	top: 0;
}
#nav_sub .mm_sns a,footer .footer_sns a{
width: 32px;
display: block;
}
.footer_top .column2 > img{
	margin: 0 auto;
}
#nav_sub nav.gridbox div.sp>a{
margin-bottom: 16px;
}
}
@media all and (min-width: 1025px) and (max-width: 1242px) { 
	footer .footer_top .column2{
		        grid-template-columns: 1fr 640px;
        gap: 24px;
	}
}
@media all and (min-width: 480px) and (max-width: 1024px) { 
	#nav_box{
		top: 2vh;
	}
	.business_cont .gridbox.column2 .grid img{
		margin: 0 auto;
		display: block;
	}
}


@media screen and (max-width:414px){
.sp_1_line{
	letter-spacing: -0.04em;
}
}
