@charset "utf-8";

html {
	/* ルートのフォントサイズを10pxに設定しておく */
	font-size: 62.5%;
	/*scroll-behavior: smooth;*/
}

body {
	/* ルートのフォントサイズを1.6em（16pxと同等のサイズ）に設定 */
	font-size: 1.6em;
	font-family:"游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic","ヒラギノ角ゴ Pro W2", Hiragino Kaku Gothic Pro, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #222;
	line-height: 2;
}

a[href^="tel:"] {
	color: inherit;
	pointer-events: none;
	text-decoration:none;
	display: inline-block;
}

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

a[href^="tel:"] {
	color: inherit;
	pointer-events: auto;
}

}

ul{ padding: 0; list-style-type: none;}

.pc{ display: block ; }
.sp{ display: none ; }

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

.pc{ display: none ; }
.sp{ display: block ; }

}


a {
	color: #222;
	transition: all .2s;
}

a:hover {
	color: #222;
	transition: all .2s;
}


a img:hover {
	opacity: 0.8;
	transition: all .2s;
}

.link_ani a {
	position: relative;
	display: inline-block;
	transition: 0.1s;
	text-decoration: none;
}

.link_ani a::after {
	position: absolute;
	bottom: 0;
	left: 0;
	content: '';
	width: 0;
	border-bottom: solid 2px #fff;
	transition: 0.1s;
	opacity: 0.6;
}

.link_ani a:hover::after {
	width: 100%;
}

/*----------------------------------------*/

.mt-6 {margin-top: 6rem;}
.btn {
	padding: 1rem 2rem;
	font-size: 1.6rem;
}
.font-red {color: #CC0000;}
.font-25 {font-size: 2.5rem;}
.font-24 {font-size: 2.4rem;}
.font-23 {font-size: 2.3rem;}
.font-22 {font-size: 2.2rem;}
.font-21 {font-size: 2.1rem;}
.font-20 {font-size: 2rem;}
.font-19 {font-size: 1.9rem;}
.font-18 {font-size: 1.8rem;}
.font-17 {font-size: 1.7rem;}
.font-16 {font-size: 1.6rem;}
.font-15 {font-size: 1.5rem;}
.font-14 {font-size: 1.4rem;}
.font-13 {font-size: 1.3rem;}
.font-12 {font-size: 1.2rem;}
.font-11 {font-size: 1.1rem;}
.font-10 {font-size: 1rem;}

.pc-pd15 {margin-left: 15px; margin-right: 15px;}

/*----------------------------------------*/

header{
}

.head{
	max-width: 1200px;
	margin: 0 auto;

	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 120px;
}

.head .call_area{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	
	width: 380px;
}

.head .call_area li:first-child{
	border-bottom: 1px solid #c62b2b;
	
	height: 3.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.4rem;
	color: #c62b2b;
	padding: 0 1rem;
	font-weight: bold;
	
	width: 100%;
}

.head .call_area li:last-child{
	
	height: 5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #c62b2b;
}

.head .call_area li:last-child div{
	font-weight: bold;
	border: 2px solid #c62b2b;
	padding: 0.2rem 1.5rem 0rem;
	margin-right: 1rem;
}

.head .call_area li:last-child i{
	font-size: 3rem;
}

.head .call_area strong{
	font-size: 3.4rem;
}

.head .logo{
	display: flex;
}

.head .logo h1{
	max-width: 320px;
	margin-right: 10px;
}

.head .logo h1 img{
	width: 100%;
}

/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	.head .call_area li:last-child {
		width: 100%;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */


/*-------------*/

nav{
	min-height: 65px;
	padding: 1.5rem 0;
}

.nav{
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 1200px;
	margin: 0 auto;
	
}
/*
.nav li{
	width : -webkit-calc(100% / 5) ;
	width : calc(100% / 5) ;
	border-left: 1px solid #fff;
	text-align: center;
	min-height: 40px;
	
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.6rem;
}

.nav li a{
	width: 100%;
	min-height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 2rem;
	color: #fff;
	transition-duration: 0.5s;
}

.nav li a:hover{
	text-decoration: none;
	background: rgba(255, 255, 255, 0.2);
}

.nav li a i{
	font-size: 2rem;
	margin-right: 0.5rem;
}

.nav li:last-child{
	border-right: 1px solid #fff;
}
*/
nav .call_area{
	display: none;
}

.p_list{
	display: flex;
	align-items: center;

	max-width: 1200px;
	margin: 0 auto;
	list-style: none;
	min-height: 3.5rem;
}

.p_list li{
	font-size: 1.2rem;
	padding-right: 0.5rem;
	margin-right: 0.5rem;
}

.p_list li::before{
	content: url(../img/p_list.png);
	margin-right: 0.5rem;
}

.p_list li:first-child::before{
	content: none;
}

.p_list li a{
	color: #212529;
}

/*---------------------------------------------------*/

.main_cover{
	position: relative;
}

.main_cover .taxi{
	position: absolute;
	z-index: 1;
	bottom: 0;
	max-width: 1200px;
	margin: 0 auto;
	left: 0;
	right: 0;
}

.main_cover .taxi img{
	max-width: 570px;
	width: 45vw;
	margin: 0 0 -4rem -4rem;
}

.main_cover .icon{
	position: absolute;
	z-index: 1;
	top: 3rem;
	max-width: 1200px;
	margin: 0 auto;
	left: 0;
	right: 0;
	text-align: right;
}

.main_cover .icon img{
	max-width: 230px;
	width: 23vw;
	margin: 0 0 -4rem -4rem;
}

.main_cover .catch{
	position: absolute;
	z-index: 1;
	top: 0;
	max-width: 1200px;
	margin: 0 auto;
	left: 0;
	right: 0;
	padding: 5.2rem 0 0 5.5rem;
}

.main_cover .catch h2{
	font-size: 5rem;
	font-weight: bold;
	margin-bottom: 3rem;

	text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,-2px 2px 0 #FFF, 1px -2px 0 #FFF,0px 2px 0 #FFF, 0 -2px 0 #FFF, -2px 0 0 #FFF, 2px 0 0 #FFF;

	font-size: calc(5rem + ((1vw - 0.64rem) * 0.7143));/* 20px~24pxで可変*/
}

.main_cover .catch p{
	font-size: 2rem;
	font-weight: bold;

	text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,-2px 2px 0 #FFF, 1px -2px 0 #FFF,0px 2px 0 #FFF, 0 -2px 0 #FFF, -2px 0 0 #FFF, 2px 0 0 #FFF;
}

/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	.main_cover .catch{
		padding: 2.5rem 0 0 3rem;
	}
	
	.main_cover .catch h2 {
		margin-bottom: 2rem;
		font-size: calc(4rem + ((1vw - 0.64rem) * 0.7143));
	}
	
	.main_cover .taxi img {
		width: 35vw;
		margin: 0 0 -4rem 0rem;
	}
	
	.main_cover .icon {
		right: 2rem;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width:700px ){

	.main_cover .catch {
		padding: 2rem 0 0 2rem;
	}

	.main_cover .catch h2 {
		font-size: calc(3.5rem + ((1vw - 0.64rem) * 0.7143));
		margin-bottom: 2rem;
	}

	.main_cover .catch p {
		font-size: 1.4rem;
	}

	.main_cover .icon{
		right: 1rem;
	}

	.main_cover .icon img {
		max-width: 230px;
		width: 32vw;
		margin: 0 0 -4rem -4rem;
	}

	.main_cover .taxi img{
		width: 50vw;
		margin: 0px 1rem -3rem 1rem;
	}


}/* ウィンドウ幅が0～700pxの場合に適用するCSS */

/*---------------------------------------------------*/

.top_contents{
	background: url(../img/bg.jpg) no-repeat #fdfae9;
	background-size: contain;
	
	overflow: hidden;
}

/*---------------------------------------------------*/

.news_list{
	width: 100%;
	display: flex;
	justify-content: space-around;
	margin-bottom: 6rem;
	flex-wrap: wrap;
}

.news_list li{
	width: 100%;
	background: #fff;
	text-align: center;
	padding: 2rem 0;
	
	position: relative;
	border-bottom: 1px solid #e1e1e1;
}

.news_list li .new{
	position: absolute;
	top: 0;
	left: 0;
}

.news_list li img{
	margin-bottom: 2rem;
}

.news_list .text{
	/*margin: 0 2rem;*/
	text-align: left;
	display: flex;
	align-items: center;
}

.news_list .text .data_line{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 28rem;
}

.news_list .text div:last-child{
	max-width: 100rem;
}



.news_list .text p{
	font-size: 1.2rem;
	margin-bottom: 0.3rem;
	color: #9a9a9a;
}

.news_list .text a.category{
	background: #3a3a3a;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	margin: 0 4rem;
	width: 10rem;
}

.news_list .text small{
	color: #9a9a9a;
}

.news_list .text h5{
	color: #9a9a9a;
	font-size: 1.6rem;
}

.news_list .text h5 a{
	color: #222;
}


/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	.news_list li{
		width: 230px;
		height: auto;
		padding: 2rem;
	}

	.news_list li img{
		width: 100%;
	}
	
	.news_list .text {
		margin: 0rem;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width:700px ){

	.news_list {
		flex-wrap: wrap;
	}
	
	.news_list li{
		margin-bottom: 2rem;
	}
	
	.news_list li:last-child{
		margin-bottom: 0;
	}

}/* ウィンドウ幅が0～700pxの場合に適用するCSS */


/*---------------------------------------------------*/

/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	.about_area{
		width: 90%;
		margin: 0 auto;
	}

	.about_area .image{
		margin-bottom: 2rem;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width:700px ){

	.about_area{
		width: 90%;
		margin: 0 auto;
	}

	.about_area .image{
		margin-bottom: 2rem;
	}

}/* ウィンドウ幅が0～700pxの場合に適用するCSS */

/*---------------------------------------------------*/

.h3_title{
	text-align: center;
	width: 100%;
	margin: 0 auto 6rem;
}

.h3_title h3{
	font-size: 10rem;
	/* border-bottom: 1px solid #2f2f2f;*/
	font-weight: bold;
	position: relative;
}
/*
.h3_title h3::before{
	position: absolute;
	content: url(../img/icon_taxi.png);
	bottom: -1rem;
	left: 30%;
}
*/
.h3_title p{
	font-size: 2rem;
	font-weight: bold;
}

.content{
	width: 100%;
}

.content.news_area{
	width: 100%;
	background: #f9f4ee;
}

.content section{
	max-width: 1600px;
	padding: 8rem 2rem;
	margin: 0 auto;
	/*background: #eee;*/
}

.content section.bottom_contact{
	padding: 8rem 2rem 0;
}

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

	.content section{
		margin: 0 2rem;
	}

}

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

	.content section{
		padding: 8rem 0rem;
	}

}

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

	.content section{
		margin: 0 auto;
	}

}


.content section.title_only{
	padding: 8rem 0 0;
}

.content section.title_only.top_title{
	padding: 14rem 0 0;
}

#content{
	margin-left: 15px;
	margin-right: 15px;
}

/*---------*/
/* Bootstrap 4 カスタマイズ */

.lead{
	font-size: 2.5rem;
	margin-bottom: 2rem;
	font-weight: bold;
}

/* ウィンドウ幅が0～1024pxの場合に適用するCSS */
@media screen and ( max-width:1024px ){

	.h3_title h3::before{
		display: none;
	}

}/* ウィンドウ幅が0～1024pxの場合に適用するCSS */

/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	#content{
		margin-left: 0;
		margin-right: 0;
	}

	.h3_title {
		width: 100%;
	}

	.h3_title h3::before{
		display: none;
	}
	
	.content section.title_only.top_title {
		padding: 8rem 0 0;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width:700px ){

	.h3_title {
		width: 100%;
		margin: 0 auto 4rem;
	}

	.h3_title.top_page {
		margin-bottom: 0;
	}
	
	.h3_title h3::before {
		left: 0%;
	}
	
	.h3_title h3{
		font-size: 4rem;
	}
	
	.h3_title.sub{
		margin-bottom: 4rem;
	}

	.content section.title_only.top_title{
		padding: 4rem 0 0;
	}
	
	.content section.title_only{
		padding: 6rem 0 0;
	}



}/* ウィンドウ幅が0～700pxの場合に適用するCSS */

.contents{
	width: 100%;
	margin: 0 auto;
	
}

.contents .left_area{
	width: 850px;
}

/*---------------*/

.top_bt{
	background: #bf5454;
	width: 250px;
	height: 70px;
	border-radius: 5rem;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	
	transition: 0.5s ;
}

.top_bt:hover{
	text-decoration: none;
	color: #fff;
	background: #d77777;
}
/*----------------------*/
	
.page_top{
	position: fixed;
	bottom: 1rem;
	right: 1rem;
}
	
.page_top a{
	display: flex;
	align-items: center;
	justify-content: center;
	background: #222;
		
	border-radius: 50rem;
	width: 50px;
	height: 50px;
	color: #fff;
	text-decoration: none;
	transition: 0.5s;
}

.page_top a:hover{
	background: #444;
}

.page_top a i{
	font-size: 5rem;
}

/*----------------------------*/

.footer_banner{
	width: 100%;
	
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 6rem 0 3rem;
	background: #222222;
	margin: 0 0 0 0;
	color: #fff;
}

.footer_banner + div.line{
	display: none;
}

.footer_banner li{
	padding: 0 3.5rem;
	display: flex;
	align-items: center;
	border-right: 1px solid #656565;
}

.footer_banner li a{
	transition-duration: 0.5s;
	color: #fff;
}

.footer_banner li a:hover{
	opacity: 0.6;
}

.footer_banner li a img{
	max-width: 17rem;
	min-width: 17rem;
}

.footer_banner li.title{
	font-size: 2.5rem;
	font-weight: bold;
	border-right: 2px solid #fff;
}

.footer_banner li p{
	line-height: 1.8rem;
	margin: 0 0 0 2rem;
}

/*-----*/

.footer_banner.partnership{
	padding-top: 0;
}

.footer_banner.partnership li.title{
	width: 27.5rem;
}

.footer_banner.partnership li p small{
	font-size: 100%;
}

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

	.footer_banner li {
		padding: 0 1.5vw;
	}

	.footer_banner li a img{
		width: 100%;
	}

	.footer_banner li.title {
		font-size: 1.5vw;
	}

	.footer_banner.partnership li.title{
		width: 15.4vw;
	}

}

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

	.footer_banner{
		flex-wrap: wrap;
	}

	.footer_banner li.title {
		/* border-right: 0; */
		/* width: 95%; */
	}
	
	.footer_banner li {
		padding: 0 1.5rem;
		border-right: none;
	}

	.footer_banner li p {
		margin: 0 0 0 1rem;
	}

	.footer_banner.partnership li.title{
		width: 16.7vw;
	}

}

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

	.footer_banner li{
		width: 100%;
	}

	.footer_banner li img{
		width: 100%;
	}

	.footer_banner li p {
		margin: 0 0 0 1rem;
		width: 30rem;
	}
	
	.footer_banner li p small{
		font-size: 70%;
	}
	
	.footer_banner li {
		padding: 0 1.5rem;
		width: 47%;
	}
	.footer_banner li.title {
		margin-bottom: 1rem;
	}

	.footer_banner.partnership li.title{
		width: 17.4vw;
	}

}

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

    .footer_banner.partnership li.title {
        width: 14.8rem;
    }

}

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width: 559px ){

	.footer_banner {
		width: 100%;
		flex-wrap: wrap;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 3rem 0 3rem;
		background: #222222;
		margin: 0 0 0 0;
		color: #fff;
	}
	
	.footer_banner.partnership {
	    padding-top: 3rem;
	}

	.footer_banner + div.line{
		position: relative;
        display: block;
        margin: 0;
        width: 100%;
        margin-bottom: 0rem;
        height: 0.1rem;
        padding: 0;
        background: #222222;
	}
	
	.footer_banner + div.line::after{
        content: '';
        width: 80%;
        height: 0.1rem;
        display: block;
        background: #fff;
        margin-left: auto;
        margin-right: auto;
	}

	.footer_banner img{
		width: 80%;
		height: auto;
		align-self: flex-start;
	}

	.footer_banner li:first-child {
		margin-bottom: 1rem;
	}

	.footer_banner li {
		width: 100%;
		margin: 0.5rem 0;
		padding: 0px 3rem;
		border-right: 0;
		display: flex;
		justify-content: center;
	}

	.footer_banner li.title{
		font-size: 1.5rem;
		border-right: 0;
	}


	.footer_banner li a img{
		width: 80%;
		max-width: unset;
		min-width: unset;
	}
	
	.footer_banner li p {
		margin: 0 0 0 1rem;
		width: 40%;
		font-size: 1.3rem;
	}

	.footer_banner li > a{
		display: flex;
		width: 50%;
		justify-content: flex-end;
	}


}/* ウィンドウ幅が0～700pxの場合に適用するCSS */


/*---------------*/

.footer_link{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.4rem;
	height: 8.5rem;
	margin: 0 auto;
	color: #fff;
	flex-wrap: wrap;
	/*width: 33rem;*/
	width: 100%;
}

.footer_link a{
	color: #fff;
}

.footer_link li{
	margin: 0 2rem;
}

.footer{
	border-top: 1px solid #fff;
	background: #222222;
	padding-top: 8rem;
}

.footer .footer_area{
	max-width: 1300px;
	margin: 0 auto;
	text-align: center;
}

.footer ul li img{
	width: 100%;
}


.footer .copy{
	text-align: center;
	font-size: 1.2rem;
	padding: 2.5rem 0;
	color: #fff;
}

.footer .copy a{
	color: #fff;
}

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

	.footer_link li{
		margin: 0 1.5rem;
	}

}

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

	.footer_link li{
		margin: 0 1.3rem;
	}

}

/*---------*/

.service_footer{
	color: #fffefe;
	width: 62%;
	margin: 0 auto;
}

.service_footer ul{
	display: flex;
	margin: 2rem  0 0 ;
	font-size: 1.4rem;
}

.service_footer ul li{
	margin-left: 2.5rem;
}

.service_footer ul li a{
	display: flex;
	color: #fffefe;
}

.service_footer ul li.title{
	width: 15rem;
	text-align: left;
	border-right: 0.1rem solid #fffefe;
}

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

	.service_footer {
	    width: fit-content;
	}

}

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

	.service_footer{
		/*width: 80%;*/
	}

}

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

	.service_footer ul li{
		margin-left: 2.0rem;
	}

}

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

	.service_footer {
		width: 94%;
		padding-bottom: 4rem;
	}

}

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

	.service_footer ul li.title{
		border-right: none;
	}

}

/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	.footer .footer_area {
		max-width: 100%;
		flex-wrap: wrap;
	}
	
	.footer .footer_area ul.footer_link {
		width: 80%;
		margin: 0 auto;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width:700px ){

	.footer{
		padding-top: 6rem;
	}

	.footer .footer_area{
		max-width: 100%;
		flex-wrap: wrap;
	}

	.footer .footer_area img{
		max-width: 45%;
	}

	.footer .footer_area ul.footer_link {
		width: 100%;
	}
	
	.footer .footer_area ul.footer_link li {
		width: auto;
		padding: 0rem 1rem;
		position: relative;
		border-bottom: none;
		font-size: 1.2rem;
	}
	
	.footer .copy {
		font-size: 1.2rem;
		padding: 1rem 0 2rem;
	}

}/* ウィンドウ幅が0～700pxの場合に適用するCSS */

