@charset "UTF-8";
/* CSS Document */

/****下層共通******************************/
.sub-p-top
{
	height:340px;

}



/******インタビュートップ************/
.int-top
{
	background:url("../img/int-top.jpg")no-repeat;
	background-size: cover;
	background-position:center;
}

.intTimg{height:400px}

@media screen and (max-width: 699px){
	.intTimg{height:350px}
}
.intTimg-data01
{
	background:url("../img/int-back-data01.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-data02
{
	background:url("../img/int-back-data02.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-infra01
{
	background:url("../img/int-back-infra01.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-infra02
{
	background:url("../img/int-back-infra02.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-infra03
{
	background:url("../img/int-back-infra03.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-sales01
{
	background:url("../img/int-back-sales01.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-DX01
{
	background:url("../img/int-back-DX01.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.intTimg-DX02
{
	background:url("../img/int-back-DX02.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}


a.other-int-link{
	text-decoration: underline!important;
	color:#006DEF;
}

/***職種紹介 新卒　中途*******************************/
.jobtype-title{font-size: 23px;}
.jobtype h3{font-size:24px;font-weight:bold;margin: 0px 0 20px;}
.student-points{background: rgba(255,255,255,1);}
.student-points dl
{width:100%;max-width:800px;margin: 0 auto;}
.student-points dl dt{
	padding:10px 0;
	font-weight:bold;
	border-top:solid 2px #ddd;
	border-bottom:solid 1px #ddd;}
.student-points dl dt:first-child{border-top:double 6px #ddd;}
.student-points dl dd{margin-bottom:30px;padding: 10px; 5px 10px 10px;}
.student-points dl dd:last-child{border-bottom:double 6px #ddd;}
.rikunabi{background:url(../img/rn_logo_b.png) no-repeat;
	background-size:contain;width:200px;height:60px;}
.wantedly{background:url(../img/wantedlyLogoLightBG.png) no-repeat;
	background-size:contain;width:200px;height:60px;}
.site-entry{background:url(../img/banner-entry.png) no-repeat;
	background-size:contain;background-position:center;width:86vw;max-width:450px;height:120px;}
@media screen and (max-width: 600px){
	.site-entry{background:url(../img/banner-entry.png) no-repeat;
	background-size:contain;background-position:center;width:89vw;max-width:450px;height:100px;}
}


.entry-flow div{
	border:solid 4px #eee;
	width:100%;
	max-width: 400px;
	padding: 13px 10px;
	margin-bottom:10px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position:relative;
}
.entry-flow div::after{
	content: '›';
	width:50px;
	height:50px;
	position:absolute;
	bottom: -55px;
	left:30px;
	font-size: 30px;
	transform: rotate(90deg);
	
}
.entry-flow div:last-child::after {
  content: none;
}

.entry-flow div p span{
	font-weight:600;
	margin-right:10px;
}

span.entry-flow-kome{
	font-weight:300;
	font-size:13px;
	margin-right:0px;
	display: flex;
	flex-direction: row;
}
span.entry-flow-kome a{
	color: #31B3C4;
	text-decoration: underline!important;
	margin: 0 10px;
	font-weight:700;
}

/**********************************/
/**********************************/
/*****各職種*****************************/
.career-c-top{
	position:relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;

}
.job-c-title{
	width: calc(140px + 10vw);
	max-width: 250px;
	background: white;
	margin-left:calc(30px + 4vw);
	padding:30px 20px 20px;
	box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.15);
	display: flex;
	flex-direction: column;
	justify-content:flex-start;
}
.job-c-title h2{font-size:calc(22px + 1vw);letter-spacing:1px;font-weight: bold;line-height:calc(24px + 1vw);}
.job-c-title h2 span{font-size:15px;letter-spacing:1px;font-weight: bold;line-height:calc(18px + 1vw);}
.job-c-title p{font-size:15px;letter-spacing:1px;}


@media screen and (max-width: 600px){
	.career-c-top{
		justify-content: flex-end;
	}
	.job-c-title{
		width: 300px;
		max-width: 300px;
		background: white;
		margin-left:20px;
		margin-bottom:-30px;
		padding:20px;
		box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.15);

	}
}


.job-data{
	background:url("../img/job-data.jpg")no-repeat;
	background-size: cover;
	background-position:bottom;
}
.job-infra{
	background:url("../img/job-infra.jpg")no-repeat;
	background-size: cover;
	background-position:center;
}
.job-sales{
	background:url("../img/job-sales.jpg")no-repeat;
	background-size: cover;
	background-position:top;
}
.job-analyst{
	background:url("../img/job-analyst.jpg")no-repeat;
	background-size: cover;
	background-position:center;
}

/**********************************/
.job-c-contents,.member-int-title,.sub-p-title{width:100%;height:auto;display:flex;flex-direction: column;align-items: center;margin:20px auto 0px;padding:30px 0;}/*職種各ページ説明*//*インタビュータイトルの箱*/
.job-c-contents h3{letter-spacing:2px;margin-bottom:30px;}
.job-c-contents p{line-height: 30px;font-weight:300;}
.job-c-contents-case{margin:20px 0 20px;font-size: 13px;border-top:solid 1px #ccc;border-bottom:solid 1px #ccc;padding:10px;}

/**********************************/
.member-int-title h3,.sub-p-title h3{font-size: 23px;font-weight:bold;height:77px;}/*インタビュータイトル*/
.sub-p-title>p{font-size:14px;height:40px;padding:0 20px;}

.member-list-container{display:flex;flex-direction:row;flex-wrap: wrap;align-items: center;gap:10px;margin-bottom:40px;padding: 0 10px;justify-content: space-around;width:100%;}

.member-list-card-text{width:100%;height:150px;padding:10px;display:flex;flex-direction: column;justify-content:flex-start;}
.member-list-card-text h5{height:20px;letter-spacing:1px;font-size:14px;line-height: 10px;margin:0;padding:0;}/*職種*/
.member-list-card-text h4{height:80px;font-weight: 500;font-size:20px;line-height:22px; margin:0;padding:0;}/*タイトル*/
.member-list-card-text h6{font-size:12px;line-height:20px;margin:0;padding:0;}/*部署*/
.member-list-card-text p{font-size:14px;font-weight: 700;line-height:10px;margin:0;padding:0;}/*名前*/
.member-list-card-text span{font-size: 14px;color: #006DEF;}/*インタビューを見る*/

@media screen and (min-width: 800px){
	.member-list-container article{
		width:calc(92vw / 3);
		max-width:320px;
		height:380px;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
		display: block;
	}
	.member-list-container::after{
		content: "";
        display: block;
        width: calc(92vw / 3);
		max-width:320px;
	}
	.member-A{
	width:100%;
	height:210px;
	}
	.member-list-card-text{width:100%;height:170px;padding:10px;display:flex;flex-direction: column;justify-content:space-around;}
	.member-list-card-text h5{letter-spacing:1px;font-size:14px;line-height: 13px;}/*職種*/
	.member-list-card-text h4{font-weight: 500; font-size: 1.3125rem;line-height:24px;}/*タイトル*/
	.member-list-card-text h6{font-size:15px;}/*部署*/
	.member-list-card-text p{font-size:15px;line-height:16px;}/*名前*/
	.member-list-card-text span{font-size: 18px;color: #006DEF;}/*インタビューを見る*/
}

@media screen and (max-width: 799px) and (min-width: 660px){
	.member-list-container article{
		width:calc(91vw / 3);
		max-width:330px;
		height:330px;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
		display: block;
	}
	.member-list-container::after{
		content: "";
        display: block;
        width: calc(91vw / 3);
		max-width:330px;
	}
	.member-A{
	width:100%;
	height:180px;
	}
	.member-list-card-text{width:100%;height:155px;padding:10px;display:flex;flex-direction: column;justify-content:space-between;}
	.member-list-card-text h5{letter-spacing:1px;font-size:14px;line-height: 13px;}/*職種*/
	.member-list-card-text h4{font-weight: 500; font-size: 1.1rem;line-height:22px;}/*タイトル*/
	.member-list-card-text h6{font-size:13px;}/*部署*/
	.member-list-card-text p{font-size:15px;line-height:16px;}/*名前*/
	.member-list-card-text span{font-size: 14px;color: #006DEF;}/*インタビューを見る*/
}
@media screen and (max-width: 659px) and (min-width: 590px){
	.member-list-container article{
		width:calc(91vw / 2);
		max-width:280px;
		height:330px;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
		display: block;
	}
	.member-list-container::after{
		content: "";
        display: block;
        width: calc(91vw / 2);
		max-width:280px;
	}
	.member-A{
	width:100%;
	height:180px;
	}
	.member-list-card-text{width:100%;height:155px;padding:10px;display:flex;flex-direction: column;justify-content:space-between;}
	.member-list-card-text h5{letter-spacing:1px;font-size:14px;line-height: 13px;}/*職種*/
	.member-list-card-text h4{font-weight: 500; font-size: 1.1rem;line-height:22px;}/*タイトル*/
	.member-list-card-text h6{font-size:13px;}/*部署*/
	.member-list-card-text p{font-size:15px;line-height:16px;}/*名前*/
	.member-list-card-text span{font-size: 14px;color: #006DEF;}/*インタビューを見る*/
}




/*横並び*/


@media screen and (max-width: 589px){
	
.member-list-container{width:98%;flex-direction:column;flex-wrap:nowrap;align-items: center;gap:20px;margin-bottom:50px;justify-content: space-between;}
.member-list-container article{
	width: 92vw;
	height:180px;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
	display:flex;
}
	.member-A{
	width:45vw;
	height:180px;
}
	.member-list-card-text{width:47vw;height:180px;padding:5px;display:flex;flex-direction:column;justify-content:space-between;}
	.member-list-card-text h5{height:20px;letter-spacing:1px;font-size:12px;line-height: 20px;}
	.member-list-card-text h4{height:100px;font-weight: 500;font-size:18px;line-height:25px;}
	.member-list-card-text h6{font-size:13px;}
	.member-list-card-text p{font-size:15px;line-height:15px;}
	.member-list-card-text span{font-size: 14px;color: #006DEF;}


}




/********join our team**************************/

.join-our-team{
	width:100%;
	height:150px;
	background: #54c8d8;
	display:flex;
	align-items: flex-end;
	justify-content: flex-start;
	position:relative;
	background-size: 20px 20px;
 	background-image: repeating-linear-gradient(45deg, #a0e0e8 0, #a0e0e8 2px, #a0e0e8 0, #a0e0e8 50%);
}

.join-our-team h3{
	color: #fff;
	font-size:88px;
	line-height:99px;
	letter-spacing:-1px;
	z-index:10;
}

.join-our-team h3:after{
	content:'応募する';
	font-size: 40px;
	position:absolute;
	top:75px;
	left:0;
}
.join-our-team div{z-index:10;}

.join-our-team-link{
	display:flex;
	width:100%;
	height:150px;
	background:#eee;
}
.join-our-team-link article{
	width:50%;
	height:150px;
	background: #aaa;
	padding:10px;
}
.join-our-team-link article.entry-stu{
	background: #C63E3E;
}
.join-our-team-link article.entry-ca{
	background: #5454BA;
}
.join-our-team-link article a{
	display: block;
    width: 100%;
	height:100%;
}

.join-our-team-link article a p{
	font-size:30px;
	font-weight:600;
	line-height:45px;
}
.join-our-team-link article a p span{
	font-size:18px;
	font-weight: 400;
}

.join-our-team-link article.entry-stu p{
	color:#E58989;
}
.join-our-team-link article.entry-ca p{
	color:#AAA0E0;
}

@media screen and (max-width: 500px){
	.join-our-team-link{
	display:flex;
	flex-direction: column;
	width:100%;
	height:200px;
	background:#eee;
}
	.join-our-team-link article{
	width:100%;
	height:100px;
	background: #aaa;
	padding:10px;
}
.join-our-team-link article a p{
	font-size:25px;
	font-weight:600;
	line-height:45px;
}
.join-our-team-link article a p span{
	font-size:13px;
	font-weight: 400;
}

	
}
/**********************************/
/**********************************/

.int-title-base{/*インタビュー個別ページのタイトル*/
    width: 320px;

    background: rgba(255,255,255,0.9);
    margin-left: calc(30px + 2vw);
	margin-top: -150px;
    padding: 10px 20px 20px 15px;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
	position:relative;
}
.int-title-base h5{margin-bottom:10px;}
.int-title-base h4{font-size:30px;line-height:43px;margin:5px 0 10px;}
.int-title-bottom{bottom:20px;}
.int-title-base p{font-weight:700;}

.int-box-position{margin-bottom:100px;}

.int-box dt{
	font-size: 25px;font-weight: 500;margin-bottom:20px;
}
.int-box dd{
	font-size: 15px;font-weight: 300;line-height:27px;margin-bottom:50px;
}

.int-box-career{background:#fff;border:dashed 1px #ccc;padding:10px 0 0 10px;margin:5px 0;border-radius: 5px;}
.int-box-career dt{
	font-size:18px;font-weight: 600;margin-bottom:5px;
}
.int-box-career dd{margin-bottom:10px;}

.int-photo{/*インタビュー個別ページ画像制御*/
	width:100%;
	height:300px;
	background: #eee;
	margin:10px 0;
	
}
.int-photo001a{
	background:url("../img/p-001a.jpg")no-repeat;
	background-size:cover;
	background-position: bottom;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo001b{
	background:url("../img/p-001b.jpg")no-repeat;
	background-size:cover;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-data02a{
	background:url("../img/p-data02a.jpg")no-repeat;
	background-size:cover;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-data02b{
	background:url("../img/p-data02b.jpg")no-repeat;
	background-size:cover;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}


.int-photo-infra01{
	background:url("../img/p-infra01a.jpg")no-repeat;
	background-size:cover;
	background-position: center;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-infra02{
	background:url("../img/p-infra02a.jpg")no-repeat;
	background-size:cover;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
	background-position: center;
}
.int-photo-infra03{
	background:url("../img/p-infra03a.jpg")no-repeat;
	background-size:cover;
	background-position: bottom;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-sales01{
	background:url("../img/p-infra01a.jpg")no-repeat;
	background-size:cover;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-DX01{
	background:url("../img/p-DX01a.jpg")no-repeat;
	background-size:cover;
	background-position: center;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-DX02a{
	background:url("../img/p-DX02a.jpg")no-repeat;
	background-size:cover;
	background-position: center;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}
.int-photo-DX02b{
	background:url("../img/p-DX02b.jpg")no-repeat;
	background-size:cover;
	background-position: center;
	width:100%;
	height:300px;
	margin:10px 0;
	border-radius:10px;
}

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

.int-title-base{/*インタビュー個別ページのタイトルスマホ*/
    width: 80%;
	height: 150px;
    background: rgba(255,255,255,0.5);
    margin-left: 15px;
	margin-top: 10px;
    padding: 0;
    box-shadow:none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
	position:relative;
}

.int-title-base h5{margin-bottom:10px;}
.int-title-base h4{font-size:22px;line-height:26px;margin:5px 0px;}
.int-title-base h6{font-size:13px;line-height:18px;margin:5px 0px;}
.int-title-base p{font-weight:700;}
.int-title-bottom{bottom:10px;}

.int-box-position{margin-bottom:40px;}
.int-box dt{
	font-size: 20px;font-weight: 500;margin-bottom:20px;
}
.int-box dd{
	font-size: 14px;font-weight: 400;line-height:27px;margin-bottom:50px;}

.int-box-career{background:#fff;border:dashed 1px #ccc;padding:10px 10px 0;margin:5px 0;border-radius: 5px;}
.int-box-career dt{font-size:16px;font-weight: 600;margin-bottom:5px;}
.int-box-career dd{margin-bottom:10px;font-weight: 400;}
	
}

@media screen and (min-width: 700px){
.int-box-position{
	display:flex;
	flex-direction: column;}
.int-box-position dl{width:550px;}
.int-step2{align-self: center;margin-left:-100px;}
.int-step-center{align-self: center;}
.int-step3{align-self: center;margin-left:100px;}
.int-step-end{align-self: flex-end;}

}




/*個別ページタイトルの新卒と中途*/
.t-shin{font-size:13px;font-weight:500;background:#5EDDCD;color:white;padding:2px 10px;margin:0 10px;}
.t-career{font-size:13px;font-weight:500;background:#9D73C9;color:white;padding:2px 10px;margin:0 10px;}

/**********************************/
/*********FAQ*************************/
.faq-back{background-color: #ffffff;
  background-image: linear-gradient(90deg, #c7c7c780 1px, transparent 1px), linear-gradient(#c7c7c780 1px, transparent 1px);border-top: solid 5px #eee;border-bottom: solid 5px #eee;
  background-position: 10px 10px;
  background-size: 46px 46px;}
.faq-par{text-align:left;padding:10px;}
.faq-par h5{background:white;font-size:22px;font-weight: 600; border-left:solid 10px #666;border-top:solid 1px #666;border-right:solid 1px #666;border-bottom:solid 1px #666;border-radius:10px;padding: 15px 0 15px 15px;margin:0;}
.faq-par dl{background:white; border:solid 1px #111;margin-top:10px;padding:10px 10px 10px 15px;border-radius:10px;}
.faq-par dl dt{font-size: 18px;font-weight: bold;margin: 10px 0 0;}
.faq-par dl dt p{font-size: 18px;font-weight: bold;line-height:24px;margin-top:15px;height:auto;}
.faq-par dl dt.shin p::after{content:'新卒';font-size:10px;background: #96E877;padding:1px 4px;font-weight:500;margin-left:5px;}
.faq-par dl dt.care p::after{content:'中途';font-size:10px;background: #50C3CC;padding:1px 4px;font-weight:500;margin-left:5px;}
.faq-par dl dt.engineer p::after{content:'エンジニア';font-size:10px;background: #D1CA52;padding:1px 4px;font-weight:500;margin-left:5px;}
.faq-par dl dt.sales p::after{content:'営業';font-size:10px;background: #BB8DD3;padding:1px 4px;font-weight:500;margin-left:5px;}
.faq-par dl dt.all p::after{content:'全員';font-size:10px;background: #ddd;padding:1px 4px;font-weight:500;margin-left:5px;}


.faq-par dl dd{line-height:28px;margin: 10px 0 0px;}
.faq-par a{color:#006DEF;text-decoration:underline!important;}
span.q-mark{font-weight:400;color:#666;border:solid 1px #ccc;border-radius: 10px; padding:3px 20px;}
/*
.faq-par dl dt span.shin::after{content:'新卒';font-size:10px;background: #96E877;padding:2px 6px;font-weight:500;margin-left:10px;border-radius: 10px;}
.faq-par dl dt span.care::after{content:'中途';font-size:10px;background: #50C3CC;padding:2px 6px;font-weight:500;margin-left:10px;border-radius: 10px;}
.faq-par dl dt span.engineer::after{content:'エンジニア';font-size:10px;background: #D1CA52;padding:2px 6px;font-weight:500;margin-left:10px;border-radius: 10px;}
.faq-par dl dt span.sales::after{content:'営業';font-size:10px;background: #BB8DD3;padding:2px 6px;font-weight:500;margin-left:10px;border-radius: 10px;}
.faq-par dl dt span.all::after{content:'全員';font-size:10px;background: #ddd;padding:2px 6px;font-weight:500;margin-left:10px;border-radius: 10px;}*/

/**********************************/
/***********福利厚生***********************/
.bene-par{width:100%;padding:10px;}

.bene-par>div{display:flex; flex-wrap:wrap;}

.bene-par dl{width:100%; border:solid 4px #eee;padding:20px 15px;margin:10px 0;border-radius:14px;}

.bene-par h5{font-size:30px/*clamp(2rem, 1.5vw, 2rem)*/;border-bottom:solid 4px #ddd;margin:30px 0 5px;display:inline-block;position:relative;}

.bene-par dl dt{display:flex;align-items:center;font-size: 20px;font-weight: bold;}
.bene-par dl dt p{border-left:solid 10px #FFED4A;border-bottom:solid 2px #FFED4A;padding-left:5px;border-radius:3px 0 0 3px;display: block;}
.bene-par dl dd{padding:10px 0 0;margin:0;font-size:14px;line-height:26px;}

.bene-par h5::after{
	content: "";
    display: inline-block;
    width: 38px;
    height: 38px;
    background-image: url('../img/pen.png');
    background-position: center;
    background-size: contain;
	position: absolute;
	bottom:-5px;
	right: -32px;
}
span.bene-par-subtext
{
	font-size:13px;
	display: block;
	margin:10px;
}
@media screen and (min-width:850px){
	.bene-par dl{width:45%;border:solid 4px #eee;margin:6px;border-radius:14px;}	
	.bene-par dl.bene-large{width:94%;}
}



.bene-photo-container
{
	background:#fff;
	display:flex;
	justify-content: space-between;
	margin: 10px 0;
}
.bene-photo-block
{
	background:#fff;
	width:30%;
	height:240px;
}
.bene-photo-img
{background:#fff;
	width:100%;
	height:80%;
}

@media screen and (max-width:850px){
.bene-photo-container
{
	background:#fff;
	display:flex;
	flex-direction: column;
	justify-content: space-between;
	margin: 5px 0;
}
.bene-photo-block
{
	background:#fff;
	width:100%;
	height:50vw;
}

.block-none{display:none;}

}



@media screen and (max-width:599px){
	.bene-par dl{width:100%; border:solid 3px #eee;padding:8px 10px;margin:3px 0px;border-radius:14px;}
	.bene-par h5{font-size:30px;border-bottom:solid 4px #ddd;display:inline-block;position:relative;}
	.bene-par dl dt{display:flex;align-items:center;font-size: 16px;font-weight: bold;}
	.bene-par dl dt p{border-left:solid 10px #FFED4A;border-bottom:solid 2px #FFED4A;padding-left:5px;padding-bottom:2px;border-radius:3px 0 0 3px;display: block;}
	.bene-par dl dd{padding:10px 0 0;margin:0;font-size:12px;line-height:20px;z-index: 10;}
	
}

#hk-menu{
	position: relative;
	z-index: 333;
	transition: all 0.6s ease; /* 0.3秒かけて滑らかに変化 */
}
#hk-menu.fixed{
	position: fixed;
 	top: 10px;
    left: 10px;
 	margin:0 auto;
	max-width:1100px;
	display:flex;
	align-items: flex-start;
	transform: translateY(0); /* 固定された位置 */
}



#hk-menu.before-fixed {
  transform: translateY(20px); /* 少し下からふわっと上がる */
  opacity: 0;
}

#hk-menu.fixed {
  opacity: 1;
}

#hk-menu ul{
	display:flex;
	justify-content: space-around;
	font-size:12px;
}
#hk-menu ul li{
	background: #fff;
	margin-right:4px;
	position:relative;
	border:solid 3px #eee;
	border-radius: 23px;
}
#hk-menu ul li::after{
	content: '\f061';
	font-family: 'Font Awesome 5 Free';
  	font-weight: 900;
  
	position: absolute;
	right:9px;
	top:17px;
}
#hk-menu ul li a {
  display: block;         /* 文字だけじゃなくli全体をクリック可能に */
  padding: 13px 25px 13px 10px;     /* クリックしやすい余白 */
  text-decoration: none;  /* 下線消したい場合 */
}




/* アクティブになった時の見せ方 */
#hk-menu li.active {
  background: #FFED4A;
}


@media screen and (min-width:1100px){
	#hk-menu.fixed{
	position: fixed;
 	top: 20px;
	/* 画面中央にある1100px幅の中に配置 */
    left: calc(50% - 550px); /* (1100px ÷ 2) */
 	margin:0 auto;
	max-width:1100px;
	display:flex;
	align-items: flex-start;
	transform: translateY(0); /* 固定された位置 */
}
	
	
}
@media screen and (max-width:450px){
#hk-menu.fixed{
	top:10px;
	left:2px;	
}

#hk-menu ul{
	font-size:9px;
	font-weight: 500;
}
#hk-menu ul li{
	margin-right:3px;
}
#hk-menu ul li::after{
	content: '\f061';
	font-family: 'Font Awesome 5 Free';
  	font-weight: 900;
  
	position: absolute;
	right:5px;
	top:11px;
}
#hk-menu ul li a {
  display: block;         /* 文字だけじゃなくli全体をクリック可能に */
  padding: 8px 17px 8px 5px;     /* クリックしやすい余白 */
  text-decoration: none;  /* 下線消したい場合 */
}

}










@media screen and (min-width:900px){
/*スライダー*/
    .slider,.slider02{
        width:100%;

        margin:12px auto 20px;
		
    }
    .slider img,
	.slider02 img
	{
        width:100%;
    }
    .slider .slick-slide
	.slider02 .slick-slide{
        height:auto!important;
    }
    .slider .slick-arrow,
	.slider02 .slick-arrow{
        z-index:2!important;
    }
    .slider .slick-next,
	.slider02 .slick-next
	{
        right:0!important;
    }
    .slider .slick-prev,
	.slider02 .slick-prev
	{
        left:0!important;
    }
    .slick-slide{
        margin-right: 0.8vw!important;
        margin-left: 0.8vw!important;
    }
	.slick-dots{
	bottom: -45px!important;
	}

}
@media screen and (max-width:899px){
/*スライダー*/
    .slider,.slider02{
        width:120%;
        margin:12px auto 20px;
		margin-left:-10%;
    }
    .slider img,
	.slider02 img
	{
        width:100%;
    }
    .slider .slick-slide,
	.slider02 .slick-slide
	{
        height:auto!important;
    }
    .slider .slick-arrow,
	.slider02 .slick-arrow{
        z-index:2!important;
    }
    .slider .slick-next,
	.slider02 .slick-next
	{
        right:0!important;
    }
    .slider .slick-prev,
	.slider02 .slick-prev{
        left:0!important;
    }
    .slick-slide{
        margin-right: 0.8vw!important;
        margin-left: 0.8vw!important;
    }
	.slick-dots{
	bottom: -20px!important;
	}
}

.bene-img-freeAd01{
	background: url(../img/bene_desk02.jpg);
	background-size: cover;
	background-position: center;
}
.bene-img-freeAd02{
	background: url(../img/bene_koshitsu.jpg);
	background-size: cover;
	background-position: center;
}
.bene-img-freeAd03{
	background: url(../img/bene_desk.jpg);
	background-size: cover;
	background-position: center;
}


.bene-img-lounge01{
	background: url(../img/bene_lounge01.jpg);
	background-size: cover;
	background-position: center;
}
.bene-img-lounge02{
	background: url(../img/bene_lounge02.jpg);
	background-size: cover;
	background-position: center;
}
.bene-img-lounge03{
	background: url(../img/bene_event03.jpg);
	background-size: cover;
	background-position: center;
}


.bene-img-event01{
	background: url(../img/bene_event04.jpg);
	background-size: cover;
	background-position: center;
}
.bene-img-event02{
	background: url(../img/bene_event02.jpeg);
	background-size: cover;
	background-position: center;
}
.bene-img-event03{
	background: url(../img/bene_event03.jpg);
	background-size: cover;
	background-position: center;
}

.bene-img-event03{
	background: url(../img/bene_event03.jpg);
	background-size: cover;
	background-position: center;
}


.bene-icon
{
	position:relative;
}
.shoseki-seido::before
{
	content: '';
	width: 70px;
	height:70px;
	background: url("../img/bene-mini-shoseki.png")no-repeat;
	background-size:contain;
	position: absolute;
	right:-15px;
}
.kakikyu::before
{
	content: '';
	width: 50px;
	height:50px;
	background: url("../img/bene-mini-kakikyuka.png")no-repeat;
	background-size:contain;
	position: absolute;
	bottom:-7px;
	right:0;
}
.koutsuhi::before
{
	content: '';
	width: 90px;
	height:90px;
	background: url("../img/bene-mini-tsukin.png")no-repeat;
	background-size:contain;
	position: absolute;
	bottom:-54px;
	right:8px;
}
.shouyo::before
{
	content: '';
	width: 40px;
	height:40px;
	background: url("../img/bene-mini-shoyo.png")no-repeat;
	background-size:contain;
	position: absolute;
	top:5px;
	right:8px;
}
.shokyu::before
{
	content: '';
	width: 50px;
	height:50px;
	background: url("../img/bene-mini-shoukyu.png")no-repeat;
	background-size:contain;
	position: absolute;
	top:10px;
	right:8px;
}

.tenkyo::before
{
	content: '';
	width: 60px;
	height:60px;
	background: url("../img/bene-mini-tenkyo.png")no-repeat;
	background-size:contain;
	position: absolute;
	bottom:-7px;
	right:8px;
}
.jutakushien::before
{
	content: '';
	width: 50px;
	height:50px;
	background: url("../img/bene-mini-jutaku.png")no-repeat;
	background-size:contain;
	position: absolute;
	bottom:-17px;
	right:8px;
	z-index: 1;
}

.kazokushien::before
{
	content: '';
	width: 50px;
	height:50px;
	background: url("../img/bene-mini-kazoku.png")no-repeat;
	background-size:contain;
	position: absolute;
	top:-2px;
	right:8px;
}

.kosodate::before
{
	content: '';
	width: 50px;
	height:50px;
	background: url("../img/bene-mini-kosodate.png")no-repeat;
	background-size:contain;
	position: absolute;
	top:5px;
	right:8px;
	transform: rotate(9deg);
}
/*
.yukyu::before
{
	content: '';
	width: 25px;
	height:50px;
	background: url("../img/bene-mini-jiyunomegami.png")no-repeat;
	background-size:contain;
	position: absolute;
	top:-5px;
	right:0px;
	transform: rotate(9deg);
}
*/

@media screen and (max-width:600px){
	.shouyo::before
	{
		content: '';
		width: 40px;
		height:40px;
		background: url("../img/bene-mini-shoyo.png")no-repeat;
		background-size:contain;
		position: absolute;
		top:30px;
		right:8px;
	}
	.koutsuhi::before
	{
		content: '';
		width: 60px;
		height:60px;
		background: url("../img/bene-mini-tsukin.png")no-repeat;
		background-size:contain;
		position: absolute;
		bottom:-36px;
		right:8px;
	}
	.tenkyo::before
	{
		content: '';
		width: 50px;
		height:50px;
		background: url("../img/bene-mini-tenkyo.png")no-repeat;
		background-size:contain;
		position: absolute;
		top:-48px;
		right:8px;
	}
	.jutakushien::before
	{
		content: '';
		width: 50px;
		height:50px;
		background: url("../img/bene-mini-jutaku.png")no-repeat;
		background-size:contain;
		position: absolute;
		top:0px;
		right:8px;
		z-index: 1;
	}


	.kosodate::before
	{
		content: '';
		width: 50px;
		height:50px;
		background: url("../img/bene-mini-kosodate.png")no-repeat;
		background-size:contain;
		position: absolute;
		top:1px;
		right:8px;
		transform: rotate(9deg);
	}	
	
	
}



/**********************************/