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

header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

.qa_click_a{display: none;}

/*ページ内リンク用 a id*/
a[id]{display: inline-block;padding-top: 75px;margin-top: -75px;}
@media only screen and (max-width: 690px) {
	a[id]{padding-top: 75px;margin-top: -75px;}
}

/*HEADER SEARCH MODAL*/
/****************************************************************/
.headersearch .modal__wrap {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
}
.headersearch .modal__bg {
  background: rgba(0, 0, 0, 0.8);
  height: 100vh;
  position: absolute;
  width: 100%;
}

.headersearch .modal__content {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
}

@media only screen and (max-width: 690px) {
	.headersearch .modal__content{
		width: 100%;
	}

}


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

on off

****************************************************************/
.sp_block{display: none;}
.sptab_block{display: none;}

@media only screen and (max-width: 979px) {
	.sptab_none{display: none;}
	.sptab_block{display: block;}
	.pc_block{display: none;}
}
@media only screen and (max-width: 690px) {
	.sp_block{display: block;}
	.sp_none{display: none;}
}

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

template_c2

****************************************************************/
#pagetitle.template_c2 .pagetitle_bg{
	width: 100%;
	height: 100%;
}

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

template_c3

****************************************************************/
@media only screen and (min-width: 980px) {
	.fadein {
		opacity : 0;
		transform : translate(0, 100px);
		transition : all 1s ease 0s;
	}
	.fadein.fadein01{transition : all 1s ease .3s;}
	.fadein.fadein02{transition : all 1s ease .7s;}
	.fadein.fadein03{transition : all 1s ease 1.1s;}
	.fadein.fadein04{transition : all 1s ease 1.5s;}
	.fadein.fadein05{transition : all 1s ease 1.9s;}
	.fadein.fadein06{transition : all 1s ease 2.3s;}
	.fadein.fadeinbg{transform : translate(-400px, 0);}

/*	// ._c3_info_block .fadein:nth-child(1){transition : all 500ms ease .3s;}
	// ._c3_info_block .fadein:nth-child(2){transition : all 500ms ease .8s;}
	// ._c3_info_block .fadein:nth-child(3){transition : all 500ms ease 1.3s;}
	// ._c3_info_block .fadein:nth-child(4){transition : all 500ms ease 1.8s;}*/

	.fadein.scrollin {
		opacity : 1;
		transform : translate(0, 0);
	}
}
.Anima {
  animation-iteration-count: 1;
}

/*-----　採用　-----*/

.re_mainimg .txt .lead,
.re_mainimg .txt p{
	opacity: 0;
	transform: translateY(-30px);
	transition: all 1s;
}

.re_mainimg .txt p{
	transition: all 1.3s;
}

.re_mainimg.start .txt .lead,
.re_mainimg.start .txt p{
	opacity: 1;
	transform: translateY(0);
}

.re_mainimg ul li .in .img{
	opacity: 0;
	transform: translateY(30px);
	transition: all .3s;
}

.re_mainimg.start ul li .in .img{
	opacity: 1;
	transform: translateY(0);
}

.here_map{
	position: relative;
}

.here_map span{
	position: absolute;
	width: 8%;
	height: 22%;
	cursor: pointer;
}

.here_map span.ryokan{
	top: 0;
	left: 1%;
}

.here_map span.shopping{
	top: 30%;
	left: 2.5%;
}

.here_map span.culture{
	top: 73%;
	left: 3.5%;
}

.here_map span.hospital{
	top: 7%;
	left: 13.5%;
}

.here_map span.hospital2{
	top: 25%;
	left: 20.5%;
}

.here_map span.restaurant{
	top: 12%;
	left: 29%;
}

.here_map span.station{
	top: 59%;
	left: 30%;
}

.here_map span.hotel{
	top: 17%;
	left: 45%;
}

.here_map span.park{
	top: 39%;
	left: 52%;
}

.here_map span.office{
	top: 2%;
	left: 58%;
}

.here_map span.airport{
	top: 68%;
	left: 59%;
}

.here_map span.showroom{
	top: 44%;
	left: 69%;
}

.here_map span.aquarium{
	top: 62%;
	left: 76%;
}

.here_map span.store{
	top: 36%;
	left: 77%;
}

.here_map span.building{
	top: 1%;
	left: 79%;
}

.here_map span.museum{
	top: 11%;
	left: 87%;
}

.map_about{
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(25, 24, 51, 0.8);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	z-index: -100;
}

.map_about.on{
	opacity: 1;
	z-index: 1000;
}

.map_about.on .in_area{
	max-width: 1200px;
	width: 100%;
	margin: 20px;
	padding: 70px;
	background-color: #fff;
	position: relative;
}

.map_about .in_area .close{
	width: 70px;
	height: 70px;
	background-color: #4E4E86;
	color: #fff;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
}

.map_about .in_area .close:before{
	content: '';
	width: 4px;
	height: 30px;
	background-color: #fff;
	transform: rotate(130deg);
	position: absolute;
	top: 20px;
	left: 35px;
}

.map_about .in_area .close:after{
	content: '';
	width: 4px;
	height: 30px;
	background-color: #fff;
	transform: rotate(45deg);
	position: absolute;
	top: 20px;
	right: 30px;
}

.map_about .in_area h2{
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 20px;
	border-bottom: 4px dotted #191833;
	margin-bottom: 30px;
}

.map_about .in_area .img_txt{
	display: flex;
	flex-wrap: wrap;
}

.map_about .in_area .img_txt .col_img{
	width: calc(50% - 15px);
	margin-right: 30px;
}

.map_about .in_area .img_txt .col_txt{
	width: calc(50% - 15px);
}

.here_map_sp{
	display: none;
}

@media only screen and (max-width: 690px){
	.here_map{
		display: none;
	}
	.here_map_sp{
        background-image: url(../image/here_01_sp.jpg);
        position: relative;
        top: 0;
        left: 0;
        display: block;
        width: 100%;
        margin: 0;
        padding: 20px 16px;
        background-position: center 0;
        background-repeat: no-repeat;
	}
	.here_map_sp .tab{
		border-bottom: 1px solid #4E4E86;
		border-left: 1px solid #4E4E86;
		border-right: 1px solid #4E4E86;
		background-color: rgba(255, 255, 255, 0.8);
	}
	.here_map_sp .tab:first-child{
		border-top: 1px solid #4E4E86;
	}
	.here_map_sp .tab .btn {
        padding: 10px;
        position: relative;
        color: #4E4E86;
        font-weight: 600;
        font-size: 16px;
        letter-spacing: 0.1rem;
     }
	.here_map_sp .tab .btn.active {
        color: #fff;
        background-color: #4E4E86;
     }
	.here_map_sp .tab .btn:before{
		content: '';
		width: 6px;
		height: 6px;
		border-top: 2px solid #4E4E86;
		border-right: 2px solid #4E4E86;
		transform: rotate(135deg);
		position: absolute;
		top: calc(50% - 5px);
		right: 10px;
		transition: all .2s ease 0s;
	}
	.here_map_sp .tab .btn.active:before{
		transform: rotate(315deg);
		top: calc(50% - 2px);
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
	}
	.here_map_sp .tab .btn_area{
		display: none;
		padding: 20px;
		background-color: #fff;
	}
}