/*---------------*/

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


}/* ウィンドウ幅が0～1200pxの場合に適用するCSS */


/* ウィンドウ幅が0～768pxの場合に適用するCSS */
@media screen and ( max-width:768px ){

	.head {
		padding: 0 1rem;
	}

	.head .logo h1 {
		max-width: 250px;
		margin-right: 10px;
	}


	.head .call_area strong {
		font-size: 2.5rem;
	}

	.nav li a {
		padding: 0 1rem;
	}
	
	.p_list {
		padding: 0 1rem;
	}

	.contents {
		max-width: 768px;
		flex-wrap: wrap;
	}
	
	.contents .left_area {
		width: 100%;
	}
	
	.contents .right_area {
		width: 100%;
		border-bottom: 4px solid #fff;
	}

	.top_about {
		background: url(../img/top/bg.png) no-repeat 7rem;
		padding: 6rem 13rem;
	}
	
	.page_top a {
		width: 55px;
		height: 55px;
	}
	
	.footer_link {
		flex-wrap: wrap;
		height: auto;
		padding: 2rem 0;
		line-height: 4rem;
	}
	
	/*----------------------*/
	
	.nav {
		flex-wrap: wrap;
		width: auto;
		max-width: none;
	}
	
	.nav li{
		width: 100%;
		border-bottom: 1px solid #fff;
		border-left: none;
	}
	
	.nav li a {
		justify-content: left;
		padding: 0;
	}
	
	.nav li:last-child {
		border-right: none;
	}
	
	nav .call_area{
		display: block;
		margin: 2rem;
		border-top: 1px dotted #fff;
		border-bottom: 1px dotted #fff;
		color: #fff;
		padding: 1rem 0.5rem 0.5rem;
	}
	
	nav .call_area li:last-child {
		display: flex;
		align-item: center;
		font-size: 2.2rem;
		align-items: center;
	}
	
	nav .call_area li:last-child a{
		color: #fff;
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

@media screen and ( max-width:820px ){/*-2025年6月16日対応-*/

	.service_footer ul {
		flex-wrap: wrap;
	}
	.service_footer ul li:first-child {
		width: 100%;
		margin-right: 0;
		margin-bottom: 1.5rem;
	}
	.service_footer ul li.title {
		/*border-right: none;*/
		width: 10rem;
        margin-left: 0;
	}
	.service_footer ul li.title.none {
		/*display: none;*/
	}

}/* ウィンドウ幅が0～768pxの場合に適用するCSS */

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

	.service_footer ul li.title {
		width: 10rem;
        margin-left: 2.5rem;
	}
	.service_footer ul li.title.none {
		display: none;
	}

}

/* ウィンドウ幅が0～700pxの場合に適用するCSS */
@media screen and ( max-width:700px ){

	.head {
		flex-wrap: wrap;
		height: auto;
		padding: 1.2rem 1rem;
	}

	.head .logo {
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	
	.head .logo h1 {
		max-width: 60%;
	}
	
	.head .logo h1 img {
		width: 100%;
	}
	
	.head .logo p {
		font-size: 1.2rem;
		min-width: 80px;
	}
	
	.head .logo div {
		font-size: 1.1rem;
	}
	
	.head .logo div span {
		font-size: 1.1rem;
		font-weight: normal;
	}
	
	.head .call_area {
		align-items: center;
		margin: 0 auto 2rem;
		display: none;
	}
		
	/*----------------------*/

	.p_list {
		border-top: 1px solid #eee;
		/*border-bottom: 1px solid #eee;*/
		padding-left: 1rem;
	}

	.contents {
		flex-wrap: wrap;
	}
	
	.contents .left_area {
		width: 100%;
	}
	
	.contents .right_area {
		width: 100%;
		border-bottom: 4px solid #fff;
	}

	
	/*----------------------*/

	.page_top {
		bottom: 0.5rem;
		right: 0.5rem;
	}
	
	.page_top a {
		width: 40px;
		height: 40px;
	}
	
	.page_top a i {
		font-size: 4rem;
	}
	
	.footer_link {
		flex-wrap: wrap;
		height: auto;
	}
	
	.footer_link li{
		width: 50%;
		margin: 0;
		padding: 1rem;
		
		position: relative;
		border-bottom: 1px solid #fff;
	}

	.footer ul {
		flex-wrap: wrap;
	}
	
	.footer ul li:first-child {
		width: 100%;
		margin-right: 0;
		margin-bottom: 1.5rem;
	}
	
	.footer ul.footer_data li:last-child {
		width: 100%;
		text-align: center;
	}


}/* ウィンドウ幅が0～700pxの場合に適用するCSS */

/* スマートフォン　グローバルナビ */
@media screen and ( max-width:768px ){

	.global-nav {
		position: fixed;
		right: -320px; /* これで隠れる */
		top: 0;
		width: 30rem; /* スマホに収まるくらい */
		height: 100vh;
		padding-top: 40px;
		background-color: #222;
		transition: all .6s;
		z-index: 200;
		overflow-y: auto; /* メニューが多くなったらスクロールできるように */
	}
	.hamburger {
		position: fixed;
		right: 7px;
		top: 7px;
		width: 42px; /* クリックしやすいようにちゃんと幅を指定する */
		height: 42px; /* クリックしやすいようにちゃんと高さを指定する */
		cursor: pointer;
		z-index: 300;
		border: 2px solid #fff;
	}
	.global-nav__list {
		margin: 0 2rem;
		padding: 0;
		list-style: none;
	}
	.global-nav__item {
		text-align: center;
		padding: 0 14px;
	}
	.global-nav__item a {
		display: block;
		padding: 8px 0;
		border-bottom: 1px solid #eee;
		text-decoration: none;
		color: #111;
	}
	.global-nav__item a:hover {
		background-color: #eee;
	}
	.hamburger__line {
		position: absolute;
		left: 11px;
		width: 18px;
		height: 2px;
		background-color: #fff;
		transition: all .6s;
	}
	.hamburger__line--1 {
		top: 12px;
	}
	.hamburger__line--2 {
		top: 18px;
	}
	.hamburger__line--3 {
		top: 24px;
	}
	.black-bg {
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		z-index: 100;
		background-color: #000;
		opacity: 0;
		visibility: hidden;
		transition: all .6s;
		cursor: pointer;
	}
	/* 表示された時用のCSS */
	.nav-open .global-nav {
		right: 0;
	}
	.nav-open .black-bg {
		opacity: .8;
		visibility: visible;
	}
	.nav-open .hamburger__line--1 {
		transform: rotate(45deg);
		top: 20px;
	}
	.nav-open .hamburger__line--2 {
		width: 0;
		left: 50%;
	}
	.nav-open .hamburger__line--3 {
		transform: rotate(-45deg);
		top: 20px;
	}

}/* スマートフォン　グローバルナビ */

/*---------------------------------------------------------------------------------------------*/

.mainvisual{
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

@media screen and ( max-width: 1300px ){
	.mainvisual{
		width: 100vw;
	}
}

video{
	position: relative;
	top: 50%;
	left: 50%;
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	transform: translate(-50%,-50%);
}

header.header{
	width: 100%;
	margin: 0 auto;
	position: fixed;
	top: 0;
	z-index: 6;
	transition: all 0.5s ease;
	background: rgba(0, 0, 0, 0.3);
}

header.hidden {
	background: none;
	transition: all 0.5s ease;
}

header.header #nav{
	display: flex;
	margin: 0 auto;
	max-width: 160rem;
	justify-content: space-between;
}

header.header #nav .logo{
	padding-left: 2rem;
	display: flex;
	align-items: center;
}

header.header .menu_area{
	display: flex;
}

header.header #nav .menu{
	display: flex;
	max-width: 100rem;
	flex-wrap: wrap;
}

header.header #nav .menu > li{
	margin: 0 2.5rem;
}

header.header #nav .menu li a{
	color: #fff;
}

header.header #nav .sns{
	display: flex;
}

header.header #nav .sns li{
	margin: 0 2rem;
}

header.header #nav .sns li:nth-child(1){
	margin: 0 1.3rem 0 2.5rem;
}

header.header #nav .sns li:nth-child(2){
	margin: 0 2.5rem 0 1.3rem;
}

header.header #nav .sns img{
	max-width: 3rem;
}

/*--------*/

.service_menu_area {
	position: fixed;
	background: rgba(0,0,0,.75);
	display: flex;

	/*left: 30vw;*/
	max-width: 100rem;
	width: 100%;
	color: #fff;
	font-size: 1.4rem;
	padding: 3rem 5rem;
	top: 5.2rem;
	right: 0;
}

.service_menu_area a{
	color: #fff;
	font-size: 1.4rem;
}

.service_menu_area ul{
	width: 20rem;
	margin-right: 4rem;
}

.service_menu_area ul:last-child{
	margin-right: 0rem;
}

.service_menu_area ul li.title{
	border-bottom: 0.1rem solid #fff;
	padding-bottom: 1rem;
	margin-bottom: 1rem;
}


header.header #nav .menu > li.s01 .service_menu_area{
	display: none;
	transition: opacity 1s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}

header.header #nav .menu > li.s01:hover .service_menu_area{
	height: auto;
	display: flex;
	transition: height 0.5s linear;
	width: 100%;
	
	animation: hideop 0.2s linear 0s;
	animation-fill-mode: forwards;
}

@keyframes hideop {
	0% {
		opacity: 0;
		top: 6rem;
	}

	100% {
		opacity: 1;
		top: 5.2rem;
	}
}

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

	.service_menu_area {
		/*max-width: 60%;*/
		max-width: 100rem;
	}

}

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

	.service_footer {
		width: 94%;
		padding-bottom: 4rem;
	}

	.service_menu_area {
		padding: 3rem 3rem;
		width: 100%;
		background: rgb(0 0 0 / 0.9);
	}

	header.header #nav .menu > li.s01:hover .service_menu_area {
		width: 100%;
		z-index: 500;
		/*left: 0;*/

	width: 30rem;
	right: 0;
	flex-wrap: wrap;
	margin-top: 4rem;
	overflow: auto;
	
		height: 80rem;
	
	}

	.service_menu_area ul {
		margin-bottom: 3rem;
	}

}


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

	.global-nav {
		width: 25rem;
	}

	.service_menu_area {
		background: rgb(0 0 0 / 0.9);
		padding: 3rem 2.5rem;
		max-width: 100%;
	}

	header.header #nav .menu > li.s01:hover .service_menu_area{
		/*margin-top: 14rem;*/
		margin-top: 3rem;
		justify-content: space-between;
		width: 25rem;
		/*height: 45rem;*/
		height: 54rem;
	}

	header.header #nav .menu > li.s01:hover .service_menu_area li{
		margin: 0rem;
	}
	
	.service_menu_area ul {
		width: 100%;
		margin-right: 0;
	}
	
	.service_menu_area ul li{
		width: 100%;
		margin: 0;
	}

	.service_footer ul{
		font-size: 1.2rem
	}

	.service_footer ul.bottom_area{
		margin-top: 0;
	}

	.service_footer ul li{
		margin-bottom: 1rem;
	}

	.service_footer ul li.title{
		color: #999;
		margin-left: 2.0rem;
	}

}

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

	.service_footer a{
		font-size: 1.2rem;
	}

}


/*----------------------*/

.catch_area{
	max-width: 130rem;
	margin: 0 auto;
	position: relative;
	z-index: 5;
}

.catch{
	position: absolute;
	/*top: 13vw;*/
	top: 21vh;
	z-index: 7;
}

@media screen and ( max-width: 1300px ){
	.catch{
		margin: 0 10rem;
	}
}

@media screen and ( max-width: 1180px ){
	header.header #nav .menu li{
		margin: 0 1rem;
	}
}

.catch h2{
	/*font-size: 6rem;*/
	/*line-height: 9rem;*/
	font-weight: bold;
	color: #fff;
	position: relative;
	/*padding-bottom: 4rem;*/
	/*margin-bottom: 6.5rem;*/
	
	font-size: 7.5vh;
	line-height: 11vh;
	padding-bottom: 5vh;
	margin-bottom: 6.5vh;
}

.catch h2:before {
	content: "";
	display: block;
	border-bottom: 3px solid #fff;
	width: 25rem;
	position: absolute;
	bottom: 0;
	left: 0;
}

.catch p{
	/*font-size: 2.5rem;*/
	font-weight: bold;
	color: #fff;
	
	font-size: 3.2vh;
}

/*----------------------*/

.h3_title h3{
	font-size 100rem;
}

.h3_title p{
	margin-top: 3rem;
	font-size: 5.5rem;
	font-feature-settings: "palt";
	line-height: normal;
}

.h3_title.sub p{
	margin-top: 1rem;
	font-size: 3rem;
	font-feature-settings: "palt";
	line-height: normal;
}

.h3_title.top_page{
	margin: 8rem auto 0rem;
}

.about_list{
	width: 100%;
	display: flex;
	margin-bottom: 16rem;
	position: relative;
}

.about_list li{
	text-align: center;
}

.about_list li .box{
	position: relative;
	padding: 7rem;
	text-align: left;
	max-width: 70rem;
}

.about_list li .box h4{
	font-size: 2.5vw;
	font-weight: bold;
	margin-bottom: 5.5rem;
}

.about_list li .box h4 strong{
	font-size: 5.5rem;
}

.about_list li .box p{
	font-size: 1.7rem;
	font-weight: bold;
}

.about_list li:first-child{
	width: 50%;
	background: #313131;
	padding: 10rem 7rem;
	display: flex;
	justify-content: flex-end;
}

.about_list li:first-child .box{
	background: #222;
	color: #fff;
}

.about_list li:first-child .box::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	border: 2px solid #fff;
	top: -1.5rem;
	left: -1.5rem;
}

.about_list li:first-child .box .eng {
	position: absolute;
	top: -2rem;
	left: 5rem;
	border-top: 1.7rem solid #313131;
	font-size: 4rem;
	font-family: 'Impact', 'Anton', sans-serif;
	line-height: 0;
	padding: 0 2rem;
}

.about_list li:last-child{
	width: 50%;
	background: #d7d7d7;
	padding: 10rem 7rem;
}

.about_list li:last-child .box{
	background: #fff;
}

.about_list li:last-child .box .eng {
	position: absolute;
	top: -2rem;
	left: 5rem;
	border-top: 1.7rem solid #d7d7d7;
	font-size: 4rem;
	font-family: 'Impact', 'Anton', sans-serif;
	line-height: 0;
	padding: 0 2rem;
}

.about_list li:last-child .box::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	border: 2px solid #222222;
	top: -1.5rem;
	left: -1.5rem;
}

.about_list li.cross{
	position: absolute;
	/*top: 38%;*/
	right: 0px;
	bottom: 0px;
	left: 0px;
	margin: auto auto;
	
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

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

	.about_list li:first-child {
		padding: 10rem 6rem 10rem 4rem;
	}

	.about_list li:last-child {
		padding: 10rem 3rem 10rem 7rem;
	}
	
	.about_list li .box h4 {
		font-size: 3rem;
	}

}

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

	.catch h2{
		font-size: 6vh;
		line-height: 9vh;
		padding-bottom: 4vh;
		margin-bottom: 5vh;
	}

	.catch p {
		font-size: 2.3vh;
	}

}

@media screen and ( max-width:700px ){
	.h3_title.top_page {
		margin: 0rem auto 0rem;
	}
}

/*----------------------*/

.top_service_area{
	background: url(../img/top/service_bg.jpg) no-repeat;
	color: #fff;
	background-size: cover;
	background-position: center;
}


@media screen and ( max-width:700px ){
	.top_service_area{
		background: url(../img/top/service_bg_smp.jpg) no-repeat;
		background-size: cover;
	}
}

.top_service_area .h3_title_p{
	text-align: center;
}

.top_service{
	display: flex;
	max-width: 130rem;
	margin: 14rem auto 0;
	justify-content: space-between;
}

.top_service li{
	max-width: 26rem;
}

.top_service li h4{
	font-size: 3rem;
	font-weight: bold;
}

.top_service li h5{
	font-size: 2.2rem;
	font-weight: bold;
}

.top_service a{
	position: relative;
	display: inline-block;
	padding: 2rem;
	border: 0px solid #fff;
	color: #fff;
	text-align: center;
	text-decoration: none;
	outline: none;
	transition: all .2s;
}

.top_service a::before,
.top_service a::after{
	position: absolute;
	z-index: 2;
	content: '';
	width: 0;
	height: 0;
	border: 2px solid transparent;
}
.top_service a::before {
	top: 0px;
	left: 0px;
}
.top_service a::after {
	bottom: 0px;
	right: 0px;
}
.top_service a:hover {
	color: #fff;
}
.top_service a:hover::before,
.top_service a:hover::after {
	width: 100%;
	height: 100%;
}
.top_service a:hover::before {
	border-bottom-color: #fff;
	border-left-color: #fff;
	transition: height .1s, width .1s .1s;
}
.top_service a:hover::after {
	border-top-color: #fff;
	border-right-color: #fff;
	transition: height .1s .2s, width .2s .3s;
}

/*----------------------*/

.top_works_area_bg{
	background: #e8e8e8;
	padding: 16rem 0;
	margin-bottom: 8rem;
}

.top_works_area{
	background: url("../img/top/works_bg.jpg") , linear-gradient(90deg,#313131 0%,#313131 60%,#e8e8e8 60%,#e8e8e8 100%);
	background-repeat: no-repeat , no-repeat;
	background-position: right center , left center;
	margin-bottom: 12rem;
}

@media screen and ( max-width: 1700px ){ .top_works_area{ background-position: 35vw center , left center; } }
@media screen and ( max-width: 1420px ){ .top_works_area{ background-position: 45vw center , left center; } }
@media screen and ( max-width: 1120px ){ .top_works_area{ background-position: 55vw center , left center; } }

.top_works_area .h3_title{
	margin: 0 0 4rem;
}

.top_works_area .h3_title h3{
	text-align: left;
	color: #fff;
}

.top_works_area .h3_title p{
	text-align: left;
	color: #fff;
}

.top_works_area .h3_title_p{
	text-align: left;
	color: #fff;
	margin-bottom: 8rem;
}

.top_works_list{
	max-width: 130rem;
	display: flex;
	justify-content: left;
	margin: 0 auto;
	flex-wrap: wrap;
}

.top_works_list li{
	margin-bottom: 5rem;
	margin-right: 5rem;
	max-width: 40rem;
}

.top_works_list li:nth-child(3n){
	margin-right: 0rem;
}

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

	.top_works_list {
		justify-content: space-around;
	}
	
	.top_works_list li {
		margin: 0 2rem 5rem;
	}

	.top_works_list li img{
		width: 100%;
	}

}

.top_works_list h4{
	max-width: 130rem;
	display: flex;
	justify-content: space-between;
	margin: 1.5rem 2rem 0.5rem;
	flex-wrap: wrap;
	font-size: 1.8rem;
}

.top_works_list h4 a{
	color: #222;
}

.top_works_list p{
	margin: 0 2rem;
	font-size: 1.4rem;
}

.bt{
	max-width: 30rem;
	height: 6rem;
	margin: 0 auto;
}

.bt.top_space{
	margin: 8rem auto 0;
}

.bt.left{
	max-width: 18rem;
	height: 6rem;
	margin: 0;
}

.bt.pink{
	max-width: 45rem;
	height: 9rem;
	margin: 0;
}

.bt.pink.partnership{

}

.bt .button {
	position: relative;
	display: flex;
	padding: .5em 3em;
	border: 3px solid #060606;
	color: #060606;
	text-align: center;
	text-decoration: none;
	transition: .3s;
	width: 100%;
	height: 100%;
	z-index: 5;
	align-items: center;
	justify-content: center;
	font-weight: bold;
}

.bt.pink .button {
	background: #e53a6e;
	color: #fff;
	font-size: 2.3rem;
	border: 0;
	padding: .5em 1.5em;
	width: 45rem;
}

.bt.pink.partnership{

}

.bt.pink.partnership .button {
	font-size: 2rem;
}

div.bt.pink img {
	margin-right: 1rem;
}

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

	.bt.pink.partnership .button {
		font-size: 1.4rem;
	}

}

.bt .button:hover {
	color: #fff;
}

.bt .button::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	background: #060606;
	transform-origin: right top;
	transform: scale(0, 1);
	transition: transform .3s;
}

.bt .button:hover::before {
	transform-origin: left top;
	transform: scale(1, 1);
}

.category_list{
	display: flex;
	max-width: 127rem;
	background: #fff;
}

.category_list .title{
	width: 25rem;
	height: 25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #6b6b6b;
	color: #fff;
}

.category_list .title h4{
	font-size: 3rem;
	line-height: 4.5rem;
}

.category_list .title h4 span{
	font-size: 1.6rem;
}

.category_list .list{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 102rem;
	padding: 0 2rem;
}

.category_list .list ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.category_list .list ul li{
	width : 30% ;
}

.category_list .list form{
	display: flex;
	align-items: center;
	justify-content: center;
}

.category_list .list form ul li{
	display: flex;
	align-items: center;
	justify-content: space-between;
	
	flex-wrap: wrap;
}

.category_list .list form ul li p{
	width: 100%;
	margin-bottom: 0;
	font-size: 1.4rem;
}

.category_list .list form ul li label {
	position: relative;
	display: inline-block;
	border: 2px solid #292929;
	width: 90%;
	margin: 0 0 10px 0;
}

.category_list .list form ul li label:before {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	display: block;
	width: 0;
	height: 0;
	margin: -2px 0 0 0;
	border: 5px solid transparent;
	border-top: 7px solid #292929;
}

.category_list .list form ul li select {
	font-size: 1.6rem;
	padding: 13px 16px;
	width: 100%;
	border: none;
	cursor: pointer;
	position: relative;
	-webkit-appearance: none;
	appearance: none;
	display: block;
	background: transparent;
}

.category_list .list form ul li select::-ms-expand{
	display: none;
}

.category_list .search_bt_wrap{
	background: #222;
	border: none;
	width: 17rem;
	height: 8.7rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2rem;
	font-weight: bold;
	color: #fff;
	
	position: relative;
	margin-bottom: 2rem;
	transition: 0.5s;
}

.category_list .search_bt_wrap:hover{
	background: #aaa;
}

.category_list .search_bt{
	border: none;
	outline: 0;
	cursor: pointer;
	color: #fff;
	background: rgba(34, 34, 34, 0);
	font-weight: bold;
	width: 100%;
	height: 100%;
	transition: 0.5s;
	z-index: 1;
}

.category_list .search_bt:hover {
	background: rgba(34, 34, 34, 0);
}

.category_list .reset_bt:hover {
	border: 0.3rem solid #aaa;
	color: #aaa;
}

.category_list .search_bt_wrap:before {
	position: absolute;
	content: "search";
	font-family: "Material Icons";
	top: auto;
	left: 4.8rem;
	z-index: 2;
	font-size: 2.4rem;
	font-weight: normal;
	z-index: 0;
}

.category_list .reset_bt{
	width: 17rem;
	height: 5rem;
	color: #222;
	font-size: 1.7rem;
	border: 0.3rem solid #222;
	background: #fff;
	font-weight: bold;
	transition: 0.5s;
}

/*----------------------*/

.column_area{
	max-width: 130rem;
	margin: 0 auto;
}

.column_area h4{
	font-size: 4rem;
	font-weight: bold;
	margin-bottom: 3.5rem;
}

.column_area h4 small{
	font-size: 1.4rem;
	margin-left: 4rem;
}

.column_list{
	display: flex;
	/*flex-wrap: wrap;*/
	margin-bottom: 6rem;
}

.column_list .data{
	display: flex;
	margin-bottom: 1rem;
}


.column_list .text p{
	margin-bottom: 0;
	font-size: 1.4rem;
	color: #9a9a9a;
	
}

.column_list .text h5 a{
	color: #303030;
	font-size: 1.6rem;
}

.column_list_left{
	margin-right: 3rem;
}

.column_list_left div.image{
	margin-bottom: 1.5rem;
}

.column_list_left div.image img{
	max-width: 60rem;
}

.column_list_right li{
	display: flex;
	align-items: center;
	margin-bottom: 2.6rem;
}

.column_area li a.category{
	background: #3a3a3a;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	margin: 0 2rem 0 0;
	width: 10rem;
}

.column_area li {
}

.column_list_right{
	width: 58%;
}

.column_list_right li .image{
	margin-right: 2.2rem;
}

.column_list_right li img{
	max-width: 17rem;
}

div.image{
	overflow: hidden;
}

.column_list .text h5{
	max-width: 50rem;
}


div.image a img:hover{
	transform: scale(1.1);
	transition-duration: 0.5s;
}

/*----------------------*/

.news_area{
	max-width: 130rem;
	margin: 0 auto;
}

.news_area h4{
	font-size: 4rem;
	font-weight: bold;
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 0.2rem solid #222222;
}

.news_area h4 small{
	font-size: 1.4rem;
	margin-left: 4rem;
}

/*----------------------*/

.recruit_banner{
	max-width: 130rem;
	background: url(../img/top/recruit_bg.jpg) no-repeat;
	margin: 0 auto;
	height: 38rem;
	transition: all .2s;
}

.recruit_banner:hover{
	background: url(../img/top/recruit_bg.jpg) no-repeat;
	transform: scale(0.98, 0.98);
	opacity: 0.8;
}

.recruit_banner a:hover{
	text-decoration: none;
}

.recruit_banner h4{
	font-size: 5rem;
	font-weight: bold;
}

.recruit_banner strong{
	font-size: 3rem;
	font-weight: bold;
}

.recruit_banner small{
	font-size: 1.6rem;
}

.recruit_banner a{
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	padding: 0 7rem;
	color: #fff;
}

/*----------------------*/

.top_access{
	border-top: 0.2rem solid #222222;
	border-bottom: 0.2rem solid #222222;
	max-width: 130rem;
	margin: 0 auto;
	padding: 6rem 0;
	/*height: 38rem;*/
	display: flex;
	align-items: center;
	justify-content: space-around;
}

.top_access h4{
	font-size: 5rem;
	font-weight: bold;
	margin-bottom: 2.5rem;
}

.top_access ul{
	margin-bottom: 4rem;
}

/*----------------------*/

.bottom_contact_area{
	background: #e8e8e8;
	height: 32rem;
	margin-bottom: 16rem;
	margin-top: 24rem;
}

.bottom_contact_area.recruit{
	margin-top: 16rem;
}

.bottom_contact_area.partnership{
	margin-top: 16rem;
}

.bottom_contact_area .contact_list{
	display: flex;
	align-items: center;
	justify-content: space-around;
	background: #313131;
	max-width: 130rem;
	margin: -14rem auto 0;
	padding: 8rem 0;
}

.bottom_contact_area .contact_list .text_area{
	color: #fff;
}

.bottom_contact_area .contact_list .text_area h4{
	font-size: 5rem;
	font-weight: bold;
	margin-bottom: 2.5rem;
}

.tel_area .tel{
	display: flex;
	align-items: center;
	justify-content: space-around;
	color: #fff;
}

.tel_area .tel img{
	margin-right: 2rem;
	margin-top: -0.5rem;
}

.tel_area .tel a{
	font-size: 4rem;
	font-weight: bold;
}

/*-----*/

.bottom_contact_area.partnership{
	background: #E5F8F9;
}

.bottom_contact_area.partnership .contact_list {
	background: #fff;
	border: 0.1rem solid #313131;
}

.bottom_contact_area.partnership .contact_list .text_area {
    color: #313131;
	max-width: 35%;
}

.bottom_contact_area.partnership .contact_list .tel_area ul.icon{
	display: flex;
	justify-content: space-between;
	margin-bottom: 2.5rem;
}

.bottom_contact_area.partnership .contact_list .tel_area ul.icon li{
	max-width: 5rem;
}

.bottom_contact_area.partnership .contact_list .tel_area ul.icon li img{
	width: 100%;	
}

.bottom_contact_area.partnership .contact_list .tel_area .bt.pink .button{
	background: #52d2d8;
}

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

	.bottom_contact_area.partnership .contact_list .text_area {
		max-width: 76%;
		margin-bottom: 1rem;
	}

}

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

	.bottom_contact_area .contact_list .text_area {
		width: 100%;
	}

	.bottom_contact_area .contact_list .text_area h4 {
		text-align: center;
	}

	.bottom_contact_area .contact_list .text_area p {
		text-align: center;
	}

}

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

	.bottom_contact_area.partnership .contact_list .tel_area ul.icon li{
		max-width: 3rem;
	}

	.bottom_contact_area.partnership .contact_list .text_area {
		max-width: 92%;
		margin-bottom: 1rem;
	}

}


/*----------------------*/

@media screen and ( max-width: 1024px ){
	
	.about_list li .box {
		padding: 5rem 4rem 5rem 3rem;
	}
	
	.top_works_list {
		margin: 0 4rem;
	}
	
	.top_works_list li {
		width: 31%;
	}
	
	div.image img {
		width: 100%;
	}
	
	section{
		width: 94%;
		margin: 0 auto;
	}
	
	.column_list_left {
		width: 40rem;
	}
	
	.top_works_area {
		background-position: 65vw center , left center;
	}
	
	.category_list .title {
		height: auto;
		padding: 0 3rem;
	}
	
	.category_list .list ul {
		padding: 3rem 0;
	}
	
	.category_list .list ul li {
		width: 42%;
	}

	.h3_title h3 {
		font-size: 8rem;
	}
	
	.h3_title p {
		font-size: 4.5rem;
	}
	
	.tel_area .tel a{
		font-size: 3.5rem;
	}

	.column_list_right {
		width: 55%;
	}

}

/*----------------------*/

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


	.h3_title h3 {
		font-size: 7rem;
	}
	.h3_title.sub p {
		margin-top: 0rem;
		font-size: 2.5rem;
	}
	.about_list {
		flex-wrap: wrap;
	}
	
	.catch {
		margin: 0 5rem;
		top: 26vw;
	}
	
	.top_works_list {
		margin: 0 4rem;
	}
	
	.about_list li:first-child {
		width: 100%;
		padding: 10rem 5rem 10rem 6rem;
	}
	
	.about_list li:last-child {
		width: 100%;
		padding: 10rem 5rem 10rem 6rem;
	}

	.about_list li.cross {
		transform: rotateZ(90deg);
		z-index: 5;
		
		top: -3rem;
		left: 0;
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.top_service {
		flex-wrap: wrap;
		justify-content: space-around;
	}
	
	.top_service a{
		border: 1px solid rgba(255, 255, 255, 0.3);
	}
	
	.top_service li {
		max-width: 30rem;
		margin: 1rem 0;
	}

	.top_service_area {
		background-position: right;
	}

	.category_list {
		flex-wrap: wrap;
	}
	
	.category_list .title {
		padding: 2rem 3rem;
		width: 100%;
		text-align: center;
	}

	.top_works_list li {
		width: 46%;
		margin-right: 0rem;
	}

	.top_works_area {
		background: url(../img/top/works_bg.jpg) , linear-gradient(90deg,#313131 0%,#313131 80%,#e8e8e8 80%,#e8e8e8 100%);
		background-position: -150% center , left center;
		background-repeat: no-repeat;
	}
	
	.top_access {
		flex-wrap: wrap;
	}

	.top_access .data_area{
		margin-bottom: 5rem;
		width: 54rem;
	}
	
	.bottom_contact_area {
		height: 40rem;
	}
	
	.bottom_contact_area .bt.pink .button{
		width: 45rem;
	}
	
	.bottom_contact_area .contact_list {
		padding: 6rem 0;
		flex-wrap: wrap;
	}

	.bottom_contact_area.recruit .tel_area .tel a{
		font-size: 3.3rem;
	}

	.news_list li {
		width: 100%;
	}

	.column_list_left {
		width: 30rem;
	}
	
	.column_list_right {
		width: 39rem;
	}
	
	.column_list_right li .text{
		width: 23rem;
	}
	header.header {
		height: 5.5rem;
	}
	
	header.header #nav .logo {
		height: 5rem;
	}
	
	.top_works_list {
		justify-content: space-between;
	}
	
	header.header #nav .menu {
		margin-top: 5rem;
	}
	header.header #nav .menu li {
		margin: 0 1rem;
		height: 5rem;
		align-items: center;
		display: flex;
	}
	header.header #nav .menu {
		margin-bottom: 5rem;
	}

	.footer_banner li {
		padding: 0 2rem;
		border-right: 0;
	}

	.footer_banner li.title {
		/*border-right: 0;*/
		width: auto;
	}

	header.header .menu_area {
		flex-wrap: wrap;
		height: 22rem;
		background-position: center;
		background-size: cover;
	}
	
	.category_list .title h4 .pc{
		display: none;
	}

	.top_works_area .category_list {
		max-width: 90rem;
		margin-top: 30rem;
	}
	.category_list .list ul li {
		width: 48%;
	}

	.top_works_area {
		background-position: -150% 47rem , left top;
		background-size: 100%;
	}
	.recruit_banner {
		height: 30rem;
		background-position: -16rem;
	}

	.about_list li.cross img {
		transform: rotateZ(90deg);
	}


}

/*----------------------*/

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

    .footer ul li:first-child {
	    font-size: 1.2rem;
        margin-bottom: 0;
		/*color: #999;*/
    }

	header.header .menu li.title {
		color: #999;
	}

}

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

	header.header .menu li.title {
		color: #999;
	}

}

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

	.content section {
		padding: 6rem 0;
	}

	section {
		width: 87%;
	}

	header.header #nav .logo {
		width: 75%;
	}
	header.header #nav .logo img{
		width: 75%;
	}

	.top_service {
		margin: 4rem auto 0;
	}

	.top_service li {
		max-width: 24rem;
		position: relative;
	}
	
	.top_service li::after {
		transition: none;
		border: 0;
	
		border-right: 2em solid #fff;
		content: "";
		top: 0;
		right: 0;
		border-bottom: 2em solid transparent;
		position: absolute;
		z-index: 2;
	}
	
	.top_service li h4{
		font-size: 2rem;
	}
	
	.top_service li h5 {
		font-size: 1.8rem;
	}
	
	.top_service li p {
		font-size: 1.3rem;
	}
	
	.top_service li img{
		width: 40%;
	}
	
	.top_service li a{
		position: relative;
		transition: all 50s;
		transition-delay: 50s;
		transition-duration: 50s;
	}

	.top_service li a::after {
		transition: none;
		border: 0;
	
		border-right: 0em solid #fff;
		content: "";
		bottom: 0;
		right: 0;
		border-top: 0em solid transparent;
		position: absolute;
		z-index: 2;

	}

	.top_service li a::before {
		border-right: 0;
		content: "";
		bottom: 0;
		right: 0;
		border-top: 0;
		position: absolute;
		z-index: 2;
		transition: none;
		border: 0;
	}

	.top_service a:hover::before {
		border-bottom-color: #fff;
		border-left-color: #fff;
		transition: height 500s 500s, width 500s 500s;
	}
	
	.top_service a:hover::after {
		border-right: 0em solid #fff;
		content: "";
		bottom: 0;
		right: 0;
		border-top: 0em solid transparent;
		position: absolute;
		z-index: 2;

		border-top-color: #fff;
		border-right-color: #fff;
		transition: height 500s 500s, width 500s 500s;
	}



	.top_service_area .h3_title_p {
		font-size: 1.3rem;
		text-align: left;
	}
	
	.about_list {
		margin-bottom: 8rem;
		overflow: hidden;
	}
	
	.about_list li.cross img {
		transform: rotateZ(90deg);
		z-index: 5;
		top: -2%;
		left: -560%;
	}
	
	.top_works_area_bg {
		padding: 6rem 0;
		margin-bottom: 0rem;
	}
	.top_works_list {
		margin: 0 2.5rem;
	}

	.top_works_list h4 {
		margin: 1.5rem 1rem 0.5rem;
	}

	.top_works_list p {
		margin: 0 1rem;
		font-size: 1.2rem;
	}
	
	.top_access .map_area img{
		width: 100%;
	}

	div.bt.pink {
		max-width: 100%;
		height: 5.5rem;
	}

	div.bt.pink img{
		max-width: 2rem;
		margin-right: 1rem;
	}
	.tel_area .tel a {
		font-size: 2.5rem;
		line-height: normal;
	}
	.tel_area .tel img {
		margin-right: 1rem;
	}
	.tel_area .tel {
		margin-top: 1rem;
		margin-bottom: 2rem;
		flex-wrap: wrap;
	}
	
	.tel_area .tel small{
		width: 100%;
		text-align: center;
	}
	
	div.bt.pink .button {
		font-size: 1.4rem;
		width: 90%;
		line-height: normal;
		margin: 0 auto;
		padding: .5em 1em;
	}

	.bottom_contact_area .bt.pink .button {
		width: 27rem;
	}
	
	div.bt.pink .button .sp{
		display: none;
	}

	.h3_title h3 {
		font-size: 3rem;
	}


	.category_list .list {
		padding: 1rem;
	}

	.category_list .list form {
		flex-wrap: wrap;
		padding: 0 0 1rem;
	}

	.category_list .list ul {
		padding: 1.5rem 0 0;
	}

	.category_list .list form ul li select {
		font-size: 1.3rem;
		padding: 10px 10px;
		color: #222;
	}

	.category_list .search_bt_wrap {
		width: 30rem;
		height: 7rem;
		font-size: 1.6rem;
		margin: 0 auto 1.5rem;
	}
	
	.category_list .search_bt_wrap:before {
		left: 11rem;
	}

	.category_list .reset_bt {
		width: 30rem;
		font-size: 1.6rem;
	}

	.category_list .list ul li {
		width: 48%;
	}

	.category_list .list ul li form label {
		width: 95%;
		margin: 10px 0 5px 5px;
		height: 4rem;
		line-height: 1.8rem;
	}
	
	.category_list .list form ul li label {
		width: 100%;
	}

	.category_list .list ul li p{
		display: none;
	}

	.about_list li:first-child {
		padding: 6rem 1rem 6rem 3rem;
	}
	
	.about_list li:last-child {
		padding: 6rem 1rem 6rem 3rem;
	}
	
	.about_list li .box {
		padding: 4rem 4rem 2rem 2rem;
	}
	
	.about_list li:first-child .box::before {
		top: -1rem;
		left: -1rem;
	}
	
	.about_list li:last-child .box::before {
		top: -1rem;
		left: -1rem;
	}
	
	.about_list li.cross {
		top: 0%;
		left: 0%;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.about_list li.cross img{
		width: 16%;
	}
	
	.top_works_list li {
		width: 100%;
		margin: 0 0 5rem;
	}
	
	.column_area h4 {
		font-size: 2rem;
		display: flex;
		flex-wrap: wrap;
		line-height: normal;
	}
	
	.column_area h4 small{
		margin-left: 2rem;
		margin-left: 0;
		width: 100%;
	}

	.column_list {
		margin-bottom: 0rem;
		flex-wrap: wrap;

	}

	.column_list_left {
		width: 100%;
		margin-right: 0;
		margin-bottom: 2.6rem;
	}

	.column_list_right {
		width: 100%;
	}
	
	.column_list_right li {
		width: 100%;
		flex-wrap: wrap;
	}

	.column_list_right li .image {
		margin-right: 0rem;
		margin-bottom: 1.5rem;
		width: 100%;
	}

	.column_list_right li img {
		max-width: 100%;
	}

	.column_list_right li .text {
		width: 100%;
	}

	.column_list_right li .text p{
		font-size: 1.2rem;
	}

	.news_list li {
		flex-wrap: wrap;
		padding: 2rem 0;
	}
	
	.news_list .text {
		flex-wrap: wrap;
	}
	
	.news_list .text p{
		font-size: 1.2rem;
	}
	
	.news_list .text div{
		margin-top: 1rem;
	}
	
	.news_list .text .data_line {
		flex-flow: row-reverse;
		justify-content: flex-end;
	}

	.news_area h4 {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		font-size: 2rem;
		line-height: normal;
	}
	
	.news_list .text a.category {
		margin: 0 2rem 0 0;
		width: 8rem;
	}

	.news_area h4 small{
		margin-left: 0rem;
		width: 100%;
	}
	
	.recruit_banner{
		position: relative;
		height: 18rem;
		background-position: center !important;
		background-size: cover !important;
	}
	.recruit_banner::before{
		content: '';
		position: absolute;
		background-color: rgba(0,0,0,0.4);
		z-index: 1;
		width: 100%;
		height: 100%;
	}
	
	.recruit_banner a {
		padding: 0 3rem;
	}
	
	.recruit_banner a div{
		z-index: 2;
	}

	.recruit_banner h4 {
		font-size: 3rem;
	}

	.recruit_banner strong {
		font-size: 1.7rem;
	}
	.recruit_banner small {
		font-size: 1.2rem;
	}

	.bottom_contact_area {
		height: 26rem;
		margin-bottom: 8rem;
	}

	.bottom_contact_area .contact_list .text_area h4 {
		font-size: 3rem;
		text-align: center;
	}

	.bottom_contact_area .contact_list .text_area p {
		text-align: center;
		margin-top: 1rem;
	}
	
	.bottom_contact_area .contact_list {
		padding: 3rem 0;
	}
	.bottom_contact_area .contact_list .text_area{
		font-size: 1.2rem;
	}
	.footer .footer_area ul.footer_link {
		width: 90%;
	}
	
	.footer .footer_area ul.footer_link li {
		/*width: calc(100% / 2.3);*/
	}

	.footer ul li:first-child {
		margin-bottom: 0;
	}
	
	.h3_title p {
		font-size: 2rem;
	}

	.h3_title.sub p {
		font-size: 1.2rem;
	}
	
	.about_list li .box h4 strong {
		font-size: 3rem;
	}
	
	.about_list li .box h4 {
		font-size: 2rem;
		margin-bottom: 2rem;
	}

	.about_list li .box p {
		font-size: 1.3rem;
	}
	
	.top_works_area .h3_title_p {
		margin-bottom: 6rem;
		font-size: 1.3rem;
	}

	.top_works_area {
		background: url(../img/top/works_bg.jpg) , linear-gradient(90deg,#313131 0%,#313131 100%,#e8e8e8 100%,#e8e8e8 100%);
		background-position: -30% 35rem , left center;
		background-repeat: no-repeat;
		margin-bottom: 6rem;
		background-size: 100% , auto;
	}

	.top_works_area .category_list {
		margin-top: 17rem;
	}

	.category_list {
		width: 100%;
		margin: 17rem auto 0;
	}

	.category_list .title{
		padding: 1.5rem 3rem;
	}
	
	.category_list .title h4 {
		line-height: 2.5rem;
		font-size: 2rem;
		margin-bottom: 0;
	}
	
	.category_list .list ul li form select {
		font-size: 1.2rem;
		padding: 10px 14px;
	}
	
	
	.about_list li:first-child .box .eng {
		left: 0rem;
		font-size: 2rem;
	}
	
	.about_list li:last-child .box .eng {
		left: 0rem;
		font-size: 2rem;
	}

	.top_access h4 {
		font-size: 3rem;
	}

	.top_access p {
		font-size: 1.4rem;
	}

	.top_access ul {
		font-size: 1.4rem;
	}
	
	.catch {
		margin: 0 3rem;
		top:35vw;
	}
	
	.catch h2 {
		font-size: 8vw;
		line-height: 15vw;
		margin-bottom: 3rem;
		padding-bottom: 3rem;
	}
	.catch p {
		font-size: 1.8rem;
	}
	
	header.header #nav {
		height: 6.3rem;
	}
	
	.bottom_contact_area {
		/*margin-top: 12rem;*/
		margin-top: 16rem;/*20210609調整*/
	}

	.bt.left{
		max-width: 30rem;
		height: 6rem;
		margin: 0 auto;
	}

	.bt .button {
		font-size: small;
	}
}

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

	.about_list li.cross {
		top: 0%;
		left: -405%;
	}

	.category_list .search_bt_wrap {
		width: 25rem;
	}
	.category_list .reset_bt {
		width: 25rem;
	}
	.category_list .search_bt_wrap:before {
		left: 9rem;
	}
}

/*----------------------*/
/*ブロック型　スクロールアニメーション*/

.motion-txt {
  display: inline-block;
  position: relative;
  overflow: hidden;
  padding: 0;
}
.motion-txt:after {
  content: '';
  position: absolute;
  opacity: 1;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  background-color: #000;
  transform: translate3d(-101%, 0, 0);
}

.motion-txt.w:after {
  background-color: #fff;
}

.js-scroll.show .motion-txt:after {
  transition-property: transform, opacity;
  transition-duration: 0.3s;
  transition-delay: 0s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  transform: translate3d(0, 0, 0);
}
.js-scroll.done .motion-txt:after {
  transition-property: transform;
  transition-duration: 0.3s;
  transition-delay: 0s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  transform: translate3d(103%, 0, 0);
}

.js-scroll.show .motion-txt.slow:after {
  transition-duration: 0.4s;
  transition-delay: 0.1s;
}
.js-scroll.done .motion-txt.slow:after {
  transition-duration: 0.4s;
  transition-delay: 0.1s;
}

.motion-txt .motion-inner {
  display: inline-block;
  opacity: 0;
}
.js-scroll.done .motion-txt .motion-inner {
  opacity: 1;
}


/*----------------------*/
/*ABOUT*/

.lowpage_title{
	width: 100%;
	height: 50rem;
	background: #ccc;
	padding-top: 18rem;
	color: #fff;
	position: relative;
	overflow: hidden;
	z-index: -2;
	background-attachment: fixed;

}

.lowpage_title::before {
	content: "";
	top: 29.5rem;
	left: 0;
	position: absolute;
	z-index: 100;
	display: block;
	width: 35vw;
	height: 4rem;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	
	animation: show-border 1s both;
}
@media screen and ( max-width: 1180px ){

	.lowpage_title::before {
		top: 27.5rem;
	}

}


@keyframes show-border {
	0% {
		transform:translate(-40em,0);
		opacity:0;
		text-shadow:0 0 0 #fff;
	}
	50% {
		text-shadow:0 0 -50rem #fff;
	}
	100% {
		transform:translate(0,0);
		opacity:1;
		text-shadow:none;
	}
}


.lowpage_title::after {
	content: url(../img/title/obi.png);
	top: 23rem;
	left: 10rem;
	position: absolute;
	z-index: -1;
	display: block;
	max-width: 35vw;
	height: 4rem;

	animation: show-bg 1s both;
}
@keyframes show-bg {
	0% {
		transform:translate(40em,0);
		opacity:0;
		text-shadow:0 0 0 #fff;
	}
	50% {
		text-shadow:0 0 50rem #fff;
	}
	100% {
		transform:translate(0,0);
		opacity:1;
		text-shadow:none;
	}
}

/*-------*/

.lowpage_title.about{
	background: url(../img/title/about.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.works{
	background: url(../img/title/works.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.price{
	background: url(../img/title/price.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.company{
	background: url(../img/title/company.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.contact{
	background: url(../img/title/contact.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.policy{
	background: url(../img/title/policy.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.sitemap{
	background: url(../img/title/sitemap.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.recruit{
	background: url(../img/title/recruit.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.news{
	background: url(../img/title/news.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

.lowpage_title.partnership{
	background: url(../img/title/partnership.jpg) no-repeat ;
	background-position: top center;
	background-size: cover;
}

@media screen and ( max-width:700px ){
	.lowpage_title.price {
		background-size: cover;
		background-position: -10rem;
	}

	.lowpage_title.recruit {
		background-size: 310%;
	}
}


/*-------*/

.lowpage_title h2{
	font-size: 8rem;
	font-weight: bold;
	max-width: 130rem;
	margin: 0 auto 0;
	z-index: 1;
}

.lowpage_title p{
	font-size: 1.8rem;
	font-weight: bold;
	max-width: 130rem;
	margin: 0.3rem auto 0;
	z-index: 1;
}

.pankuzu{
	max-width: 160rem;
	margin: 0.5rem auto;
	display: flex;
	font-size: 1.3rem;
}

.pankuzu li{
	padding-right: 1rem;
}

.pankuzu li::after{
	content: "\025b6";
	color: #dcdcdc;
	margin-left: 1rem;
	font-size: 1rem;
}

.pankuzu li:last-child::after{
	content: none;
}

.pankuzu li a{
	color: #222;
}

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

	.pankuzu{
		margin: 0.5rem 2rem;
	}
}

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

	.lowpage_title h2 {
		margin: 0 4rem 0;
	}
	.lowpage_title p {
		padding: 0 4rem;
	}
}

@media screen and ( max-width: 1024px ){
	.lowpage_title {
		height: 40rem;
		padding-top: 15rem;
	}
	.lowpage_title::before {
		top: 26.5rem;
	}
	.lowpage_title::after {
		top: 20rem;
		left: 0rem;
	}
	.lowpage_title h2 {
		height: 7.8rem;
	}
	/* safariハック */
	_::-webkit-full-page-media, _:future, :root .lowpage_title p {
		padding-top: 3.5rem;
	}

	.lowpage_title p{
		margin: 0 auto 0;
	}

}

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

	_::-webkit-full-page-media, _:future, :root .lowpage_title p {
		padding-top: 2.2rem;
	}

}

@media screen and ( max-width: 768px ){
	.lowpage_title {
		height: 30rem;
		padding-top: 10rem;
	}
	.lowpage_title::before {
		top: 19rem;
		width: 45vw;
	}
	.lowpage_title::after {
		top: 13rem;
	}
	.lowpage_title h2 {
		line-height: 8rem;
		white-space: nowrap;
		font-size: 7rem;
	}
	.lowpage_title p {
		padding-top: 1.8rem;
		margin-top: -0.2rem;
	}

}

@media screen and ( max-width: 700px ){
	.lowpage_title::before {
		width: 70vw;
		top: 13.5rem;
	}
	.lowpage_title h2 {
		font-size: 3.5rem;
		/*line-height: 4rem;*/
		line-height: 3.8rem;/*2025-10-31*/
		height: auto;
	}
	.lowpage_title {
		height: 23rem;
		padding-top: 9rem;
	}
	.lowpage_title p {
		font-size: 1.4rem;
		margin-top:  0.5rem;
		padding-top: 0rem;
	}
	.lowpage_title::after {
		top: 8rem;
	}

	.pankuzu {
		font-size: 1.1rem;
	}
}

/*-------------*/

.about_list_area{
	margin-bottom: 12rem;
}

.about_list_area .list{
	min-height: 88rem;
}

.about_list_area .list.area01{
	background: url(../img/about/area01_bg.jpg) no-repeat ;
	background-position: 40vw 8rem;
	margin-bottom: 12rem;
}

.about_list_area .list.area02{
	background: url(../img/about/area02_bg.jpg) no-repeat ;
	background-position: left 8rem;
	margin-bottom: 8rem;
}

.about_list_area .list.area03{
	background: url(../img/about/area03_bg.jpg) no-repeat #eee;
	background-position: right 16rem;
	padding-top: 8rem;
	padding-bottom: 8rem;
	min-height: 100rem;
}

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

	.about_list_area .list.area03{
		background-position: center 16rem;
	}
}

.about_list_area .list .area{
	position: relative;
}

.about_list_area .list.area01 .area{
	width: 50%;
	background: #e8e8e8;
	display: flex;
	display:-ms-flexbox;
	
	justify-content: flex-end;
	-ms-flex-pack: end;
}

.about_list_area .list.area02 .area{
	width: 50%;
	background: #313131;
	display: flex;
	justify-content: flex-start;
	position: absolute;
	right: 0;
}

.about_list_area .list.area03 .area{
	width: 50%;
	background: #fff;
	display: flex;
	justify-content: flex-end;
}

.about_list_area .list .area .box{
	max-width: 80rem;
	display: flex;
	justify-content: space-between;
	padding: 8rem;
	flex: 1;
}

.about_list_area .list.area01 .area .box,
.about_list_area .list.area03 .area .box{
	padding: 8rem 8rem 8rem 0;
}

.about_list_area .list.area02 .area .box{
	padding: 8rem 0 8rem 8rem;
}

.about_list_area .list .area .box .title{
	/*max-width: 15rem;*/
	flex: 1;
	
	max-width: 9vw;
}

.about_list_area .list.area02 .area .box .title{
	display: flex;
	justify-content: flex-end;
}

.about_list_area .list .area .box .title img{
	align-self: flex-start;
}

.about_list_area .list .area .box .text{
	max-width: 58rem;
	flex: 2;
}

.about_list_area .list .area .box .text p{
	font-size: 1.7rem;
	line-height: 3.5rem;
}

.about_list_area .list.area02 .area .box .text{
	color: #fff;
}

.about_list_area .list .area .box .text h4{
	margin-bottom: 5rem;
	font-size: 4.5rem;
	font-weight: bold;
	font-feature-settings: "palt";
	line-height: 6.2rem;
}

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

	.about_list_area .list.area01 .area .box,
	.about_list_area .list.area03 .area .box{
		padding: 5rem 5rem 5rem 2rem;
	}

	.about_list_area .list.area02 .area .box{
		padding: 5rem 2rem 5rem 5rem;
	}
}


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

	.about_list_area .list .area .box .title {
		max-width: 8vw;
	}

	.about_list_area .list .area .box .text h4 {
		font-size: 3.3vw;
	}
	.about_list_area .list .area .box .text p {
		font-size: 1.6rem;
	}

}

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

	.about_list_area {
		margin-bottom: 8rem;
	}

	.about_list_area .list.area01 .area,
	.about_list_area .list.area02 .area,
	.about_list_area .list.area03 .area {
		width: 60%;
	}

	.about_list_area .list.area01 .area .box, .about_list_area .list.area03 .area .box {
		padding: 5rem 5rem 5rem 2rem;
	}
	.about_list_area .list.area02 .area .box {
		padding: 5rem 2rem 5rem 5rem;
	}
	.about_list_area .list .area .box .title {
		max-width: 10rem;
	}

	.about_list_area .list .area .box .text h4 {
		margin-bottom: 4rem;
		font-size: 4rem;
	}

	.about_list_area .list.area01 {
		background-position: 46rem 6rem;
		margin-bottom: 0rem;
		background-size: 81rem;
		min-height: 73rem;
	}
	.about_list_area .list.area02 {
		background-position: left 6rem;
		margin-bottom: 0rem;
		background-size: 64rem;
		min-height: 70rem;
	}
	.about_list_area .list.area03 {
		background-position: right top;
		background-size: 100%;
		min-height: 70rem;
		padding-top: 30rem;
		margin-top: 15rem;
	}

}

@media screen and ( max-width: 768px ){
	.about_list_area .list.area01 .area,
	.about_list_area .list.area02 .area,
	.about_list_area .list.area03 .area {
		width: 100%;
	}

	.about_list_area .list.area01 {
		background-position: right top;
		background-size: 100%;
		padding-top: 35rem;
	}

	.about_list_area .list.area02 {
		background-position: right top;
		background-size: 100%;
		min-height: 83rem;
		padding-top: 35rem;
	}

	.about_list_area .list.area03 {
		background-position: right top;
		background-size: 100%;
		min-height: 83rem;
		padding-top: 35rem;
	}

}

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

	.about_list_area .list.area01 {
		background-position: right top;
		background-size: 100%;
		padding-top: 22rem;
		margin-bottom: 6rem;
	}
	.about_list_area .list.area02 {
		background-position: right top;
		background-size: 100%;
		padding-top: 19rem;
		height: 74rem;
		min-height: 74rem;
		margin-bottom: 6rem;
		fon
	}
	.about_list_area .list.area03 {
		background-position: -7rem top;
		background-size: 127%;
		padding-top: 19rem;
		margin-top: 6rem;
		min-height: 70rem;
	}
	
	.about_list_area .list.area01 .area,
	.about_list_area .list.area02 .area,
	.about_list_area .list.area03 .area {
		width: 100%;
	}
	.about_list_area .list .area .box .text h4 {
		margin-bottom: 3rem;
		font-size: 2.2rem;
		line-height: 3rem;
	}

	.about_list_area .list.area01 .area .box, .about_list_area .list.area03 .area .box {
		padding: 4rem 4rem 4rem 2rem;
	}
	.about_list_area .list.area02 .area .box {
		padding: 4rem 2rem 4rem 4rem;
	}
	.about_list_area .list .area .box .title img{
		width: 25%;
	}
	.about_list_area .list .area .box .title {
		max-width: 5rem;
	}
	.about_list_area .list .area .box .text h4 {
		margin-bottom: 2rem;
		font-size: 2.2rem;
	}
	.about_list_area .list .area .box .text p{
		font-size: 1.4rem;
		line-height: 2.5rem;
	}

}


/*-------------*/

.service_list{
	max-width: 160rem;
	margin: 0 auto 16rem;
	display: flex;
	justify-content: space-between;
	overflow: hidden;
}

.service_list > li{
	max-width: 38rem;
	padding: 5rem;
	position: relative;
}

.service_list > li h4{
	font-size: 6rem;
	font-weight: bold;
	text-align: center;
	margin: 3rem 0;
}

.service_list > li h5{
	font-size: 3rem;
	font-weight: bold;
	text-align: center;
	margin: 0 0 3rem;
	line-height: normal;
}

.service_list > li p{
	font-weight: bold;
}

.service_list > li .popup{
	transition-duration: 0.5s;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	z-index: 1;
}

.service_list > li:hover .popup{
	background: rgba(0, 0, 0, 0.8);
	opacity: 1;
	/*transform: scale(1.1);*/
}

.service_list > li .popup .title{
	background: #e53a6e;
	font-size: 3rem;
	font-weight: bold;
	text-align: center;
	color: #fff;
	width: 100%;
	height: 10rem;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
}

.service_list > li .popup .list{
	padding: 5rem;
	font-size: 1.8rem;
	font-weight: bold;
	font-feature-settings: "palt";
	color: #fff;
}

.service_list > li .popup .list li{
	border-bottom: 1px dotted #fff;
	padding: 1.5rem 0;
	line-height: normal;
}

.service_list > li .popup .list a{
	color: #fff;
}

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

	.service_list {
		margin: 0 2rem 16rem;
	}
	.service_list > li {
		max-width: 100%;
		padding: 2vw;
		width: 25%;
	}

}

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

	.service_list > li {
		padding: 3rem;
	}
	.service_list > li h4 {
		font-size: 4rem;
	}
	.service_list > li h5 {
		font-size: 2.2rem;
	}

	.service_list > li .popup .title {
		font-size: 2.5rem;
	}
	.service_list > li .popup .list {
		padding: 3.5rem;
	}
}

@media screen and ( max-width: 768px ){
	.service_list {
		flex-wrap: wrap;
		justify-content: center;
	}
	.service_list > li {
		padding: 3rem;
		width: 47%;
		border: 1px solid #ccc;
		margin: 1rem;
	}

	.service_list > li .popup{
		display: none;
	}

	.service_list > li:hover .popup{
		display: block;
	}

}

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

	.service_list > li {
		padding: 2.5rem;
		font-size: 1.3rem;
		width: 100%;
		min-width: 100%;
		position: relative;
	}

	.service_list > li::after {
		font-family: 'Material Icons';
		content: "list";
		position: absolute;
		padding: 1rem;
		color: #fff;
		top: 0rem;
		right: 0rem;
		background: #222;
		font-size: 1.5rem;
		height: 3.5rem;
		display: flex;
		align-items: center;
		padding: 0 1.5rem;
	}
	
	.service_list > li .image{
		text-align: center;
	}
	
	.service_list > li .image img {
		width: 70%;
		margin: 0 auto;
	}
	.service_list > li h4 {
		font-size: 2.5rem;
		margin: 1rem 0 2rem;
	}
	.service_list > li h5 {
		font-size: 1.6rem;
		line-height: normal;
		margin: 0 0 2rem;
	}

	.service_list > li .popup .title {
		font-size: 1.8rem;
		height: 6rem;
	}
	.service_list > li .popup .list {
		padding: 1.5rem 3.5rem;
		font-size: 1.4rem;
	}
	.service_list > li .popup .list li{
		padding: 1.3rem 0;
	}

	.service_list{
		margin: 0 3rem 16rem;
	}

}


/*----------------------*/
/*COMPANY*/

.about_list_area.company_top .list.area01{
	background: url(../img/company/owrwish.jpg) no-repeat;
	background-position: right 12rem;
}

.about_list_area.company_top .list.area01 .area{
	background: #222;
	color: #fff;
	width: 55%;
	min-height: 45rem;
}

.about_list_area.company_top .list.area01 .area .box{
	max-width: 85rem;
}

.about_list_area.company_top .list .area .box .text {
	max-width: 62rem;
}

.about_list_area.company_top .list .area .box .text h4{
	margin-bottom: 3rem;
}

@media screen and ( max-width:1300px ){
/*
	.about_list_area.company_top .list .area .box .text p{
		font-size: 1.3rem;
	}
*/
}

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

	.about_list_area.company_top .list.area01 .area {
		width: 77%;
		min-height: 45rem;
	}

}

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

	.about_list_area.company_top .list.area01 .area {
		width: 74%;
		min-height: 45rem;
	}

	.about_list_area.company_top .list.area01 {
		background-position: right top;
		background-size: 100%;
		padding-top: 35rem;
	}
	.about_list_area.company_top .list.area01 .area {
		width: 100%;
	}

}

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

	.about_list_area.company_top{
		margin-bottom: 0rem;
	}
	.about_list_area.company_top .list.area01 .area {
		width: 100%;
	}
	.about_list_area.company_top .list {
		min-height: 62rem;
	}
	.about_list_area.company_top .list.area01 {
		background-position: right top;
		background-size: 100%;
	}
	
	.about_list_area .list.area01 {
		background-position: right top;
		background-size: 100%;
		padding-top: 20rem;
		margin-bottom: 6rem;
	}

	.about_list_area.company_top .list.area01{
		padding-top: 17rem;
	}

	.about_list_area.company_top .list .area .box .text h4{
		margin-bottom: 2rem;
	}
}
/*-------------*/

.since_list{
	width: 130rem;
	height: 96rem;
	/*background: url(../img/company/since_bg.png) no-repeat;*/
	margin: 0 auto;
	position: relative;
}

.since_list li{
	position: absolute;
}


.since_list li p{
	font-size: 1.4rem;
	line-height: 2.4rem;
	font-feature-settings: "palt";
}

.since_list li h4{
	font-weight: bold;
}

.since_list li.since2006{
	top: 3.6rem;
	left: 7.1rem;
	width: 15.5rem;
	color: #4c203a;
}
.since_list li.since2006 h4{ font-size: 3rem; }

.since_list li.since2007{
	top: 24.5rem;
	left: 12.3rem;
	width: 12rem;
	color: #3b204c;
}
.since_list li.since2007 h4{ font-size: 3.7rem; }

.since_list li.since2009{
	top: 9rem;
	left: 29rem;
	width: 12rem;
	color: #20234c;
}
.since_list li.since2009 h4{ font-size: 4.5rem; }

.since_list li.since2010{
	top: 1.5rem;
	left: 51.2rem;
	width: 32rem;
	color: #203b4c;
}
.since_list li.since2010 h4{ font-size: 5.2rem; }

.since_list li.since2011{
	top: 24.9rem;
	left: 33.3rem;
	width: 14rem;
	color: #204c43;
}
.since_list li.since2011 h4{ font-size: 6rem; }

.since_list li.since2016{
	top: 24rem;
	left: 65.7rem;
	width: 21rem;
	color: #2e4c20;
}
.since_list li.since2016 h4{ font-size: 6.7rem; }

.since_list li.since2017{
	top: 47rem;
	left: 80.5rem;
	width: 14rem;
	color: #4c4b20;
}
.since_list li.since2017 h4{ font-size: 7.5rem; }

.since_list li.since2019{
	top: 52.6rem;
	left: 110rem;
	width: 19rem;
	color: #4c3c20;
}
.since_list li.since2019 h4{ font-size: 8rem; }

.since_list li.since2020{
	top: 27.6rem;
	left: 103rem;
	width: 20rem;
	color: #4c2020;
}
.since_list li.since2020 h4{ font-size: 8.5rem;}

.since_list_catch{
	font-size: 5rem;
	line-height: 7rem;
	text-align: center;
	font-weight: bold;
	margin-bottom: 10rem;
}

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

	.since_list{
		width: 100%;
/*
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
*/
		height: -webkit-fill-available;
		overflow: hidden;
		font-size: 1.2rem;
		height: 70vw;
	}

	.since_list	img{
		width: 100%;
	}

	.since_list li.since2006{
		top: 2.5vw;
		left: 5.5vw;
		width: 12vw;
	}
	.since_list li.since2006 h4{ font-size: 2.5vw; }

	.since_list li.since2007{
		top: 17.5vw;
		left: 9vw;
		width: 9vw;
	}
	.since_list li.since2007 h4{ font-size: 2.9vw; }

	.since_list li.since2009{
		top: 6.5vw;
		left: 21vw;
		width: 11vw;
	}
	.since_list li.since2009 h4{ font-size: 3.5vw; }

	.since_list li.since2010{
		top: 0vw;
		left: 37vw;
		width: 24vw;
	}
	.since_list li.since2010 h4{ font-size: 4.1vw; }

	.since_list li.since2011{
		top: 18vw;
		left: 23.5vw;
		width: 10vw;
	}
	.since_list li.since2011 h4{ font-size: 4.5vw; }

	.since_list li.since2016{
		top: 17vw;
		left: 47.5vw;
		width: 14vw;
	}
	.since_list li.since2016 h4{ font-size: 4.9vw; }

	.since_list li.since2017{
		top: 33vw;
		left: 58vw;
		width: 13vw;
	}
	.since_list li.since2017 h4{ font-size: 5.2vw; }

	.since_list li.since2019{
		top: 37.5vw;
		left: 79.2vw;
		width: 14vw;
	}
	.since_list li.since2019 h4{ font-size: 5.7vw; }

	.since_list li.since2020{
		top: 19vw;
		left: 74vw;
		width: 15vw;
	}
	.since_list li.since2020 h4{ font-size: 6vw;}

}

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

	.since_list{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		height: -webkit-fill-available;
		overflow: hidden;
		font-size: 1.2rem;
		height: 80rem;
	}

	.since_list img{
		width: 100%;
		height: 100%;
	}

	.since_list li p {
		font-size: 1.2rem;
		line-height: 2rem;
	}
	
	.since_list li.since2006{
		top: 2.5rem;
		left: 4.5em;
		width: 13.5rem;
		color: #4c203a;
	}
	.since_list li.since2006 h4{ font-size: 2.5rem; }

	.since_list li.since2007{
		top: 18rem;
		left: 9rem;
		width: 10rem;
		color: #3b204c;
	}
	.since_list li.since2007 h4{ font-size: 2.8rem; }

	.since_list li.since2009{
		top: 6.5rem;
		left: 22rem;
		width: 12rem;
		color: #20234c;
	}
	.since_list li.since2009 h4{ font-size: 3.1rem; }

	.since_list li.since2010{
		top: 0.5rem;
		left: 38.2rem;
		width: 32rem;
		color: #203b4c;
	}
	.since_list li.since2010 h4{ font-size: 3.4rem; }

	.since_list li.since2011{
		top: 18rem;
		left: 24.3rem;
		width: 14rem;
		color: #204c43;
	}
	.since_list li.since2011 h4{ font-size: 3.7rem; }

	.since_list li.since2016{
		top: 17rem;
		left: 48.7rem;
		width: 21rem;
		color: #2e4c20;
	}
	.since_list li.since2016 h4{ font-size: 4rem; }

	.since_list li.since2017{
		top: 34rem;
		left: 60rem;
		width: 14rem;
		color: #4c4b20;
	}
	.since_list li.since2017 h4{ font-size: 4.3rem; }

	.since_list li.since2019{
		top: 39rem;
		left: 81.5rem;
		width: 19rem;
		color: #4c3c20;
	}
	.since_list li.since2019 h4{ font-size: 4.7rem; }

	.since_list li.since2020{
		top: 20rem;
		left: 76rem;
		width: 20rem;
		color: #4c2020;
	}
	.since_list li.since2020 h4{ font-size: 5rem;}

	.since_list_catch{
		font-size: 6rem;
		line-height: 9rem;
		text-align: center;
		font-weight: bold;
		margin-bottom: 10rem;
	}


/*
	.since_list li{
		position: inherit;
		width: 20% !important;
		top: 0rem !important;
		left: 0rem !important;
		padding: 0 1rem 3rem;
	}

	.since_list li:nth-child(odd){

	}

	.since_list li:nth-child(even){

	}

	
	.since_list li h4{
		font-size: 4rem !important;
	}
	
	.since2006,.since2007,.since2009,.since2010,.since2011,.since2016,.since2017,.since2019,.since2020{

	}
	
	.since,.flag_load,.flag2006,.flag2007,.flag2009,.flag2010,.flag2011,.flag2016,.flag2017,.flag2019,.flag2020{
		display: none;
	}
	
	.since_list_catch {
		font-size: 5rem;
		line-height: 7rem;
		margin-bottom: 5rem;
	}
*/
}


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

	.since_list {
		height: 55rem;
	}

	.since_list li {
		width: 100%;
		margin-bottom: 5rem;
	}
	.since_list_catch {
		font-size: 4.2rem;
		line-height: 7rem;
	}

	.since_list li p {
		font-size: 1rem;
		line-height: 1.5rem;
	}

	.since_list li h4 {
		font-size: 2.2rem;
	}

	.since_list li.since2006 {
		top: 2rem;
		left: 3.5em;
		width: 9rem;
		color: #4c203a;
	}
	.since_list li.since2007 {
		top: 13.5rem;
		left: 7rem;
		width: 7rem;
		color: #3b204c;
	}
	.since_list li.since2009 {
		top: 4.5rem;
		left: 16.5rem;
		width: 9rem;
		color: #20234c;
	}
	.since_list li.since2010 {
		top: 0.5rem;
		left: 29rem;
		width: 25rem;
		color: #203b4c;
	}
	.since_list li.since2011 {
		top: 14rem;
		left: 18rem;
		width: 9rem;
		color: #204c43;
	}
	.since_list li.since2016 {
		top: 13rem;
		left: 37rem;
		width: 15rem;
		color: #2e4c20;
	}
	.since_list li.since2017 {
		top: 25rem;
		left: 45rem;
		width: 9rem;
		color: #4c4b20;
	}
	.since_list li.since2019 {
		top: 29rem;
		left: 61rem;
		width: 10rem;
		color: #4c3c20;
	}
	.since_list li.since2020 {
		top: 15rem;
		left: 57rem;
		width: 15rem;
		color: #4c2020;
	}
	
	.since_list li.since2006 h4{ font-size: 2.5rem; }
	.since_list li.since2007 h4{ font-size: 2.6rem; }
	.since_list li.since2009 h4{ font-size: 2.7rem; }
	.since_list li.since2010 h4{ font-size: 2.8rem; }
	.since_list li.since2011 h4{ font-size: 2.9rem; }
	.since_list li.since2016 h4{ font-size: 3.0rem; }
	.since_list li.since2017 h4{ font-size: 3.1rem; }
	.since_list li.since2019 h4{ font-size: 3.2rem; }
	.since_list li.since2020 h4{ font-size: 3.3rem; }

}

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

	
	.since_list li{
		position: inherit;
		width: 20% !important;
		top: 0rem !important;
		left: 0rem !important;
		padding: 0 1rem 3rem;
	}

	.since_list {
		margin-top: -5rem;
		height: 85rem;
	}

	.since_list li{
		width: 100% !important;
		margin-bottom: 0rem;
		padding: 0 1rem 1rem;
	}

	.since_list_catch {
		font-size: 2.5rem;
		line-height: 4rem;
		margin-left: 4rem;
		margin-right: 4rem;
		margin-bottom: 6rem;
	}

	.since,.flag_load,.flag2006,.flag2007,.flag2009,.flag2010,.flag2011,.flag2016,.flag2017,.flag2019,.flag2020{
		display: none;
	}

}

/*-------------*/

.profile_area{
	display: flex;
	justify-content: space-between;
	max-width: 130rem;
	margin: 0 auto;
}

.profile_area .profile_list{
	max-width: 60rem;
	flex: 1;
	border-top: 0.1rem solid #e1e1e1;
	margin: 0 2rem;
}

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

	.form.contact.profile_area .profile_list {
	    margin: 0 0;
	}

}

.profile_area .profile_list ul{
	list-style-type: decimal-leading-zero;
}

.profile_area .profile_list ul li{
	margin-left: 3rem;
	margin-bottom: 1rem;
	line-height: normal;
}

.pinpon{
	width: 100%;
	background: #eee;
}

.pinpon a img{
	width: 100%;
}

.pinpon_text{
	text-align: left;
	width: auto;
	display: flex;
}

.pinpon_text a{
	text-decoration: none;
	transition: all .2s;
	display: flex;
	align-items: center;
	border: 1px solid #222;
	padding: 0.5rem 1.5rem;
	justify-content: center;
	min-width: 21rem;
}

.pinpon_text a:hover{
	opacity: 0.5;
}

.pinpon_text .material-icons{
	font-size: 1.8rem;
	margin-left: 0.5rem;
}

.pinpon_text a:hover{
	opacity: 0.8;
}


.profile_area .profile_list > li{
	display: flex;
	align-items: inherit;
}

.profile_area .profile_list > li .p_mark{
	display: flex;
	align-items: center;
}

.profile_area .profile_list > li .p_mark img{
	width: 8rem;
}

.profile_area .profile_list > li .p_mark .image{
	margin-left: 2.5rem;
}

.profile_area .profile_list > li h4{
	border-bottom: 0.5rem solid #222222;
	max-width: 13rem;
	flex: 1;
	padding: 5.22rem 0;
	margin: 0;
	font-size: 2rem;
	font-weight: bold;
}

.profile_area .profile_list > li div{
	border-bottom: 0.1rem solid #e1e1e1;
	max-width: 47rem;
	flex: 2;
	padding: 5rem 3rem;
	font-size: 1.4rem;
}

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

	.profile_area .profile_list {
		max-width: 48%;
	}

}


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

	.pinpon_text a{
		min-width: 100%;
	}

}

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

	.profile_area {
		flex-wrap: wrap;
	}
	
	.profile_area .profile_list {
		max-width: 100%;
		flex: auto;
		margin: 0;
	}
	
	.profile_area .profile_list > li {
		position: relative;
		flex-wrap: wrap;
		overflow: hidden;
	}
	
	.profile_area .profile_list > li::before {
		content: '';
		position: absolute;
		border: 0.3rem solid #222;
		width: 10rem;
		bottom: 0;
	}
	
	.profile_area .profile_list li h4 {
		border-bottom: none;
		width: 100%;
		flex: auto;
	}

	.profile_area .profile_list li div {
		border-bottom: 0.1rem solid #e1e1e1;
		width: 100%;
		flex: auto;
		padding: 0 0 3rem;
	}

	.profile_area .profile_list li h4{
		padding: 5rem 0 2rem;
		max-width: 30rem;
	}

	.pinpon_text a{
		min-width: 21rem;
	}

}


/*-------------*/

.landscape{
	background: #ccc;
}

.landscape_area{
	display: flex;
	justify-content: space-between;
}

.landscape_area .main{
	width: 50%;
}

.landscape_area img{
	width: 100%;
}

.landscape_area .box{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	max-width: 75.6rem;
	width: 47%;
}


.landscape_area .box .top{
	width: 51%;
}

.landscape_area .box .landscape_list{
	width: 43.3%;
}


.landscape_area .box .landscape_list{
	margin-bottom: 0;
}

.landscape_area .box .landscape_list li{
	margin-bottom: 3.5rem;
}

.content.landscape{
	background: linear-gradient(90deg,#fff 10%,#fff 20%,#e8e8e8 20%,#e8e8e8 100%);
	background-repeat: no-repeat;
	background-position: right 38rem;
	margin-bottom: 12rem;
}

@media screen and ( max-width:1900px ){ .landscape_area .box .landscape_list li { margin-bottom: 3.1rem; } }
@media screen and ( max-width:1700px ){ .landscape_area .box .landscape_list li { margin-bottom: 4.7rem; } }
@media screen and ( max-width:1500px ){ .landscape_area .box .landscape_list li { margin-bottom: 2.9rem; } }
@media screen and ( max-width:1400px ){ .landscape_area .box .landscape_list li { margin-bottom: 2.8rem; } }

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

	.landscape_area {
		margin: 0 2rem;
	}

	.landscape_area .box .landscape_list li{
		margin-bottom: 2.5rem;
	}

/*
	.landscape_area .main {
		max-width: 61rem;
	}

	.landscape_area .box {
		max-width: 57rem;
	}

	.landscape_area .box .top{
		max-width: 38rem;
	}
	
	.landscape_area .box .landscape_list {
		width: 16%;
	}
*/	
}
@media screen and ( max-width:1200px ){ .landscape_area .box .landscape_list li { margin-bottom: 2.3rem; } }
@media screen and ( max-width:1200px ){ .landscape_area .box .landscape_list li { margin-bottom: 2.0rem; } }


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

	.landscape_area img{
		width: 100%;
	}

	.landscape_area .main{
		width: 50%;
	}

	.landscape_area .box{
		width: 46%;
	}

	.landscape_area .box .top{
		width: 51%;
	}

	.landscape_area .box .landscape_list{
		width: 43.3%;
	}
	
	.landscape_area .box .landscape_list li { margin-bottom: 3.3rem; }
}

@media screen and ( max-width:768px ){
	.content.landscape{
		margin-bottom: 4rem;
	}

	.landscape_area .box .landscape_list li { margin-bottom: 3.3rem; }
}

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

	.content.landscape {
		background: linear-gradient(90deg,#fff 60%,#fff 60%,#e8e8e8 60%,#e8e8e8 100%);
		background-repeat: no-repeat;
		background-position: right 40rem;
		margin-bottom: 6rem;
	}
	
	.landscape_area {
		display: flex;
		flex-wrap: wrap;
	}
	
	.landscape_area .box {
		width: 100%;
	}

	.landscape_area .main {
		width: 100%;
		margin-bottom: 2rem;
	}
	
	.landscape_area .box .landscape_list {
		width: 43.3%;
	}

	.landscape_area .box .landscape_list li {
		margin-bottom: 2.4rem;
	}

}

/*-------------*/

.access_area{
	display: flex;
	justify-content: space-between;
	max-width: 130rem;
	margin: 0 auto;
}

.access_area{

}

.access_area .image .map{
	width: 65rem;
	height: 57rem;
	margin-bottom: 1.5rem;
}

.access_area .image img{
	margin-bottom: 1.5rem;
}

.access_area .text{
	width: 60rem;
}

.access_area .text h4{
	font-size: 3rem;
	font-weight: bold;
	margin-bottom: 1.5rem;
}

.access_area .text .area{
	font-size: 1.6rem;
}

.access_area .text .access_list{
	padding: 2.5rem 1.5rem;
	border-bottom: 1px dotted #cccccc;
	margin-bottom: 2.5rem;
}

.access_area .text .access_list h5{
	font-size: 2rem;
	font-weight: bold;
}

.access_area .text .access_list p{
	font-size: 1.4rem;
}

.access_area .spot_list{
	display: flex;
	justify-content: space-between;
}

.access_area .spot_list li p{
	font-size: 1.4rem;
	text-align: center;
	margin-top: 1.5rem;
	font-feature-settings: "palt";
}

/*-----------*/

.map_form{

}

.map_form form{
	display: flex;
	justify-content: space-between;
}

.map_form input[type="submit"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  /*border: none;*/
  box-sizing: border-box;
  cursor: pointer;
}
.map_form input[type="submit"]::-webkit-search-decoration {
  display: none;
}
.map_form input[type="submit"]::focus {
  outline-offset: -2px;
}

.map_form .form_btn{
	border: 3px solid #222;
	width: 22.5rem;
	height: 5rem;
	color: #222;
	font-size: 1.7rem;
	font-weight: bold;
	background: #fff;
}

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


	.access_area div.image{
		overflow: inherit;
	}

	.access_area .spot_list img{
		width: 100%;
	}

	.access_area .text {
		max-width: 57rem;
		margin-left: 3rem;
	}

	.access_area .spot_list li{
		width: 32%;
	}

}

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

	.access_area {
		flex-wrap: wrap;
	}

	.access_area .image{
		width: 47%;
	}

	.access_area .image .map{
		width: 100%;
	}
	
	.access_area .text {
		width: 49%;
	}
	.access_area .spot_list img{
		width: 100%;
	}
}

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

	.access_area .image {
		width: 40%;
	}
	.access_area .text {
		width: 55%;
	}

	.map_form form{
		flex-wrap: wrap;
	}
	
	.map_form input[type="submit"] {
		width: 100%;
		margin-top: 2rem;
	}
}

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

	.access_area .image {
		width: 100%;
	}

	.access_area .image .map {
		width: 100%;
		height: 30rem;
	}
	
	.access_area .text {
		width: 100%;
		margin-left: 0rem;
	}
	
	.access_area .text h4 {
		font-size: 2rem;
	}
	
	.access_area .text .area {
		font-size: 1.3rem;
	}

	.access_area .text .access_list h5 {
		font-size: 1.6rem;
	}

	.access_area .text .access_list p {
		font-size: 1.2rem;
	}
	
	.map_form form {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	
	.map_form form {
		font-size: small;
	}

	.map_form input[type="submit"] {
			font-size: small;
	}
	
	.map_form .form_btn {
		font-weight: bold;
		background: #fff;
		margin: 2rem 0 3rem;
	}

	.access_area .spot_list li p {
		font-size: 1.2rem;
	}
}

/*----------------------*/
/*PRICE*/

.price_top{

}

.about_list_area.price_top .list.area01 {
	background: url(../img/price/provide.jpg) no-repeat;
	background-position: right 12rem;
}

@media screen and ( max-width:1300px ){
	.price_area_all .price_area{
		margin-left: 2rem;
		margin-right: 2rem;
	}
}

@media screen and ( max-width:768px ){
	.about_list_area.price_top .list.area01 {
		background-position: right top;
		background-size: 100%;
		padding-top: 35rem;
	}
}

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

	.about_list_area {
		margin-bottom: 0;
	}
	.about_list_area.price_top .list.area01 {
		background-position: right top;
		background-size: contain;
		padding-top: 20rem;
		margin-bottom: 0rem;
	}
}


/*-------------*/

.price_title{
	width: 100%;
	margin: 0 auto;
}

.price_title .title{
	max-width: 130rem;
	padding: 10rem;
	margin-bottom: 4rem;
	margin: 0 auto;
}

.price_title.v01 .title{ background: url(../img/price/price_title01.jpg) no-repeat #ccc; }
.price_title.v02 .title{ background: url(../img/price/price_title02.jpg) no-repeat #ccc; }
.price_title.v03 .title{ background: url(../img/price/price_title03.jpg) no-repeat #ccc; }
.price_title.v04 .title{ background: url(../img/price/price_title04.jpg) no-repeat #ccc; color: #fff;}

.price_title .title h4{
	font-size: 5rem;
	font-weight: bold;
}

.price_title .title p{
	font-size: 2rem;
	font-weight: bold;
}

.price_sub_area{
	margin: 3rem 0;
}

.price_area{
	max-width: 130rem;
	margin: 0 auto 16rem;
}

.price_area .price_list{
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	/*align-items: baseline;*/
}

.price_area .price_list{
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	/*align-items: baseline;*/
}

.price_title.v03 + .price_area .price_list{
	align-items: baseline;
}

.price_area .price_list > li{
	width: 50%;
	padding: 2.5rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.price_area .price_list > li .name h5{
	font-size: 1.8rem;
	font-weight: bold;
}

.price_area .price_list > li .price{
	font-size: 4rem;
	font-weight: bold;
}

.price_area .price_list > li .price.other{
	font-size: 3rem;
}

.price_area .price_list > li .price small{
	font-size: 2rem;
	font-weight: bold;
}

.price_area .price_list > li:nth-child(1){
	border-right: 2px solid #404040;
	border-bottom: 2px solid #404040;
}
.price_area .price_list > li:nth-child(1).none{
	border-bottom: none;
}
.price_area .price_list > li:nth-child(2){
	border-bottom: 2px solid #404040;
}
.price_area .price_list > li:nth-child(2).none{
	border-bottom: none;
}
.price_area .price_list > li:nth-child(3){
	border-right: 2px solid #404040;
	border-bottom: 2px solid #404040;
}
.price_area .price_list > li:nth-child(3).none{
	border-bottom: none;
}
.price_area .price_list > li:nth-child(5){
	/*border-top: 2px solid #404040;*/
	border-right: 2px solid #404040;
}

.price_area .price_list > li.border_bottom{
	border-bottom: 2px solid #404040;
}

.price_area .price_list > li.border_none{
	border: none;
	padding: 2rem 5rem;
}

.price_area .price_list > li .point{
	font-size: 1.2rem;
	line-height: 2.3rem;
	text-align: center;
	margin: 2rem auto 0;
}

.price_area .price_list > li.cms{
	min-height: 15rem;
}

.price_area .price_list > li .system{
	border-top: 1px solid #404040;
	padding-top: 1.5rem;
	margin-top: 1.5rem;
}

.price_area .price_list > li .price_box{
	width: 100%;
}

.price_area .price_list > li .price_box li{
	width: 100%;

	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	border-bottom: 1px solid #404040;
}

.price_area .price_list > li .price_box li h5{
	font-size: 1.8rem;
	font-weight: bold;
}

.price_area .price_list > li.support{
	width: 50%;
	padding: 0;
	border-bottom: none;
}

.price_area .price_list > li.support > div{
	width: 100%;
	border-bottom: 2px solid #404040;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding: 4rem;
}

.price_area .price_list > li.support > div:last-child{
	border-bottom: none;
}


/*-------------*/

.example_list{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 8rem 0 10rem;
	flex-wrap: wrap;
}

.example_list .box{
	border: 0.3rem solid #222;
	box-shadow: 1rem 1rem 0 0 #222;
	padding: 0 2rem;
	min-width: 19rem;
}

.example_list .box div{
	margin-top: -3rem;
	text-align: center;
	
}

.example_list .box div img{
	width: 5rem;
}

.example_list .box h5{
	font-size: 1.8rem;
	font-weight: bold;
	text-align: center;
	height: 5rem;
	margin-top: 2rem;
	margin-bottom: -2rem;
}

.example_list .box p{
	font-size: 4rem;
	font-weight: bold;
	text-align: center;
}

.example_list .box p small{
	font-size: 2rem;
	font-weight: bold;
}

.example_list .price{
	font-size: 5rem;
	font-weight: bold;
	border-bottom: 0.5rem solid #222;
	line-height: 5rem;
}

.example_list .price small{
	font-size: 2rem;
	font-weight: bold;
}

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

	.example_list {
		margin: 6rem 2rem 8rem;
	}
	
	.example_list .price{
		margin-top: 0rem;
	}
	
	.example_list .box {
		min-width: 14rem;
		margin: 2rem 0;
		padding: 0 1rem;
	}
	
	.example_list .price {
		font-size: 4rem;
	}
	.price_area .price_list > li .price_box li h5 {
		width: 50%;
		display: flex;
		flex-wrap: wrap;
	}

	.price_area .price_list > li.support .name{
		width: 55%;
		flex-wrap: wrap;
	}
	
	.price_area .price_list > li.support .name small{
		display: flex;
		flex-wrap: wrap;
	}
	
	.price_area .price_list > li.support > div{
		padding: 3rem;
	}

}

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

	.example_list .box {
		min-width: 25rem;
		margin: 2rem;
	}
	.example_list .price {
		margin-right: 4rem;
	}
	.price_area .price_list > li {
		padding: 2.5rem 2rem;
	}
}

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

	.example_list .box {
		min-width: 98%;
		margin: 2rem 0;
		padding: 0 1rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.example_list .box div {
		margin-top: 0;
	}
	.example_list .box h5 {
		font-weight: bold;
		text-align: center;
		height: auto;
		margin-top: 0;
		margin-bottom: 0;
		font-size: 1.4rem;
	}
	.example_list .box p {
		margin: 0;
		font-size: 2.8rem;
	}
	
	.example_list .box p small {
		font-size: 50%;
	}

	.example_list .box div img {
		width: 4rem;
	}
	
	.example_list li {
		margin: 0 auto;
	}
	
	.example_list {
		margin: 3rem 0rem 8rem;
	}
	.price_area .price_list > li .price.other{
		font-size: 1.7rem;
	}

	.example_list .equal {
		margin-top: 2rem;
	}

	.example_list .price {
		font-size: 3rem;
		margin-top: 2rem;
	}

	.example_list .price small{
		font-size: 1.6rem;
	}

	.example_list li img {
		width: 4rem;
	}

	.price_sub_area{
		margin: 8rem 0 0;
	}


}

/*-------------*/

.price_title.v01{
	background: linear-gradient(90deg,#fff 10%,#fff 30%,#404040 30%,#404040 100%);
	background-repeat: no-repeat;
	background-position: right 5rem;
	padding-bottom: 5rem;
	margin-bottom: 4rem;
}

.price_title.v02{
	background: linear-gradient(90deg,#eee 70%,#eee 60%,#fff 60%,#fff 100%);
	background-repeat: no-repeat;
	background-position: right 3rem;
	padding-top: 8rem;
	margin-bottom: 8rem;
	height: 36rem;
}

.price_title.v03{
	background: linear-gradient(90deg,#fff 10%,#fff 30%,#404040 30%,#404040 100%);
	background-repeat: no-repeat;
	background-position: right 3rem;
	padding-top: 8rem;
	margin-bottom: 8rem;
	height: 36rem;
}

.price_title.v04{
	background: linear-gradient(90deg,#fff 10%,#fff 30%,#eee 30%,#eee 100%);
	background-repeat: no-repeat;
	background-position: right 5rem;
	padding-bottom: 5rem;
	margin-bottom: 4rem;
}

.price_title_sub{
	border: 0.3rem solid #222;
	color: #222;
	font-size: 2.5rem;
	font-weight: bold;
	padding: 1.5rem 2rem;
	display: table-cell;
	margin-bottom: 2rem;
}

.graph_list{
	display: flex;
	justify-content: space-around;
	max-width: 123rem;
	margin: 0 auto;
}

.graph_list > li h5{
	font-size: 3rem;
	font-weight: bold;
	text-align: center;
	border-bottom: 0.3rem solid #222;
}

.graph_move li p,
.graph_list > li h5 span{
	display: none;
}

.graph_list > li h5 small{
	font-weight: bold;
	font-size: 60%;
}

.graph_list > li ul li{
	font-size: 1.4rem;
}

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

	.graph_list{
		max-width: 98rem;
	}

	.graph_list > li{
		width: 17%;
	}
	
	.graph_list > li h5{
		font-size: 2.4rem;
		padding-bottom: 1rem;
	}

}

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

	.graph_list{
		max-width: 98rem;
	}
	.graph_list > li{
		width: 17%;
	}
	
	.graph_list > li h5{
		font-size: 2.2rem;
		padding-bottom: 1rem;
	}
	.graph_list > li ul li {
		font-size: 1rem;
	}	
}

/**/

.graph_area{
	position: relative;
	height: 50rem;
}

#content{
	position: absolute;
/*
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 540px;
*/
	width: 100%;
	background: #eee;
}

.ttl1,.ttl2{
    color: #222 !important;
    font-size: 5rem;
    font-weight: bold;
}

.ttl2 small{
    font-size: 40%;
}

.ttl2.cheapest{
    color: #e53a6e !important;
    font-size: 7rem;
    font-weight: bold;
}

.ttl2.cheapest small{
    font-size: 40%;
}

.fare-calendar .fare-rates {
    position: relative;
    /*background: #332E32;*/
}

.fare-calendar .fare-rates .fare-monthcontainer {
    color: #092a5e ;
    /*display:table-cell;*/
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month {
    margin: 0;
    /*vertical-align: bottom;*/
    display: inline-block;
    width: 12rem;
    text-align: center;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month a
, .fare-calendar .fare-rates .fare-monthcontainer .fare-month span {
    display: block;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span:first-of-type {
    margin-bottom: -2rem;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span:last-of-type {
    margin: 10px 0 7px;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month button.btn2 {
    width: 60px;
    padding-left: 0;
    padding-right: 0;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price {
    min-height: 20px;
    background-color: #656565 ;
    transform-origin: 100% 100%;
    animation: priceAnimation 1s 1 ease-in-out; /* 20200713 追加 */
    -webkit-animation: priceAnimation 1s 1 ease-in-out;
    -moz-animation: priceAnimation 1s 1 ease-in-out;
    -o-animation: priceAnimation 1s 1 ease-in-out;
    border-radius: 3px;
/*
	-webkit-transition: all 0.5s 1 ease-in-out;
	-moz-transition: all 0.5s 1 ease-in-out;
	-o-transition: all 0.5s 1 ease-in-out;
*/
	position: relative;
}

.fare-price.bar01{ height:70px; }
.fare-price.bar02{ height:320px; }
.fare-price.bar03{ height:330px; }
.fare-price.bar04{ height:80px; }
.fare-price.bar05{ height:200px; }

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price::before{
	position: absolute;
	content: "";
	z-index: 2;
	top: -1.5rem;
	border-radius: 50% 50% 50% 50%;
	width: 100%;
	height: 3rem;
	background: #9b9b9b;
	left: 0;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price::after{
	position: absolute;
	content: "";
	z-index: 2;
	bottom: -1.5rem;
	border-radius: 50% 50% 50% 50%;
	width: 100%;
	height: 3rem;
	background: #525252;
	left: 0;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price.cheapest {
	background-color: #e53a6e ;
}


.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price.cheapest::before {
	background-color: #f487a8 ;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price.cheapest::after {
	background-color: #c12454 ;
}

/*
.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price:hover {
    background-color: #ccc ;
    cursor: pointer;
}

.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price.cheapest:hover {
    background-color: #C13773 ;
    cursor: pointer;
}
*/

@keyframes priceAnimation {  /* 20200713 追加 */
    from { transform: scaleY(0.1); }
    to { transform: scaleY(1.0); }
}

@-webkit-keyframes priceAnimation {
    from {-webkit-transform: scaleY(0.1);}
    to {-webkit-transform: scaleY(1.0);}
}

@-moz-keyframes priceAnimation {
    from {-moz-transform:scaleY(0.1);}
    to {-moz-transform:scaleY(1.0);}
}

@-o-keyframes priceAnimation {
    from {-o-transform:scaleY(0.1);}
    to {-o-transform:scaleY(1.0);}
}

.graph_move{
	display: flex;
	/*justify-content: space-evenly;*/
	justify-content: space-around;
	align-items: flex-end;
	background: url(../img/price/graph_bg.jpg) no-repeat;
	padding: 0 3vw;
}


.invisible {
	transition: opacity 0.5s ease;
	opacity: 0.0;
}

.visible {
	transition: opacity 0.5s ease;
	opacity: 1.0;
}

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

	.graph_move{
		padding: 0;
	}

}

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

	.ttl2.cheapest {
		font-size: 5.5rem;
	}

	.graph_move {
		height: 47rem;
	}

}

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

	.fare-calendar .fare-rates .fare-monthcontainer .fare-month {
		width: 6rem;
	}
	
	.price_list .name{
		width: 100%;
	}
	
	.price_area .price_list > li.support .name {
		width: 100%;
	}

	.price_area .price_list > li.border_none {
			padding: 2rem 2rem;
	}
	
	.price_area .price_list > li .price {
		font-size: 3rem;
	}

	.graph_list > li h5 {
		font-size: 1.8rem;
	}
	.ttl2.cheapest {
		font-size: 3.5rem;
	}
	.ttl2 {
		font-size: 3rem;
		padding-bottom: 2rem;
	}

}

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

	.graph_list > li ul li {
		font-size: 1.4rem;
	}

	.ttl2.cheapest {
		font-size: 3.2rem;
	}
	.ttl1, .ttl2 {
		font-size: 2.8rem;
	}

	.fare-calendar .fare-rates .fare-monthcontainer .fare-month span:first-of-type {
		margin-bottom: -3.5rem;
	}

	.graph_move {
		background-size: cover;
		height: 24rem;
	}

	.graph_area {
		height: auto;
		margin-bottom: 9rem;
	}

	.graph_list {
		flex-wrap: wrap;
	}
	.fare-calendar .fare-rates .fare-monthcontainer .fare-month span.fare-price {
		margin-top: 2rem;
	}
	.graph_move li p,
	.graph_list > li h5 span {
		display: inline-block;
		font-size: 2.5rem;
	}
	.graph_move li p {
		margin-top: 1rem;
		color: #222;
	}

	.price_title_sub {
		color: #222;
		font-size: 1.8rem;
		display: flex;
		margin: 3rem;
		justify-content: center;
		align-items: center;
	}
	
	.graph_list > li {
		width: 70%;
		margin-bottom: 3rem;
	}

	.fare-calendar .fare-rates .fare-monthcontainer .fare-month {
		width: 4.5rem;
		margin: 0rem -1rem -6.5rem;
	}

	.fare-price.bar01{ height: 3.5rem !important; }
	.fare-price.bar02{ height: 16rem !important;}
	.fare-price.bar03{ height: 16.5rem !important;}
	.fare-price.bar04{ height: 4rem !important;}
	.fare-price.bar05{ height: 10rem !important;}

	.graph_list > li h5 {
		display: flex;
		justify-content: left;
		align-items: baseline;
		font-size: 2.2rem;
	}

	.graph_list > li h5 span {
		margin-right: 1.2rem;
	}

}

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

	.price_area .price_list > li .price{
		font-size: 3.3rem;
	}

}

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

	.price_area .price_list > li .price_box li h5{
		font-size: 1.6rem;
	}

	.price_area .price_list > li .price {
		font-size: 2.6rem;
	}
}

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

	.price_title .title {
		padding: 4rem;
	}
	.price_title .title h4 {
		font-size: 2.2rem;
	}
	.price_title .title p {
		font-size: 1.4rem;
	}
	.price_title.v01 {
		padding-bottom: 4rem;
		margin-bottom: 3rem;
		height: 18rem;
	}

	.price_title.v01 .title {
		background-size: cover;
		background-position: 2%;
		position: relative;
		color: #fff;
	}
	
	.price_title.v01 .title h4, .price_title.v01 .title p{
		z-index: 1;
		position: relative;
	}

	.price_title.v01 .title::after {
		content: '';
		position: absolute;
		background: rgba(0, 0, 0, 0.5);
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 0;
	}

	.price_title.v02 {
		padding-top: 0rem;
		margin-bottom: 0rem;
		height: 18rem;
	}

	.price_title.v02 .title {
		background-size: cover;
		background-position: 34%;
	}

	.price_title.v03 {
		padding-top: 0rem;
		margin-bottom: 0rem;
		height: 18rem;
	}

	.price_title.v03 .title {
		background-size: cover;
		background-position: right;
	}

	.price_title.v04 {
		padding-top: 0rem;
		margin-bottom: 0rem;
		height: 18rem;
	}

	.price_title.v04 .title {
		background-size: cover;
		background-position: 50%;
	}
	
	.price_area_all{
		margin-bottom: 20rem;
	}

	.price_area {
		margin: 0 auto 8rem;
	}
	.price_area .price_list > li {
		width: 100%;
		border-right: none !important;
		border-bottom: 2px solid #404040 !important;
	}
	.price_area .price_list > li.support {
		width: 100%;
	}
	
	.price_area .price_list .name{
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 1.5rem;
	}
	.price_area .price_list > li .name h5 {
		width: 100%;
	}
	.price_area .price_list > li .price_box {
		margin-top: 2rem;
	}
	.price_area .price_list > li .price_box li {
		padding-top: 2rem;
	}
	.price_area .price_list > li.border_none {
		padding: 2rem 2rem;
	}
	
	.price_area .price_list > li .price{
		line-height: 3.5rem;
		font-size: 2.2rem;
	}

	.price_area .price_list > li .price small {
		font-size: initial;
	}
	
	.price_area .price_list > li .price.right_side{
		width: 100%;
		text-align: right;
	}
	
	.price_area .price_list > li .point {
		text-align: left;
	}
	.price_area .price_list > li .price.right_side.space {
		padding-right: 2rem;
	}
	.price_area .price_list > li .system {
		font-size: 1.2rem;
	}

}


/*----------------------*/
/*WORKS*/

.category_list.works {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 130rem;
	padding: 0 ;
	margin: 0 auto;
}

.category_list.works .list{
	max-width: 130rem;
	padding: 0;
	margin-bottom: 8rem;
	align-items: inherit;
}

.category_list.works .list ul {
	padding: 0;
	margin: 0;
}

.category_list.works .list ul li {
	width: 33%;
	margin-bottom: 2.1rem;
}

.category_list.works .list ul li label {
	position: relative;
	display: inline-block;
	border: 2px solid #292929;
	width: 35rem;
	margin:  0;
}

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

	.category_list.works .list{
		margin: 0 2rem 8rem;
	}

	.category_list.works .list ul li label {
		width: 26vw;
	}
	
	.top_works_list {
		margin: 0 2rem;
	}
	.top_works_list li {
		width: 30%;
	}
}


.category_list.works .list ul li select {
    font-size: 1.6rem;
    letter-spacing: 0.3rem;
    padding: 13px 16px;
    width: 100%;
    border: none;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    background: transparent;
    
    height: 7rem;
    color: #222;
}

.category_list.works .list ul li select::-ms-expand{
	display: none;
}

.category_list.works .list ul li label:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    width: 0;
    height: 0;
    margin: -2px 0 0 0;
    border: 5px solid transparent;
    border-top: 7px solid #292929;
}

.category_list.works .search_bt_wrap{
	background: #222;
	border: none;
	width: 17rem;
	height: 10rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2rem;
	font-weight: bold;
	color: #fff;
	
	position: relative;
	margin-bottom: 2rem;
	transition: 0.5s;
}

.category_list.works .search_bt_wrap:hover{
	background: #aaa;
}

.category_list.works .search_bt{
	border: none;
	outline: 0;
	cursor: pointer;
	color: #fff;
	background: rgba(34, 34, 34, 0);
	font-weight: bold;
	width: 100%;
	height: 100%;
	transition: 0.5s;
	z-index: 1;
}

.category_list.works .search_bt:hover {
	background: rgba(34, 34, 34, 0);
}

.category_list.works .reset_bt:hover {
	border: 0.3rem solid #aaa;
	color: #aaa;
}

.category_list.works .search_bt_wrap:before {
	position: absolute;
	content: "search";
	font-family: "Material Icons";
	top: auto;
	left: 4.8rem;
	z-index: 2;
	font-size: 2.4rem;
	font-weight: normal;
	z-index: 0;
}

.category_list.works .reset_bt{
	width: 17rem;
	height: 5rem;
	color: #222;
	font-size: 1.7rem;
	border: 0.3rem solid #222;
	background: #fff;
	font-weight: bold;
	transition: 0.5s;
}

.list_total{
	text-align: center;
	margin: 0 0 6rem;
	font-size: 3rem;
	background: #222;
	color: #fff;
	padding: 1.2rem 0;
}

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

	.category_list.works {
		margin: 0 4rem;
	}

	.category_list.works .list ul li label {
		width: 23rem;
		margin: 0;
	}

}

@media screen and ( max-width: 820px ){
	.category_list.works {
		margin: 0px 2rem;
	}

	.category_list.works .list {
		margin: 0 0 8rem;
	}

	.category_list.works .list ul li label {
		width: 17rem;
		margin: 0;
	}

}

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

	.category_list.works {
		margin: 0rem;
	}
	.category_list.works .list {
		flex-wrap: wrap;
		margin: 0 2rem 6rem;
	}
	
	.category_list.works .list ul {
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	.category_list.works .list ul + div{
		width: 100%;
	}
	
	.category_list.works .list ul li {
		width: 47%;
		margin-bottom: 1.5rem;
	}

	.category_list.works .list ul li label {
		width: 100%;
	}
	.category_list.works .list ul li select{
		height: 5rem;
		padding-top: 1rem;
	}

	.category_list.works .search_bt_wrap {
		width: 100%;
		height: 8rem;
		font-size: 1.6rem;
	}
	.category_list.works .search_bt_wrap:before {
		left: 35vw;
		font-size: 1.8rem;
	}
	.category_list.works .reset_bt {
		width: 100%;
		font-size: 1.6rem;
	}

	.category_list.works .list ul li select {
		font-size: 1.4rem;
		padding: 11px 16px;
	}

	.list_total{
		font-size: 2rem;
	}

}

/*-------------*/

.works_bottom_text{
	font-size: 4rem;
	line-height: 5.5rem;
	text-align: center;
	font-weight: bold;
	margin: 16rem auto -4rem;
}

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

	.works_bottom_text {
		font-size: 1.8rem;
		line-height: 3rem;
		margin: 8rem auto 16rem;
	}
	
}


/*----------------------*/
/*WORKS RESULTS*/

.result_area{
	display: flex;
	max-width: 160rem;
	margin: 0 auto 10rem;
	justify-content: space-around;
	/*flex-wrap: wrap;*/
	padding: 0 2rem;
}

.result_area .image{
	max-width: 80rem;
	max-height: 50rem;
	background-image: url('../img/works/device01.jpg');
	transition: all 0.2s ease-out;
	background-size: contain;
	background-repeat: no-repeat;
	margin-left: -10rem;
}

.result_area .image img{
	transition: all 0.2s ease-out;
	width: 100%;
}

.result_area .data{
	max-width: 68rem;
}

.result_area .data .logo{
	text-align: center;
	margin-bottom: 2.5rem;
}

.result_area .data .name{
	font-size: 2.5rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.result_area .data .name small{
	font-size: 50%;
	margin-left: 2rem;
}

.result_area .data .url{
	margin-bottom: 4rem;

	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
}

.result_area .data .url a{
	color: #8d8d8d;
}

.result_area .data .category_list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 4rem;
}

.result_area .data .category_list li{
	width: 30%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 3px solid #eaeaea;
	padding-top: 1rem;
}

.result_area .data .category_list li h5{
	font-size: 1.7rem;
	font-weight: bold;
}

.result_area .data .category_list li p{
	font-size: 1.4rem;
}

.result_area .data .device_list{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.result_area .data .device_list.sp{
	display: none;
}

.result_area .data .device_list li{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30%;
	margin-top: 1rem;
	height: 6rem;

	background: #eee;
	color: #bbb;
}

.result_area .data .device_list li a{
	display: flex;
	align-items: center;
	justify-content: center;
	
	border: 0.3rem solid #222;
	color: #222;
	width: 100%;
	background: #fff;
}

.result_area .data .device_list li span.material-icons{
	margin-right: 1.2rem;
}

.result_area .data .device_list li a:hover{
	color: #fff;
}

.result_area .data .device_list li a:focus{
	border: 0.2rem solid #222;
	color: #222;
}

/*-------------*/

.results_text{
	width: 100%;
	margin-bottom: 16rem;
}

.results_text_area{
	display: flex;
	position: relative;
}

.results_text_area li{
	width: 52%;
	padding: 8rem;
	position: absolute;
}
/*
.results_text_area li::before{
	content:'';
	display: block;
	padding-bottom: 100%;
}
*/
.results_text_area li .h3_title.sub h3{
	font-size: 5rem;
}

.results_text_area li .h3_title.sub p{
	font-size: 2rem;
}

.results_text_area .introduction{
	background: #313131;
	color: #fff;
	top: 0;
	left: 0;
}

.results_text_area .comment{
	background: #e8e8e8;
	color: #2b2b2b;
	top: 4rem;
	right: 0;
}

.results_text_area .text_area{
	max-width: 50rem;
	margin: 0 auto;
}

/*----------*/

.page_list{
	display: flex;
	max-width: 130rem;
	margin: 6rem auto 4rem;
}

.page_list li.bt{
	max-width: 20rem;
	max-height: 6rem;
	width: 33.33333%;

	display: flex;
	align-items: center;
	justify-content: center;
	background: #eee;
	color: #bbb;
}

.page_list li.bt a{
	width: 100%;
	height: 100%;
	border: 0.3rem solid #aaa;
	color: #aaa;
	line-height: initial;
	
	color: #222;
	background: #fff;
	border: 3px solid #222;
}

.page_list li.bt a span{
	margin-right: 1.2rem;
}

.page_list li.bt.next a span{
	margin-right: 0rem;
	margin-left: 1.2rem;
}

.page_list li.bt a:focus{
	border: 0.3rem solid #222;
	color: #222;
}

.image_row{
	background: #ededed;
	max-width: 130rem;
	margin: 0 auto;
	padding: 2rem;
}

.image_row img{
	width: 100%;
}

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

	.result_area{
		flex-wrap: wrap;
	}
	
	.result_area .image{
		margin-left: 0;
	}

	.results_text {
		min-height: 70vh;
	}

	.page_list li.bt a {
		width: 25rem;
	}

	.result_area .data .logo{
		margin-top: 3rem;
	}

	.result_area .data .device_list.sp {
		display: flex;
		margin: 3rem 0;
	}

	.result_area .data .device_list.pc {
		display: none;
	}
	
	.results_text_area li .h3_title.sub h3 {
		font-size: 4rem;
	}
	
}

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

	.results_text {
		min-height: 55vh;
	}
	.result_area .image {
		background-size: contain;
		background-repeat: no-repeat;
	}

	.results_text_area li {
		padding: 6rem;
	}
	
	.results_text_area li .h3_title.sub h3 {
		font-size: 3.5rem;
	}

	.page_list li.bt a {
		width: 21rem;
		padding: .5rem 2rem;
	}

}

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

	.page_list li.bt a {
		width: 10rem;
		font-size: small; /* 20210730 追加 */
	}

	.result_area .data .device_list.sp{
		display: flex;
		margin-bottom: 3rem;
	}

	.result_area .data .device_list.pc{
		display: none;
	}

	.result_area .data .device_list {
		flex-wrap: wrap;
	}
	
	.results_text{
		margin-bottom: 8rem;
	}

	.results_text_area li {
		width: 100%;
		position: inherit;
	}
	.results_text_area {
		flex-wrap: wrap;
	}

	.result_area .data .category_list {
		margin: 0;
		padding: 0 2rem;
	}

	.result_area .data .category_list li {
		width: 47%;
		flex-wrap: wrap;
	}

	.result_area .data .category_list li h5{
		width: 100%;
		font-size: 1.6rem;
	}

	.result_area .data .device_list li {
		height: 7rem;
		font-size: 1.3rem;
		flex-wrap: wrap;
	}
	.result_area .data .device_list li .txt {
		width: 100%;
		text-align: center;
	}
	.result_area .data .device_list li a {
		flex-wrap: wrap;
		padding: 0;
		font-size: 1.3rem;
	}
	.result_area .data .device_list li span.material-icons {
		margin-top: 1rem;
		margin-right: 0;
	}

	.result_area .image {
		height: auto;
	}
	
	.result_area .data .logo img{
		width: 80%;
	}

	.result_area .data .name {
		margin: 1rem 2rem 2rem;
		font-size: 2.3rem;
		flex-wrap: wrap;
		line-height: normal;
	}
	.result_area .data .name small {
		width: 100%;
	}
	.page_list li.bt {
		line-height: 2rem;
		width: auto;
		font-size: small;
	}
	
	.result_area .data .device_list li a span{
		margin-right: 0rem;
	}
	
	.results_text_area li .h3_title.sub h3 {
		font-size: 2.8rem;
	}
	.results_text_area li .h3_title.sub p {
		font-size: 1.2rem;
	}

	.page_list li.bt a span {
		margin-right: 0.5rem;
	}
	.page_list li.bt.next a span {
		margin-left: 0.5rem;
	}
}

/*----------------------*/
/*PRIVACY POLICY*/

.policy_area{
	max-width: 130rem;
	margin: 0 auto 10rem;
}

.policy_area .box{
	margin-bottom: 5rem;
}

.policy_area .box p{
	margin: 1rem 3rem 4rem;
}

.policy_area h4{
	font-size: 3rem;
	font-weight: bold;
	border-bottom: 0.2rem solid #222;
	padding-bottom: 1rem;
	margin-bottom: 3rem;
}

.policy_area h5{
	font-size: 2rem;
	line-height: 3.5rem;
	font-weight: bold;
	margin-bottom: 3rem;
}

.policy_area h6{
	font-size: 1.8rem;
	font-weight: bold;
}

.policy_area .policy_top{
	margin-bottom: 5rem;
}

.policy_area .list_number{
	margin-bottom: 5rem;
	margin-left: 2.5rem;
	list-style-type: decimal-leading-zero;
}

.policy_area .list_number li{
	margin-bottom: 1rem;
}

.policy_area .list_dot{
	margin-bottom: 2rem;
	margin-left: 2.5rem;
	list-style-type: disc;
}

.policy_area .data{
	text-align: right;
	margin-bottom: 5rem;

}

.pmark_area{
	display: flex;
	align-items: center;
}

.pmark_area .pmark{
	margin-right: 4rem;
}

.pmark_area .link a{
	display: flex;
	align-items: center;
}

.pmark_area .link a span{
	margin-left: 1rem;
	font-size: inherit;
}

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

	.policy_all .policy_area{
		margin-left: 2rem;
		margin-right: 2rem;
	}

}

@media screen and ( max-width:768px ){
	.policy_area .list_number {
		margin-left: 3.8rem;
	}
}

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

	.policy_all{
		margin-bottom: 17rem;
	}

	.policy_area{
		margin: 0 auto 10rem;
		font-size: 1.3rem;
	}
	.policy_area h5 {
		font-size: 1.7rem;
		line-height: 3.5rem;
		margin-bottom: 1rem;
	}
	.policy_area h6 {
		font-size: 1.6rem;
	}
	.policy_area h4 {
		font-size: 2.1rem;
	}
	
	
	.pmark_area{
		flex-wrap: wrap;
	}

	.pmark_area .pmark {
		margin-right: 0;
		margin-bottom: 2rem;
		width: 12rem;
		margin: 0 auto 2rem;
	}
	
	.pmark_area .pmark img{
		width: 100%;
	}

}


/*----------------------*/
/*SITE MAP*/

.sitemap_area{
	max-width: 130rem;
	margin: 0 auto;
	flex-wrap: wrap;
}

.sitemap_area .sitemap_link{
	display: flex;
	flex-wrap: wrap;
	max-width: 100rem;
	margin: 0 auto;
}

.sitemap_area .sitemap_link li{
	width: 33%;
	padding: 3rem;
}

.sitemap_area .sitemap_link li a{
	color: #222;
}

.sitemap_area .sitemap_link li a::before{
	content: "keyboard_arrow_right";
	font-family: "Material Icons";
}

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

	.sitemap_area .sitemap_link li {
		width: 50%;
		padding: 0 0 3rem;
	}
	.sitemap_area .sitemap_link {
		margin-bottom: 16rem;
		font-size: 1.5rem;
	}

}


/*----------------------*/
/*RECRUIT*/

.recruit_important_text{
	max-width: 130rem;
	margin: 0 auto 4rem;
}

.profile_area.recruit .profile_list {
	max-width: 100%;
}

.profile_area.recruit .profile_list li h4 {
	max-width: 20%;
}

.profile_area.recruit .profile_list li div {
	max-width: 80%;
	font-size: 1.6rem; /*20210605追加*/
}

.profile_area.recruit .profile_list li div dl{

}

.profile_area.recruit .profile_list li div dl dd{
	display: flex;
}

.profile_area.recruit .profile_list li div dl dd span{
	margin-right: 0.5rem;
}

.profile_area.recruit.form {
	display: block;
	margin-bottom: 16rem;
}

.profile_area.recruit.form .profile_list li div {
	display: flex;
}

.profile_area.recruit.form .profile_list li div.privacy_area{
	max-width: 100%;
	display: block;
}

.profile_area.recruit.form .profile_list li div.privacy{
	display: block;
	border-bottom: none;

	padding: 0rem 3rem 1rem;
	max-width: 100%;
}

.profile_area.recruit.form .profile_list li div.privacy a{
	text-decoration: underline;
}

.profile_area.recruit.form .profile_list li div.agree{
	display: block;
	border-bottom: none;

	padding: 0 3rem 0;
	max-width: 100%;
}

.profile_area.recruit.form .profile_list li div input {
	font-size: 1.6rem;
	padding: 2rem 1.5rem;
	margin: 0 1rem;
}

.profile_area.recruit.form .profile_list li div textarea {
	font-size: 1.6rem;
	padding: 2rem 1.5rem;
	margin: 0 1rem;
}

.profile_area.recruit.form .contact_bt_form{
	text-align: center;
	margin-top: 10rem;
}

.profile_area.recruit.form input[type="submit"] {
	border-radius: 0;
	-webkit-box-sizing: content-box;
	-webkit-appearance: button;
	appearance: button;

	box-sizing: border-box;
	cursor : pointer;

	border: 3px solid #222;
	width: 30rem;
	height: 6rem;
	color: #222;
	font-size: 1.7rem;
	font-weight: bold;
	background: #fff;
}

.profile_area.recruit.form input[type="submit"]:hover {
	background: #222;
}


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

	.recruit_important_text{
		margin: 0 2rem 4rem;
	}
	.profile_area {
		margin: 0 2rem;
	}
}


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

	.profile_area.recruit .profile_list li h4 {
		max-width: 27%;
	}

	.profile_area.recruit .profile_list li div {
		max-width: 75%;
	}

}

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

	.profile_area.recruit .profile_list li div {
		max-width: 70%;
	}

}

@media screen and ( max-width:768px ){
	.profile_area.recruit .profile_list li h4 {
		max-width: 32%;
	}
}

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

	.recruit_important_text{
		font-size: 1.3rem;
	}

	.profile_area.recruit .profile_list li h4 {
		max-width: 100%;
		font-size: 1.8rem;
	}

	.profile_area.recruit .profile_list li div {
		max-width: 100%;
		flex-wrap: wrap;
	}

	.profile_area.recruit.form .profile_list li div.privacy{
		padding: 0rem 0rem 1rem;
		font-size: 1.4rem;
	}

	.profile_area.recruit.form .profile_list li div.agree {
		padding: 0 1rem 0;
	}

	.profile_area.recruit .profile_list {
		margin-bottom: 10rem;
	}
	.profile_area.recruit.form .profile_list li div input {
		margin: 0.5rem 1rem;
	}
	.mw_wp_form .error {
		margin: 0 1rem;
	}
}

.mw_wp_form .vertical-item + .vertical-item{
	margin-top: 0 !important;
}

/*----------------------*/
/*CONTACT*/

.profile_area.recruit.form.contact .profile_list li div.tel_area {
	display: flex;
	flex-wrap: wrap;
}

.profile_area.recruit.form.contact .profile_list li div.tel_area span {
	display: flex;
}

.profile_area.recruit.form.contact .profile_list li div.know {
	flex-wrap: wrap;
}

/*---*/

.profile_area.recruit.form.contact div p {
	margin: 0 1rem;
}

.profile_area.recruit.form.contact .custom-control-label::before {
/*
	width: 1.7rem;
	height: 1.7rem;
*/
}

.profile_area.recruit.form.contact .custom-control-label::after {
	width: 2.2rem;
	height: 2.2rem;
}

.profile_area.recruit.form.contact .custom-control-label {
	padding-left: 1rem;
}

.profile_area.recruit.form.contact select {
	font-size: 1.6rem;
	padding: 1rem 1.5rem;
	color: #222;
	height: auto;
}

.profile_area.recruit.form.contact select.requirement{
	width: 40rem;
}

.explanatory_text{
	text-align: center;
}

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

	.explanatory_text{
		font-size: 1.4rem;
	}

}

.contact_bt_form input{
	margin: 0 1rem;
}

/*-------------*/

.profile_area input.back:hover{
	background: #ccc;
}

.profile_area .btn-success{
	background-color: #008f40;
}

.profile_area input[type="submit"]{
	cursor:pointer
}

.profile_area input[type="submit"]:hover{
	background-color: #2AA579;
	border: none;
	color: #fff !important;
}

.profile_area a:focus{
	color: #80b8a6;
}

/*-------------*/

.mw_wp_form.mw_wp_form_complete p{
	text-align: center;
}

/*-----------*/

.profile_area label {
	line-height: 135%;
	position: relative;
	margin: 0.5rem;
	cursor: pointer;
}

.profile_area input[type="radio"],
.profile_area input[type="checkbox"] {
	position: relative;
	margin: 0 1rem 0 0;
	cursor: pointer;
}

.profile_area input[type="radio"]:before {
	position: absolute;
	z-index: 1;
	top: 0.2rem;
	left: 0.3rem;
	width: 1.2rem;
	height: 1.2rem;
	content: '';
	-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75);
	        transition:         transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75);
	-webkit-transform: scale(0, 0);
	        transform: scale(0, 0);
	border-radius: 50%;
	background: #008f40;
}

.profile_area input[type="checkbox"]:before {
	position: absolute;
	z-index: 1;
	top: 0.2rem;
	left: 0.3rem;
	width: 1.2rem;
	height: 1.2rem;
	content: '';
	-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75);
	        transition:         transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75);
	-webkit-transform: scale(0, 0);
	        transform: scale(0, 0);
	background: #008f40;
}

.profile_area input[type="radio"]:checked:before,
.profile_area input[type="checkbox"]:checked:before {
	-webkit-transform: scale(1, 1);
	        transform: scale(1, 1);
}

.profile_area input[type="radio"]:after {
	position: absolute;
	top: -0.25rem;
	left: -0.125rem;
	width: 2rem;
	height: 2rem;
	content: '';
	border: 1px solid #ccc;
	border-radius: 50%;
	background: #ffffff;
}

.profile_area input[type="checkbox"]:after {
	position: absolute;
	top: -0.25rem;
	left: -0.125rem;
	width: 2rem;
	height: 2rem;
	content: '';
	border: 1px solid #ccc;
	background: #ffffff;
}

.profile_area input::-webkit-input-placeholder {
	color: #ccc !important;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}
.profile_area input:-ms-input-placeholder {
	color: #ccc !important;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}
.profile_area input::-moz-placeholder {
	color: #ccc !important;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.mw_wp_form .error{
	width: 28rem;
	display: flex !important;
	align-items: center;
}

/*----------------------*/
/*NEWS*/

.entry-header h2.entry-title{
	font-size: 4rem;
	border-bottom: 0.2rem solid #222;
	padding-bottom: 1.5rem;
	margin-bottom: 2rem;
}

.single.navigation{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 130rem;
	margin: 1rem auto 1rem;
}

.entry-header  p.post-meta{
	font-size: 1.4rem;
}

article.entry{
	max-width: 100rem;
}

.entry-content .partnership_link a{
	font-weight: bold;
	color: #00a6ac;
}


/*-------------*/

article.entry .is-style-regular.adjustment{

}

article.entry .is-style-regular.adjustment table{
	border-top: 0.1rem solid #999;
	border-left: 0.1rem solid #999;
}

article.entry .is-style-regular.adjustment table th{
	background: #eee;
	border-right: 0.1rem solid #999;
	border-bottom: 0.1rem solid #999;
	padding: 0.5rem 1rem;
}

article.entry .is-style-regular.adjustment table td{
	border-right: 0.1rem solid #999;
	border-bottom: 0.1rem solid #999;
	padding: 0.5rem 1rem;
}

/*-------------*/

.news_list_page{
	max-width: 130rem !important;
	margin: 0 auto !important;
}

.profile_area.recruit.form .contact_bt_form {
	display: flex;
	justify-content: center;
}

.wp-block-image img {
	height: auto;
}

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

	.entry-header h2.entry-title{
		font-size: 2.2rem;
		line-height: normal;
	}

	.mwform-tel-field{
		display: flex;
		align-items: center;
	}

	.mwform-tel-field input{
		margin: 0 0.5rem !important;
		width: 28% !important;
	}
	
	.profile_area.recruit.form.contact select.requirement {
		width: 100%;
	}

}

/*-------------*/
/*-------------*/
/*-------------*/
/*-------------*/

/*----------------------*/
/*LIST 画像スクロール制御*/

.alm-reveal{
	display: flex;
	flex-wrap: wrap;
}

.alm-listing .alm-reveal>li{
	background: none;
	margin: 0;
	padding: inherit;
	position: relative;
	list-style: none;
	margin-bottom: 5rem;
	margin-right: 5rem;
}

.alm-listing .alm-reveal>li img{
	position: relative;
	border-radius: 0;
}

.alm-listing .alm-reveal>li p{
	margin: 0 2rem;
}

.alm-listing .alm-reveal>li:nth-child(3n) {
	margin-right: 0rem;
}

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

	.top_works_list {
		justify-content: left;
	}
	
	.top_works_list li {
		margin: 0 2% 5rem;
		width: 30%;
	}

	.top_works_list li img{
		width: 100%;
	}

}

/*--------*/

.hover_image {
	max-width: 400px;
	height: 18.6vw;
	overflow: hidden;
	max-height: 26rem;
}
.hover_image a.img_link {
	display: block;
	max-width: 400px;
	max-height: 260px;
	overflow: hidden;
}
.hover_image img {
	position: relative;
	vertical-align: top;
	transition: none !important;
	width: 400px;
}

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

	.hover_image a.img_link {
		max-height: 200px;
	}

}

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

	.top_works_list li {
		width: 100%;
		margin: 0 0 5rem;
	}

	.hover_image {
		height: 51vw;
	}

	.hover_image img{
		top: 0 !important;
	}

	.hover_image a.img_link {
		max-width: 100%;
		max-height: 212px;
	}

}

/*----------------------*/
/*ページネーション*/

.pagenate{
	display: none;
}


.page-numbers{
	margin: 0 auto;
	display: flex;
}

.page-numbers li{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4rem;
	height: 4rem;
	margin: 0 0.5rem;
	font-weight: bold;
}

.page-numbers span.page-numbers.current{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border: 0.3rem solid #ccc;
	color: #ccc;
}

.page-numbers a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: #060606;
	transition: all .2s;
}

.page-numbers a:hover{
	color: #fff;
	background: #060606;
	text-decoration: none;
}

.page-numbers a.page-numbers{
	border: 0.3rem solid #060606;
}

.page-numbers a.page-numbers.prev,
.page-numbers a.page-numbers.next{
	border: none;
}


/*----------------------*/
/*IEハック*/

_:-ms-lang(x)::-ms-backdrop, .top_works_list li {  width: 33.3333%; /*margin-right: 0;*/}
_:-ms-lang(x)::-ms-backdrop, .lowpage_title p{ margin-top: -0.6rem; }
_:-ms-lang(x)::-ms-backdrop, .about_list_area .list .area .box .text h4{ line-height: 6.5rem; }

_:-ms-lang(x)::-ms-backdrop, .about_list_area .list .area .box .text h4{ line-height: 6.5rem; }
_:-ms-lang(x)::-ms-backdrop, .about_list_area .list.area01 .area ,
_:-ms-lang(x)::-ms-backdrop, .about_list_area .list.area03 .area
{ display:-ms-flexbox; -ms-flex-pack: start; padding-left: 5vw; }

_:-ms-lang(x)::-ms-backdrop, .bt.pink .button{ padding-top: 1.7rem; }
_:-ms-lang(x)::-ms-backdrop, .bt.pink .button img{ margin-top: -1rem; margin-right: 1rem; }

_:-ms-lang(x)::-ms-backdrop, .about_list_area.company_top .list .area .box .text{ max-width: 63rem; }

_:-ms-lang(x)::-ms-backdrop, .profile_area .profile_list{ max-width: 70rem; }

_:-ms-lang(x)::-ms-backdrop, .graph_move{ justify-content: space-around; }

_:-ms-lang(x)::-ms-backdrop, .category_list.works .search_bt_wrap::before{ top: 3rem; left: 2.5vw; }
_:-ms-lang(x)::-ms-backdrop, .category_list.works .search_bt{ margin-top: 0.8rem; }

_:-ms-lang(x)::-ms-backdrop, .category_list.works .reset_bt{ padding-top: 0.8rem; }

_:-ms-lang(x)::-ms-backdrop, .bt .button{ padding: 0rem; }

_:-ms-lang(x)::-ms-backdrop, .column_area li a.category{ padding-top: 0.5rem; line-height: 0; }
_:-ms-lang(x)::-ms-backdrop, .news_list .text a.category{ padding-top: 0.5rem; line-height: 0; height: 3rem;}

_:-ms-lang(x)::-ms-backdrop, .map_form .form_btn{ padding-top: 0.8rem; }


_:-ms-lang(x)::-ms-backdrop, .page_list li.bt a{ padding-top: 0.6rem; }
_:-ms-lang(x)::-ms-backdrop, .page_list li.bt a span{ margin-top: -0.4rem; }


_:-ms-lang(x)::-ms-backdrop, body {
	text-rendering: optimizeLegibility;
	font-kerning: normal;
	font-variant-ligatures: common-ligatures contextual;
	font-feature-settings: "kern", "liga", "clig", "calt";
}

_:-ms-lang(x)::-ms-backdrop, .profile_area.recruit.form .profile_list li div input{ height: auto; }

_:-ms-lang(x)::-ms-backdrop, .category_list .search_bt_wrap::before { top: 1.5rem; }
_:-ms-lang(x)::-ms-backdrop, .category_list .search_bt_wrap { height: 8.5rem; }

_:-ms-lang(x)::-ms-backdrop, .category_list.works .search_bt_wrap { height: 11.1rem; }


/*----------------------*/
/*safariハック*/

_::-webkit-full-page-media, _:future, :root .policy_area .list_number { margin-left: 3.5vrem; }
/*
_::-webkit-full-page-media, _:future, :root .profile_area input[type="radio"] { margin-top: -1rem; }
_::-webkit-full-page-media, _:future, :root .profile_area input[type="radio"]:before { display: none; }
_::-webkit-full-page-media, _:future, :root .profile_area input[type="radio"]:after { display: none; }
*/
_::-webkit-full-page-media, _:future, :root .lowpage_title p { margin-top: 0.2rem; }

_::-webkit-full-page-media, _:future, :root .category_list.works .search_bt_wrap:before { top: 2.7rem; }

@media screen and ( max-width:768px ){
	_::-webkit-full-page-media, _:future, :root .lowpage_title p { margin-top: -0.8rem; }
}

@media screen and ( max-width:700px ){
	_::-webkit-full-page-media, _:future, :root .lowpage_title p { margin-top: -1rem; }
	_::-webkit-full-page-media, _:future, :root .category_list.works .search_bt_wrap:before { margin-top: -0.5rem; }
	
	_::-webkit-full-page-media, _:future, :root .category_list .search_bt_wrap:before { margin-top: -0.7rem; }
}

_::-webkit-full-page-media, _:future, :root .mwform-radio-field label{
	display: flex;
	align:ites;
	padding-left: 1rem;
	margin-top: -1rem;
	display: flex;
	align-items: center;
}

_::-webkit-full-page-media, _:future, :root .category_list .search_bt_wrap::before { top: 2rem; }



/*
_::-webkit-full-page-media, _:future, :root .profile_area input[type="radio"]:before { top: 0.6rem; width: 2rem; height: 2rem;}
_::-webkit-full-page-media, _:future, :root .profile_area input[type="radio"]:after { top: 0.5rem; width: 3rem; height: 3rem;}
*/

@media screen and (min-width:500px) and ( max-width:700px) {

	.catch_area{
		max-width: 130rem;
		margin: 0 auto;
		position: relative;
		z-index: 5;
	}

	.catch{
		position: absolute;
		top: 21vh;
		z-index: 7;
	}

	.catch h2{
		font-weight: bold;
		color: #fff;
		position: relative;
		
		font-size: 7.5vh;
		line-height: 11vh;
		padding-bottom: 5vh;
		margin-bottom: 6.5vh;
	}

	.catch h2:before {
		content: "";
		display: block;
		border-bottom: 3px solid #fff;
		width: 25rem;
		position: absolute;
		bottom: 0;
		left: 0;
	}

	.catch p{
		font-weight: bold;
		color: #fff;
		
		font-size: 3.2vh;
	}
	
	.about_list li.cross img {
		width: 9%;
	}
	
	.mainvisual .pc{ display: block; }
	.mainvisual .sp{ display: none; }

}

/* reCAPTCHA v3　表示位置 */
.grecaptcha-badge{
	margin-bottom: 6rem;
}

