@charset "utf-8";
/* -----------------------------------------------------------------------

layout.css

----------------------------------------------------------------------- */
.logo a:hover { opacity: 0.5;}


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

	mainimg

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

#mainimg {
	width:100%;
	height:860px;
	background-position:50% 0%;
	background-repeat:no-repeat;
}
#staff #mainimg {
	background-image:url(../img/staff/mainimg.jpg);
	background-color:#c1bcb9;
	background-size:cover;
}
#client #mainimg {
	background-image:url(../img/client/2021/mainimg.jpg);
	background-color:#c1bcb9;
	background-size:cover;
	background-position: center center;
	height:600px;
}

#mainimg h1{
	padding-top:200px;
	font-size:4.2rem;
	line-height:1.8em;
	text-align:center;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	letter-spacing:0.05em;
	text-shadow: 0 0 15px rgba(235,235,235,1);
}
#mainimg .registBtn {
	margin:35px auto 0;
}

#mainimg #point{
	width:940px;
	margin:50px auto 0;
	padding:0 10px;
	overflow:hidden;
}
#mainimg #point li{
	width:240px;
	height:240px;
	margin:0 0 0 100px;
	padding-top:130px;
	font-size:1.6rem;
	line-height:1.8em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	text-align:center;
	letter-spacing:0.1em;
	background:rgb(255,255,255);
	filter:alpha(opacity=85); 
	background:rgba(255,255,255,0.85);
	border-radius:120px;
	float:left;
	box-shadow:0 0 10px 0 rgba(0,0,0,0.1);
	box-sizing:border-box;
}
#mainimg #point li:first-child{
	margin-left:0;
}

#mainimg #point li.point01{
	background-image:url(../img/common/point_icon01.png);
	background-position:50% 42px;
	background-repeat:no-repeat;
}
#mainimg #point li.point02{
	background-image:url(../img/common/point_icon02.png);
	background-position:50% 42px;
	background-repeat:no-repeat;
}
#mainimg #point li.point03{
	background-image:url(../img/common/point_icon03.png);
	background-position:50% 42px;
	background-repeat:no-repeat;
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

@media screen and (min-width: 767px) and  (max-width: 1060px) {

	#mainimg {
		width:100%;
		height:580px;
	}
	#client #mainimg {
		background-image:url(../img/client/2021/mainimg.jpg);
		background-size:100% auto;
		height:500px;
	}
	#mainimg h1{
		padding-top:170px;
		font-size:3.4rem;
		line-height:1.8em;
	}
	#mainimg h1 .sp{
		display: none;
	}
	#gnav .logo {
		width: auto;
		margin: 0 auto 0;
		text-align: center;
		float: none;
	}
	#gnav .logo p {
		font-size: 1.2rem;
		line-height: 1.2em;
		margin: 0 0 0px 0;
	}
	#gnav .logo img {
		width: 340px;
	}
}




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

#mainimg {
	width:100%;
	height:580px;
}
#staff #mainimg {
	background-image:url(../img/staff/mainimg.jpg);
	background-size:240% auto;
}
#client #mainimg {
	background-image:url(../img/client/2021/mainimg.jpg);
	background-size:100% auto ;
	background-position: right bottom;
	height:390px;
}

#mainimg h1{
	padding-top:110px;
	font-size:2.3rem;
	line-height:1.8em;
}
#mainimg .registBtn {
	margin:20px auto 0;
}

#mainimg #point{
	width:100%;
	margin:35px auto 0;
	padding:0 1px;
	overflow:hidden;
	text-align:center;
	box-sizing:border-box;
}
#mainimg #point li{
	width:32.83%;
	height:135px;
	margin:0 0.25%;
	padding-top:70px;
	font-size:1.1rem;
	line-height:1.6em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	text-align:center;
	letter-spacing:0;
	border-radius:5px;
	box-shadow:none;
}
#mainimg #point li:first-child{
	margin:0 0.25%;
}

#mainimg #point li.point01{
	background-image:url(../img/common/point_icon01.png);
	background-position:50% 15px;
	background-size:90px auto;
	background-repeat:no-repeat;
}
#mainimg #point li.point02{
	background-image:url(../img/common/point_icon02.png);
	background-position:50% 15px;
	background-size:90px auto;
	background-repeat:no-repeat;
}
#mainimg #point li.point03{
	background-image:url(../img/common/point_icon03.png);
	background-position:50% 15px;
	background-size:90px auto;
	background-repeat:no-repeat;
}

}

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

	#client #mainimg {
		background-image:url(../img/client/2021/mainimg.jpg);
		background-size: auto 100%;
		background-position: center center;
		height:400px;
	}
}



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

	contents

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

.contents {
	margin-top:-120px;
	padding:120px 0 0;
	background:url(../img/common/bg_gray_top.png) no-repeat 50% 0;
	background-size:120% 200px;
}
.bgGray {
	background:#eeeeee;
}
.bgWhite {
	background:#ffffff;
}
.contents .inner {
	min-width:1060px;
	margin:0 auto;
	padding:0 30px;
	box-sizing:border-box;
}
.contents .inner02 {
	min-width:1060px;
	margin:0 auto;
	padding:0 30px 80px;
	box-sizing:border-box;
}

.engTTL {
	width:90%;
	max-width:480px;
	margin:0 auto;
	font-size:6.4rem;
	line-height:80px;
	letter-spacing:0.05em;
	text-align:center;
	font-family:"Helvetica Neue", Arial;
	font-weight:bold;
	border-bottom:1px solid #111111;
}
.engTTL em {
	font-size:7.2rem;
	line-height:80px;
	color:#e72c30;
	letter-spacing:0.05em;
}
.cTTL {
	padding:10px 0 30px;
	font-size:1.8rem;
	line-height:1.8em;
	font-weight:700;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing:0.1em;
	text-align:center;
}
.cTTL02 {
	padding:10px 0 30px;
	font-size:2.4rem;
	line-height:1.8em;
	font-weight:700;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing:0.1em;
	text-align:center;
}
.cTTL03 {
	padding:10px 0 30px;
	font-size:2.0rem;
	line-height:1.8em;
	font-weight:normal;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing:0.1em;
	text-align:center;
}
.subTTL {
	width:80%;
	max-width:390px;
	margin:0 auto;
	padding:0;
	font-size:1.8rem;
	line-height:48px;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing:0.1em;
	text-align:center;
	color:#ffffff;
	background-color:#333333;
	position: relative;
}
.subTTL::before{
	margin:0 auto;
	content: '';
	position: absolute;
	left:0;
	right:0;
	bottom: -13px;
	display: block;
	width: 0;
	height: 0;
	border-right: 9px solid transparent;
	border-top: 13px solid #333333;
	border-left: 9px solid transparent;
}
.readBox {
	margin:0 auto;
	width:90%;
	max-width:780px;
	text-align:left;
}
.readBox .catchcopy{
	font-size:2.6rem;
	line-height:2em;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:500;
}
.readBox .txt{
	font-size:1.6rem;
	line-height:2.2em;
}
.readBox02 {
	margin:0 auto;
	width:90%;
	max-width:660px;
	text-align:left;
}
.readBox02 .catchcopy{
	font-size:2.6rem;
	line-height:2em;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:500;
}
.readBox02 .txt{
	font-size:1.6rem;
	line-height:2.2em;
}
.readBox03 {
	margin:0 auto;
	width:90%;
	max-width:840px;
	text-align:left;
}
.readBox03 .catchcopy{
	font-size:2.6rem;
	line-height:2em;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:500;
}
.readBox03 .txt{
	font-size:1.6rem;
	line-height:2.2em;
}

@media screen and (min-width: 767px) and  (max-width: 1060px) {

	.contents .inner {
		width:100%;
		min-width:320px;
		padding:0 20px;
	}
	.contents .inner02 {
		width:100%;
		min-width:320px;
		padding:0 20px 50px;
	}
	
	.cTTL03 {
		padding:10px 0 10px;
		font-size:1.6rem;
		line-height:1.8em;
	}

}




/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

.contents {
	margin-top:-100px;
	padding:80px 0 0;
	background:url(../img/common/bg_gray_top.png) no-repeat 50% 0;
	background-size:250% 200px;
}
.contents .inner {
	width:100%;
	min-width:320px;
	padding:0 20px;
}
.contents .inner02 {
	width:100%;
	min-width:320px;
	padding:0 15px 50px;
}

.engTTL {
	font-size:4.2rem;
	line-height:64px;
}
.engTTL em {
	font-size:5.8rem;
	line-height:75px;
}
.cTTL {
	padding:8px 0 30px;
	font-size:1.6rem;
	line-height:1.8em;
}
.cTTL02 {
	padding:8px 0 30px;
	font-size:1.6rem;
	line-height:1.6em;
}
.cTTL03 {
	padding:8px 0 30px;
	font-size:2.0rem;
	line-height:1.8em;
	font-weight:normal;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing:0.1em;
	text-align:center;
}
.subTTL {
	font-size:1.6rem;
	line-height:42px;
}
.readBox {
	width:100%;
}
.readBox .catchcopy{
	font-size:1.8rem;
	line-height:2em;
	letter-spacing:0.1em;
}
.readBox .txt{
	font-size:1.4rem;
	line-height:2em;
}
.readBox02 {
	width:100%;
}
.readBox02 .catchcopy{
	font-size:1.8rem;
	line-height:2em;
	letter-spacing:0.1em;
}
.readBox02 .txt{
	font-size:1.6rem;
	line-height:2em;
}
.readBox03 {
	width:100%;
}
.readBox03 .catchcopy{
	font-size:1.8rem;
	line-height:2em;
	letter-spacing:0.1em;
}
.readBox03 .txt{
	font-size:1.6rem;
	line-height:2em;
}

}




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

	point

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

#point {
	padding-bottom: 180px;
	box-sizing:border-box;
}

#step {
	margin-top:40px;
	width:100%;
}
#step li{
	width:21%;
	margin:0 0 0 5.33%;
	padding:20px;
	background:#ffffff;
	box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);
	float:left;
	box-sizing:border-box;
	position: relative;
}
#step li:first-child{
	margin:0;
}
#step li .number {
	font-size:24px;
	line-height:1.5em;
	color:#e72c30;
	font-family:"Helvetica Neue",Arial;
	font-weight:500;
	text-align:center;
}
#step li .number em{
	margin-left:5px;
	font-size:1.5em;
	line-height:1.5em;
	display:inline-block;
}
#step li .ttl {
	font-size:1.6rem;
	line-height:1.8em;
	letter-spacing:0.05em;
	text-align:center;
}
#step li .img {
	margin:8px 0 10px;
	text-align:center;
}
#step li .img img {
	width:auto;
	height:63px;
}
#step li .txt {
	font-size:1.4rem;
	line-height:1.8em;
}


#point .pointList {
	width:1060px;
	margin:0 auto;
	padding:5px 50px 0;
	box-sizing:border-box;
	overflow:hidden;
}
#point .pointList.pointbox {
	padding:20px 50px 0;
}
#point .pointList li{
	width:28%;
	padding-top:80px;
	margin-left:8%;
	float:left;
}
#point .pointList li.point01{
	background:url(../img/client/icon_point01.png) no-repeat 50% 0;
	background-size:66px auto;
}
#point .pointList li.point02{
	background:url(../img/client/icon_point02.png) no-repeat 50% 0;
	background-size:66px auto;
}
#point .pointList li.point03{
	background:url(../img/client/icon_point03.png) no-repeat 50% 0;
	background-size:66px auto;
}
#point .pointList li.point04{
	background:url(../img/client/icon_point04.png) no-repeat 50% 0;
	background-size:66px auto;
	margin-top: 40px;
}
#point .pointList li.point05{
	background:url(../img/client/icon_point05.png) no-repeat 50% 0;
	background-size:66px auto;
	margin-top: 40px;
}
#point .pointList li:first-child{
	margin-left:0;
}
#point .pointList li:nth-of-type(4){
	margin-left:0;
}
#point .pointList li .ttl{
	font-size:2.8rem;
	line-height:1.5em;
	text-align:center;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:700;
}
#point .pointList li .txt{
	margin:20px 0 0;
	font-size:1.6rem;
	line-height:2em;
}


#point .pointList li.point01u{
	padding-top:0px;
}
#point .pointList li.point02u{
	padding-top:0px;
}
#point .pointList li.point03u{
	padding-top:0px;
}
#point .pointList li .ttl_point01u,
#point .pointList li .ttl_point02u,
#point .pointList li .ttl_point03u{
	font-size:2.8rem;
	line-height:1.5em;
	text-align:center;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:700;
	padding-bottom:80px;
}
#point .pointList li .ttl_point01u{
	background:url(../img/client/icon_point01.png) no-repeat 50% 100%;
	background-size:66px auto;
}
#point .pointList li .ttl_point02u{
	background:url(../img/client/icon_point02.png) no-repeat 50% 100%;
	background-size:66px auto;
}
#point .pointList li .ttl_point03u{
	background:url(../img/client/icon_point03.png) no-repeat 50% 100%;
	background-size:66px auto;
}

@media screen and (min-width: 767px) and  (max-width: 1060px) {

	#point .pointList {
		width:100%;
		margin:0 auto;
		padding:0 20px 0;
	}
	#point .pointList.pointbox {
		padding:20px 50px 0;
	}
	#point .pointList li{
		width:28%;
		padding-top:80px;
		margin-left:8%;
		float:left;
	}
	#point .pointList li.point01{
		background:url(../img/client/icon_point01.png) no-repeat 50% 0;
		background-size:66px auto;
	}
	#point .pointList li.point02{
		background:url(../img/client/icon_point02.png) no-repeat 50% 0;
		background-size:66px auto;
	}
	#point .pointList li.point03{
		background:url(../img/client/icon_point03.png) no-repeat 50% 0;
		background-size:66px auto;
	}
	#point .pointList li.point04{
		background:url(../img/client/icon_point04.png) no-repeat 50% 0;
		background-size:66px auto;
		margin-top: 40px;
	}
	#point .pointList li.point05{
		background:url(../img/client/icon_point05.png) no-repeat 50% 0;
		background-size:66px auto;
		margin-top: 40px;
	}
	#point .pointList li:first-child{
		margin-left:0;
	}
	#point .pointList li:nth-of-type(4){
		margin-left:0;
	}
	#point .pointList li .ttl{
		font-size:2.8rem;
		line-height:1.5em;
		text-align:center;
		letter-spacing:0.1em;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:700;
	}
	#point .pointList li .txt{
		margin:20px 0 0;
		font-size:1.6rem;
		line-height:2em;
	}


	#point .pointList li.point01u,
	#point .pointList li.point02u,
	#point .pointList li.point03u{
		display: table;
		width: 100%;
		padding-top:0px;
		margin: 0 0 30px 0;
	}
	#point .pointList li.point03u{
		margin: 0 0 0px 0;
	}
	#point .pointList li .ttl_point01u,
	#point .pointList li .ttl_point02u,
	#point .pointList li .ttl_point03u{
		display: table-cell;
		width: 15%;
		font-size:2.4rem;
		line-height:1.5em;
		text-align:center;
		letter-spacing:0.1em;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:700;
		padding-bottom:70px;
	}
	#point .pointList li .ttl_point01u{
		background:url(../img/client/icon_point01.png) no-repeat 50% 100%;
		background-size:66px auto;
	}
	#point .pointList li .ttl_point02u{
		background:url(../img/client/icon_point02.png) no-repeat 50% 100%;
		background-size:66px auto;
	}
	#point .pointList li .ttl_point03u{
		background:url(../img/client/icon_point03.png) no-repeat 50% 100%;
		background-size:66px auto;
	}

	#point .pointList li.point01u .txt,
	#point .pointList li.point02u .txt,
	#point .pointList li.point03u .txt{
		display: table-cell;
		vertical-align: middle;
		font-size: 2.0rem;
		padding: 0 3% 0 0;
	}
		
}


/*----------------------------------------------------------
	Display：max → 768px（ pc ）
----------------------------------------------------------*/

@media screen and (min-width: 767px) {

#step li:not(:first-child)::before{
	margin:auto 0;
	content: '';
	position: absolute;
	left:-32px;
	top:0;
	bottom:0;
	display: block;
	width: 0;
	height: 0;
	border-top: 9px solid transparent;
	border-left: 13px solid #e54d50;
	border-bottom: 9px solid transparent;
}

}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#point {
	width:100%;
	padding:0 2.5% 200px;
}

#step {
	margin-top:30px;
}
#step li,
#step li:first-child{
	width:100%;
	margin:0 0 50px;
	padding:15px 25px 25px;
	float:none;
}
#step li:not(:first-child)::before{
	margin:0 auto;
	content: '';
	position: absolute;
	left:0;
	right:0;
	top:-34px;
	display: block;
	width: 0;
	height: 0;
	border-left: 13px solid transparent;
	border-top: 20px solid #e54d50;
	border-right: 13px solid transparent;
}
#step li .img {
	margin:8px 0;
}
#step li .img img {
	width:auto;
	height:80px;
}
#step li .txt {
	font-size:1.4rem;
	line-height:1.8em;
}


#point .pointList {
	width:100%;
	padding:5px 2.5% 0;
}
#point .pointList.pointbox {
	padding:20px 2.5% 0;
}
#point .pointList li,
#point .pointList li:first-child{
	width:100%;
	margin:0 0 30px;
	padding:76px 0 20px;
	float:none;
	border-bottom:1px dotted #999999;
}
#point .pointList li.point01{
	background:url(../img/client/icon_point01.png) no-repeat 50% 0;
	background-size:66px auto;
}
#point .pointList li.point02{
	background:url(../img/client/icon_point02.png) no-repeat 50% 0;
	background-size:66px auto;
}
#point .pointList li.point03{
	background:url(../img/client/icon_point03.png) no-repeat 50% 0;
	background-size:66px auto;
}
#point .pointList li:first-child{
	margin-left:0;
}
#point .pointList li .ttl{
	font-size:2.4rem;
	line-height:1.5em;
}
#point .pointList li .txt{
	margin:15px 0 0;
	font-size:1.6rem;
	line-height:1.8em;
}

#point .pointList li.point01u{
	padding-top:0px;
}
#point .pointList li.point02u{
	padding-top:0px;
}
#point .pointList li.point03u{
	padding-top:0px;
}
#point .pointList li .ttl_point01u,
#point .pointList li .ttl_point02u,
#point .pointList li .ttl_point03u{
	font-size:2.4rem;
	line-height:1.5em;
	text-align:center;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:700;
	padding-bottom:80px;
}
#point .pointList li .ttl_point01u{
	background:url(../img/client/icon_point01.png) no-repeat 50% 100%;
	background-size:66px auto;
}
#point .pointList li .ttl_point02u{
	background:url(../img/client/icon_point02.png) no-repeat 50% 100%;
	background-size:66px auto;
}
#point .pointList li .ttl_point03u{
	background:url(../img/client/icon_point03.png) no-repeat 50% 100%;
	background-size:66px auto;
}

}




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

	contentsImage01

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

#contentsImage01 {
	position:relative;
	overflow:hidden;
	margin:-160px 0 0;
	padding:0;
}
#contentsImage01:before {
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	width:105%;
	height:300px;
	margin:0 -2.5%;
	background:url(../img/staff/contents_image01.jpg) no-repeat 50% 50% ;
	background-size:cover;
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transform: rotate(-4.5deg);
	-ms-transform: rotate(-4.5deg);
	transform: rotate(-4.5deg);
	z-index: 10;
}
#contentsImage01 div {
	box-sizing: boder-box;
	width: 100%;
	max-width:1060px;
	height: 300px;
	margin: 0 auto;
	padding: 60px 10px;
	color: #fff;
	text-align: center;
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#contentsImage01 {
	position:relative;
	overflow:hidden;
	margin:-160px 0 0;
	padding:0;
}
#contentsImage01:before {
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	width:105%;
	height:180px;
	margin:0 -2.5%;
	background:url(../img/staff/contents_image01.jpg) no-repeat 50% 50% ;
	background-size:cover;
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transform: rotate(-4.5deg);
	-ms-transform: rotate(-4.5deg);
	transform: rotate(-4.5deg);
	z-index: 10;
}
#contentsImage01 div {
	height: 160px;
	padding: 60px 10px;
}

}




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

	about service

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

#about {
	width:1060px;
	margin:0 auto;
}

#about .zu_image01 {
	width:100%;
	max-width:905px;
	margin:40px auto 0;
}
#about .zu_image02 {
	width:100%;
	max-width:970px;
	margin:0 auto 10px;
}

#service .zu_image01 {
	width:100%;
	max-width:906px;
	margin:40px auto 0;
}
#service .zu_image02 {
	width:100%;
	max-width:970px;
	margin:0 auto 10px;
}

@media screen and (min-width: 767px) and  (max-width: 1060px) {
	#service .zu_image01 {
		width:100%;
		max-width:906px;
		margin:20px auto 0;
		padding: 0 40px;
		box-sizing: border-box;
	}
	#service .zu_image02 {
		width:100%;
		max-width:970px;
		margin:0 auto 10px;
		padding:20px 40px 30px;
		box-sizing: border-box;
		text-align: center;
	}
	#service .zu_image02 img{
		width:80%;
	}
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#about {
	width:95%;
	margin:-40px auto 0;
}

#about .zu_image01 {
	max-width:580px;
	margin:20px auto 0;
}
#service .zu_image01 {
	max-width:580px;
	margin:20px auto 0;
}
#about .zu_image02 {
	max-width:420px;
	margin:30px auto 35px;
}
#service .zu_image02 {
	max-width:420px;
	margin:30px auto 35px;
}

}




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

	contentsImage02

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

#contentsImage02 {
	position:relative;
	overflow:hidden;
	margin:30px 0 0;
	padding:0;
}
#contentsImage02:before {
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	width:105%;
	height:300px;
	margin:0 -2.5%;
	background:url(../img/staff/contents_image02.jpg) no-repeat 50% 50% ;
	background-size:cover;
	-webkit-transform-origin: left center;
	-ms-transform-origin: left center;
	transform-origin: left center;
	-webkit-transform: rotate(4.5deg);
	-ms-transform: rotate(4.5deg);
	transform: rotate(4.5deg);
	z-index: 10;
}
#contentsImage02 div {
	box-sizing: boder-box;
	width: 100%;
	max-width:1060px;
	height: 300px;
	margin: 0 auto;
	padding: 60px 10px;
	color: #fff;
	text-align: center;
}


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

#contentsImage02 {
	position:relative;
	overflow:hidden;
	margin:30px 0 0;
	padding:0;
}
#contentsImage02:before {
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	width:105%;
	height:180px;
	margin:0 -2.5%;
	background:url(../img/staff/contents_image02.jpg) no-repeat 50% 50% ;
	background-size:cover;
	-webkit-transform-origin: left center;
	-ms-transform-origin: left center;
	transform-origin: left center;
	-webkit-transform: rotate(4.5deg);
	-ms-transform: rotate(4.5deg);
	transform: rotate(4.5deg);
	z-index: 10;
}
#contentsImage02 div {
	height: 160px;
	padding: 60px 10px;
}

}




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

	service

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

#service {
	width:100%;
	margin:0 auto;
	margin: -160px 0 0;
	padding:160px 0 80px;
	box-sizing:border-box;
}
#service .serviceList {
	width:1060px;
	margin:0 auto;
	padding:5px 50px;
	box-sizing:border-box;
	overflow:hidden;
}
#service .serviceList li{
	width:28%;
	padding-top:125px;
	margin-left:8%;
	float:left;
}
#service .serviceList li.service01{
	background:url(../img/staff/service_icon01.png) no-repeat 50% 0;
	background-size:110px auto;
}
#service .serviceList li.service02{
	background:url(../img/staff/service_icon02.png) no-repeat 50% 0;
	background-size:110px auto;
}
#service .serviceList li.service03{
	background:url(../img/staff/service_icon03.png) no-repeat 50% 0;
	background-size:110px auto;
}
#service .serviceList li:first-child{
	margin-left:0;
}
#service .serviceList li .ttl{
	font-size:1.8rem;
	line-height:1.5em;
	text-align:center;
	letter-spacing:0.1em;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
}
#service .serviceList li .txt{
	margin:20px 0;
	font-size:1.4rem;
	line-height:2em;
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#service {
	width:100%;
	margin: -100px 0 0;
	padding:50px 2.5% 50px;
}
#service .serviceList {
	width:100%;
	padding:5px 0;
}
#service .serviceList li{
	width:100%;
	margin:40px auto;
	padding:125px 0 40px;
	float:none;
	border-bottom:1px dotted #999999;
}
#service .serviceList li:first-child{
	margin:0 auto 40px;
}

}




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

	contact

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

#contact {
	margin:0;
	padding:25px  ;
	background:#222222;
	color:#ffffff;
	text-align:center;
}
#contact h2{
	margin:0 0 5px;
	font-size:1.6rem;
	line-height:1.5em;
	letter-spacing:0.1em;
	color:#ffffff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:500;
}
#contact .tel{
	padding-left:35px;
	font-size:3.2rem;
	line-height:43px;
	color:#ffffff;
	text-decoration:none;
	font-family:"Helvetica Neue", Arial;
	font-weight:bold;
	letter-spacing:0.1em;
	background:url(../img/common/icon_tel.png) no-repeat 0 50%;
	background-size:30px auto;
	display:inline-block;
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#contact h2{
	font-size:1.4rem;
	line-height:1.5em;
}
#contact .tel{
	font-size:2.8rem;
	line-height:36px;
	background:url(../img/common/icon_tel.png) no-repeat 0 50%;
	background-size:24px auto;
}

}




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

	contentsImage01

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

#contentsImage03 {
	position:relative;
	overflow:hidden;
	margin:-160px 0 0;
	padding:0;
}
#contentsImage03:before {
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	width:105%;
	height:300px;
	margin:0 -2.5%;
	background:url(../img/client/contents_image03.jpg) no-repeat 50% 50% ;
	background-size:cover;
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transform: rotate(-4.5deg);
	-ms-transform: rotate(-4.5deg);
	transform: rotate(-4.5deg);
	z-index: 10;
}
#contentsImage03 div {
	box-sizing: boder-box;
	width: 100%;
	max-width:1060px;
	height: 300px;
	margin: 0 auto;
	padding: 60px 10px;
	color: #fff;
	text-align: center;
}


/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

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

#contentsImage03 {
	position:relative;
	overflow:hidden;
	margin:-160px 0 0;
	padding:0;
}
#contentsImage03:before {
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	width:105%;
	height:180px;
	margin:0 -2.5%;
	background:url(../img/client/contents_image03.jpg) no-repeat 50% 50% ;
	background-size:cover;
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transform: rotate(-4.5deg);
	-ms-transform: rotate(-4.5deg);
	transform: rotate(-4.5deg);
	z-index: 10;
}
#contentsImage03 div {
	height: 160px;
	padding: 60px 10px;
}

}




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

	Display：print

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

@media print{
#gnav { position:static; }
#spNav { display:none; }
.sp{ display:none; }

}





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

	2021/01 追加

----------------------------------------------------------*/
#gnav{

}
.flow01{ 
	clear: both;
	width: 90%;
	max-width: 840px;
	margin: 0 auto;
	border: 2px solid #e72c30;
	position: relative;
	box-sizing: border-box;
	padding: 0 8px 0 0;
}
.flow01 h3 {
	position: relative;
	padding: 0 65px;
	text-align: center;
}
.flow01 h3:before {
}
.flow01 h3 span {
    position: absolute;
    top: -24px;
    left: 50%;
    width: 56%;
    display: block;
    margin: 0px 0 0 -29%;
    background: #eeeeee;
    font-size: 2.4rem;
    line-height: 1.8em;
    font-weight: 700;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.1em;
    text-align: center;
    color: #e72c30;
}
.flow01 .flow01body_pc {
	clear: both;
	padding: 45px 30px 30px;
}
.flow01 .flow01body_pc .step{
	list-style-type: none;
	display:table;
	width:100%;
	padding:0;
	margin:0;
}
.flow01 .flow01body_pc .step li{
	display:table-cell;
	position:relative;
	background: #e72c30;
	padding: 1em 2em 1em 2em;
	color: #fff;
	box-sizing:border-box;
	width:33.3333%;
	text-align: center;
	font-weight: 700;
}
.flow01 .flow01body_pc .step li.step01:after{
	content:url(../img/client/2021/steparrow01.png);
	position: absolute;
	top: 50%;
	right: 0%;
	width: 22px;
	height: 64px;
	margin:-32px -11px 0 0;
	z-index: 5000;
}
.flow01 .flow01body_pc .step li.step02:after{
	content:url(../img/client/2021/steparrow02.png);
	position: absolute;
	top: 50%;
	right: 0%;
	width: 22px;
	height: 64px;
	margin:-32px -11px 0 0;
}
.flow02{ 
	clear: both;
	width: 90%;
	max-width: 840px;
	margin: 0 auto 30px;
	border: 2px solid #333;
	position: relative;
	box-sizing: border-box;
	padding: 0 8px 0 0;
}
.flow02 h3 {
	position: relative;
	padding: 0 65px;
	text-align: center;
}
.flow02 h3:before {
}
.flow02 h3 span {
    position: absolute;
    top: -24px;
    left: 50%;
    width: 66%;
    display: block;
    margin: 0px 0 0 -33%;
    background: #eeeeee;
    font-size: 2.4rem;
    line-height: 1.8em;
    font-weight: 700;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.1em;
    text-align: center;
    color: #333;
}
.flow02 .flow01body_pc {
	clear: both;
	padding: 45px 30px 30px;
}
.flow02 .flow01body_pc .step{
	list-style-type: none;
	display:table;
	width:100%;
	padding:0;
	margin:0;
}
.flow02 .flow01body_pc .step li{
	display:table-cell;
	position:relative;
	background: #333;
	padding: 1em 2em 1em 2em;
	color: #fff;
	box-sizing:border-box;
	width:33.3333%;
	text-align: center;
	font-weight: 700;
}
.flow02 .flow01body_pc .step li.step01:after{
	content:url(../img/client/2021/steparrow03.png);
	position: absolute;
	top: 50%;
	right: 0%;
	width: 22px;
	height: 64px;
	margin:-32px -11px 0 0;
	z-index: 5000;
}
.flow02 .flow01body_pc .step li.step02:after{
	content:url(../img/client/2021/steparrow04.png);
	position: absolute;
	top: 50%;
	right: 0%;
	width: 22px;
	height: 64px;
	margin:-32px -11px 0 0;
}
.flow03{ 
	clear: both;
	width: 90%;
	max-width: 840px;
	margin: 0 auto 30px;
	position: relative;
	box-sizing: border-box;
	padding: 0 8px 0 0;
}
.flow03 .flow01body_pc {
	display: block;
	clear: both;
	padding: 25px 0 30px;
}
.flow03 .flow01body_sp {
	display: none;
}
.flow03 .flow01body_pc .step{
	list-style-type: none;
	display:table;
	width:100%;
	padding:0;
	margin:0;
}
.flow03 .flow01body_pc .step li{
	display:table-cell;
	position:relative;
	background: #e72c30;
	padding: 1em 2em 1em 2em;
	color: #fff;
	box-sizing:border-box;
	width:20%;
	text-align: center;
	font-weight: 700;
}
.flow03 .flow01body_pc .step li.step01:after{
	content:url(../img/client/2021/steparrow05.png);
	position: absolute;
	top: 50%;
	right: 0%;
	width: 22px;
	height: 64px;
	margin:-32px -11px 0 0;
	z-index: 5000;
}
.flow03 .flow01body_pc .step li.step02:after{
	content:url(../img/client/2021/steparrow06.png);
	position: absolute;
	top: 50%;
	right: 0%;
	width: 22px;
	height: 64px;
	margin:-32px -11px 0 0;
}
.flow03 .flow01body_pc .steptxt{
	list-style-type: none;
	display:table;
	width:100%;
	padding:0;
	margin:0;
}
.flow03 .flow01body_pc .steptxt li{
	display:table-cell;
	padding: 1em 1em 1em 1em;
	width:20%;
}

.arrowbox01{
	position: relative;
	padding:80px 0 0;
}
.arrowbox01::after {
	content: ' ';
	position: absolute;
	left: 50%;
	top: 25px;
	width: 0;
	height: 0;
	border: none;
	border-top: 35px solid #e72c30;
	border-right: 40px solid transparent;
	border-left: 40px solid transparent;
	margin: 0 0 0 -40px;
}

.casetablepc{
	display: block;
}
.casetablepc table{
	border-collapse: collapse;
	width: 90%;
	max-width: 860px;
	margin: 0 auto 30px;
}
.casetablepc table th{
	background: #e72c30;
	color: #FFF;
	border: 2px #eee solid;
	padding: 10px 10px;
	width: 23.5%;
}
.casetablepc table th:nth-of-type(1){
	width: 26.5%;
}
.casetablepc table td{
	background: #FFF;
	border: 2px #eee solid;
	padding: 10px 10px;
}
.casetablepc table td.td01{
}
.casetablepc table td.td02{
	font-weight: bold;
	background: #fff0d1;
}
.casetablepc table td em{
	color:  #e72c30;
	text-decoration: underline;
	font-weight: bold;
	font-size: 1.8rem;
}
.casetablesp{
	display:none;
}

@media screen and (min-width: 767px) and  (max-width: 1060px) {
	#footer .inner {
		width: 100%;
		min-width: 100%;
	}


	.flow01{ 
		padding: 0 0 0 0;
	}
	.flow01 h3 {
		position: relative;
		padding: 0 65px;
	}
	.flow01 h3 span {
		top: -24px;
		left: 50%;
		width: 74%;
		margin: 0px 0 0 -37%;
	}
	.flow01 .flow01body_pc {
		clear: both;
		padding: 45px 30px 30px;
	}
	.flow01 .flow01body_pc .step{
		list-style-type: none;
		display:block;
		width: 100%;
	}
	.flow01 .flow01body_pc .step li{
		display:block;
		width: 100%;
		padding: 1em 2em 1em 2em;
		margin: 0 0 50px 0;
		text-align: center;
		font-size: 2.0rem;
		font-weight: 700;
		position: relative;
	}
	.flow01 .flow01body_pc .step li.step01:after{
		display: none;
	}
	.flow01 .flow01body_pc .step li.step01::before{
		content: ' ';
		position: absolute;
		left: 50%;
		bottom: -38px;
		width: 0;
		height: 0;
		border: none;
		border-top: 25px solid #ed6d70;
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		margin: 0 0 0 -30px;
	}
	.flow01 .flow01body_pc .step li.step02{
		margin: 0 0 0 0;
	}
	.flow01 .flow01body_pc .step li.step02:after{
		display: none;
	}
	.flow02{ 
		padding: 0 0 0 0;
	}
	.flow02 h3 {
		position: relative;
		padding: 0 65px;
	}
	.flow02 h3 span {
		top: -24px;
		left: 50%;
		width: 84%;
		margin: 0px 0 0 -42%;
	}
	.flow02 .flow01body_pc {
		clear: both;
		padding: 45px 30px 30px;
	}
	.flow02 .flow01body_pc .step{
		list-style-type: none;
		display:block;
		width: 100%;
	}
	.flow02 .flow01body_pc .step li{
		display:block;
		width: 100%;
		padding: 1em 2em 1em 2em;
		margin: 0 0 50px 0;
		text-align: center;
		font-size: 2.0rem;
		font-weight: 700;
		position: relative;
	}
	.flow02 .flow01body_pc .step li.step01:after{
		display: none;
	}
	.flow02 .flow01body_pc .step li.step01::before{
		content: ' ';
		position: absolute;
		left: 50%;
		bottom: -38px;
		width: 0;
		height: 0;
		border: none;
		border-top: 25px solid #666;
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		margin: 0 0 0 -30px;
	}
	.flow02 .flow01body_pc .step li.step02{
		margin: 0 0 0 0;
	}
	.flow02 .flow01body_pc .step li.step02:after{
		display: none;
	}
	.flow03{ 
		width: 95%;
		padding: 0 0 0 0;
	}
	.flow03 .flow01body_pc {
		display: block;
		clear: both;
		padding: 15px 0 20px;
	}
	.flow03 .flow01body_sp {
		display: none;
	}
	.flow03 .flow01body_pc .step{
		list-style-type: none;
		display:table;
		width:100%;
		padding:0;
		margin:0;
	}
	.flow03 .flow01body_pc .step li{
		display:table-cell;
		padding: 1em 1.5em 1em 1.5em;
		color: #fff;
		box-sizing:border-box;
		width:20%;
		text-align: center;
		font-weight: 700;
		height: 63.5px;
	}
	.flow03 .flow01body_pc .step li.step01:after{
		content:url(../img/client/2021/steparrow05.png);
		position: absolute;
		top: 50%;
		right: 0%;
		width: 22px;
		height: 64px;
		margin:-32px -11px 0 0;
		z-index: 5000;
	}
	.flow03 .flow01body_pc .step li.step02:after{
		display: none;
	}
	.flow03 .flow01body_pc .steptxt{
		list-style-type: none;
		display:table;
		width:100%;
		padding:0;
		margin:0;
	}
	.flow03 .flow01body_pc .steptxt li{
		display:table-cell;
		padding: 1em 0.7em 1em 0.7em;
		width:20%;
	}
	.mt45pc {
		margin-top: 35px!important;
	}
	.casetablepc{
		display: block;
	}
	.casetablepc table{
		width: 95%;
		margin: 0 auto 30px;
	}
	.casetablepc table th{
		background: #e72c30;
		color: #FFF;
		border: 2px #eee solid;
		padding: 10px 10px;
		width: 25%;
	}
	.casetablepc table td{
		background: #FFF;
		border: 2px #eee solid;
		padding: 10px 10px;
	}
	.casetablepc table td.td01{
	}
	.casetablepc table td.td02{
		font-weight: bold;
		background: #fff0d1;
	}
	.casetablesp{
		display:none;
	}
	
}
@media screen and (max-width: 767px){
	.flow01{ 
		width: 100%;
		border: 1px solid #e72c30;
		padding: 0 0 0 0;
		margin-top: -20px;
	}
	.flow01 h3 {
		position: relative;
		padding: 0 65px;
	}
	.flow01 h3 span {
		top: -15px;
		left: 50%;
		width: 90%;
		margin: 0px 0 0 -45%;
		font-size: 1.4rem;
	}
	.flow01 .flow01body_pc {
		clear: both;
		padding: 25px 20px 20px;
	}
	.flow01 .flow01body_pc .step{
		list-style-type: none;
		display:block;
		width: 100%;
	}
	.flow01 .flow01body_pc .step li{
		display:block;
		width: 100%;
		padding: 0.4em 2em 0.4em 2em;
		margin: 0 0 35px 0;
		text-align: center;
		font-size: 1.6rem;
		font-weight: 700;
		position: relative;
	}
	.flow01 .flow01body_pc .step li.step01:after{
		display: none;
	}
	.flow01 .flow01body_pc .step li.step01::before{
		content: ' ';
		position: absolute;
		left: 50%;
		bottom: -25px;
		width: 0;
		height: 0;
		border: none;
		border-top: 15px solid #ed6d70;
		border-right: 20px solid transparent;
		border-left: 20px solid transparent;
		margin: 0 0 0 -20px;
	}
	.flow01 .flow01body_pc .step li.step02{
		margin: 0 0 0 0;
	}
	.flow01 .flow01body_pc .step li.step02:after{
		display: none;
	}
	.flow02{ 
		width: 100%;
		border: 1px solid #333;
		padding: 0 0 0 0;
		margin-top: -20px;
	}
	.flow02 h3 {
		position: relative;
		padding: 0 65px;
	}
	.flow02 h3 span {
		top: -15px;
		left: 50%;
		width: 94%;
		margin: 0px 0 0 -47%;
		font-size: 1.4rem;
		letter-spacing: 0.2px;
	}
	.flow02 .flow01body_pc {
		clear: both;
		padding: 25px 20px 20px;
	}
	.flow02 .flow01body_pc .step{
		list-style-type: none;
		display:block;
		width: 100%;
	}
	.flow02 .flow01body_pc .step li{
		display:block;
		width: 100%;
		padding: 0.4em 2em 0.4em 2em;
		margin: 0 0 35px 0;
		text-align: center;
		font-size: 1.6rem;
		font-weight: 700;
		position: relative;
	}
	.flow02 .flow01body_pc .step li.step01:after{
		display: none;
	}
	.flow02 .flow01body_pc .step li.step01::before{
		content: ' ';
		position: absolute;
		left: 50%;
		bottom: -25px;
		width: 0;
		height: 0;
		border: none;
		border-top: 15px solid #666;
		border-right: 20px solid transparent;
		border-left: 20px solid transparent;
		margin: 0 0 0 -20px;
	}
	.flow02 .flow01body_pc .step li.step02{
		margin: 0 0 0 0;
	}
	.flow02 .flow01body_pc .step li.step02:after{
		display: none;
	}
	.flow03{ 
		width: 95%;
		padding: 0 0 0 0;
	}
	.flow03 .flow01body_pc {
		display: none;
	}
	.flow03 .flow01body_sp {
		display: block;
		clear: both;
		padding: 0 0 0;
	}
	.flow03 .flow01body_sp .step{
		list-style-type: none;
		display:block;
		width: 100%;
	}
	.flow03 .flow01body_sp .step li{
		display:block;
		padding: 0 0 45px 0;
		position: relative;
	}
	.flow03 .flow01body_sp .step li.step02{
		padding: 0 0 0 0;
	}
	.flow03 .flow01body_sp .step li p{
		display:block;
		position:relative;
		background: #e72c30;
		padding: 0.4em 2em 0.4em 2em;
		color: #fff;
		box-sizing:border-box;
		width:100%;
		text-align: center;
		font-weight: 700;
		margin: 0 0 8px 0;
	}
	.flow03 .flow01body_sp .step li span{
		display: block;
		width:100%;
		line-height: 1.7;
	}
	.flow03 .flow01body_sp .step li.step01::before {
		content: ' ';
		position: absolute;
		left: 50%;
		bottom: 15px;
		width: 0;
		height: 0;
		border: none;
		border-top: 15px solid #ed6d70;
		border-right: 20px solid transparent;
		border-left: 20px solid transparent;
		margin: 0 0 0 -20px;
	}

	.mt45pc {
		margin-top: 35px!important;
	}

	.arrowbox01{
		position: relative;
		padding:50px 0 0;
	}
	.arrowbox01::after {
		content: ' ';
		position: absolute;
		left: 50%;
		top: 15px;
		width: 0;
		height: 0;
		border: none;
		border-top: 25px solid #e72c30;
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		margin: 0 0 0 -30px;
	}

	.casetablepc{
		display:none;
	}
	.casetablesp{
		display: block;
	}
	.casetablesp h4{
		display: block;
		font-weight: bold;
		margin: 0 0 8px 0;
	}
	.casetablesp table{
		width: 100%;
		margin: 0 auto 30px;
	}
	.casetablesp table th{
		background: #e72c30;
		color: #FFF;
		padding:4px 10px;
	}
	.casetablesp table td{
		background: #FFF;
		padding:10px 10px 10px;
		font-size: 1.4rem;
		line-height: 1.7;
	}
	.casetablesp table td.td01{
	}
	.casetablesp table td.td02{
		font-weight: bold;
		background: #fff0d1;
	}
	.casetablesp table td em{
		font-size: 1.6rem;
		font-weight: bold;
		color: #e72c30;
		text-decoration: underline;
	}

}




@media screen and (min-width: 767px) and  (max-width: 1060px) {
	.contents {
		min-width: 100%;
		width: 100%;
	}
	.wrap {
		min-width: 100%;
		width: 100%;
	}
	#gnav .inner{
		width:100%;
		padding:30px 10px ;
	}
	#gnav .logo{
		width:380px;
		margin:0 auto;
		text-align:center;
		float:none;
		-webkit-transition: all 0.0s ease;
		transition: all 0.0s ease;
	}
	#gnav .logo img{
		width:380px;
	}
	#gnav .logo p{
		font-size:1.8rem;
		line-height:1.2em;
		margin: 0 0 10px 0;
	}
	#gnav .inner ul{
		display:none;
	}
	#gnav.fix .inner{
		padding:10px 15px;
	}
	#gnav.fix .logo img{
		width:180px;
	}
	#gnav.fix .logo p{
		font-size:1.0rem;
		line-height:1.2em;
		margin: 0 0 3px 0;
	}
	
	#gnav-btn {
		display: block;
		display: block;
		margin: 0;
		cursor: pointer;
		width: 40px;
		height: 40px;
		position: absolute;
		top: 15px;
		/* bottom: 0; */
		right: 20px;
		-webkit-transition: all 0.3s;
		transition: all 0.3s;
	}
	#gnav-btn .ttl {
		padding:2px 0 2px;
		text-align: center;
		font-size:1.0rem;
		line-height:12px;
		color:#000000;
		font-family:"Helvetica Neue", Arial;
	}
	#gnav-btn .icon {
		margin:10px auto;
		width: 32px;
		display: block;
		text-align: center;
	}
	#gnav-btn:hover {
		-ms-filter: "alpha(opacity=40)"; /* IE 8,9 */
		opacity:0.4; 
		zoom:1; /*IE*/
	}
	#gnav-btn .icon span {
		height: 1px;
		display: block;
		background: #000000;
		-webkit-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	#gnav-btn .icon .top {
		width:32px;
		-webkit-transform: translateY(-7px);
		-ms-transform: translateY(-7px);
		transform: translateY(-7px);
	}
	#gnav-btn .icon .middle {
		width:26px;
		margin-left:6px;
	}
	#gnav-btn .icon .bottom {
		width:20px;
		margin-left:12px;
		-webkit-transform: translateY(7px);
		-ms-transform: translateY(7px);
		transform: translateY(7px);
	}
	#spNav {
		width:300px;
		padding:30px 0;
		position:fixed;
		top:0;
		bottom:0;
		right:-300px;
		background:#333333;
		z-index:100;
		-webkit-transition: all 0.5s ease;
		transition:all 0.5s ease;
		overflow-y: scroll;
		display:block;
	}
	#spNav.open {
		box-shadow:0 0 5px 0 rgba(0,0,0,0.5);
		right:0px;
	}
	#spNav .logo{
		width:120px;
		margin:0 auto;
	}
	#spNav .logo img{
		width:100%;
	}
	#spNav h2{
		margin-top:2px;
		font-size:1.2rem;
		letter-spacing:0.1em;
		color:#ffffff;
		text-align:center;
	}
	#spNav > ul{
		width:80%;
		margin:0 auto;
		padding:20px 0 20px;
	}
	#spNav > ul > li {
		border-bottom:1px solid #ffffff;
	}
	#spNav > ul > li:first-child {
		border-top:1px solid #ffffff;
	}
	#spNav > ul li{
		
		text-align:center;
	}
	#spNav ul li a{
		padding:25px 0;
		font-size:1.2rem;
		line-height:1.2em;
		font-family:"Helvetica Neue", Arial;
		letter-spacing:0.1em;
		text-indent:0.2em;
		text-decoration:none;
		color:#ffffff;
		display:block;
	}
	#spNav #closeBtn {
		width:26px;
		display:block;
		position:absolute;
		top:10px;
		right:10px;
		z-index:10;
		-webkit-transition: all 0.5s ease;
		transition:all 0.5s ease;
		cursor: pointer;
	}
	#spNav #closeBtn:hover {
		-ms-filter: "alpha(opacity=60)"; /* IE 8,9 */
		opacity:0.6; 
		zoom:1; /*IE*/
	}
	#spNav #closeBtn img{
		width:100%;
	}
	
	#spNav .registBtnS {
		width:82%;
		margin:10px auto 0;
	}
	
	#spNav .registBtnS a{
		width:100%;
		font-size:1.4rem;
		line-height:40px;
		letter-spacing:0.05em;
		text-align:center;
		text-decoration:none;
		font-family: 'Noto Sans JP', sans-serif;
		border:2px solid #ca171a;
		border-radius:20px;
		box-sizing:border-box;
		color:#ffffff;
		background-color:#ca171a;
		display:block;
		box-shadow: 0 0 8px 0 rgba(0,0,0,0.3);
	}
	#spNav .registBtnS a span{
		padding-left:30px;
		display:inline-block;
		background-image:url(../img/common/icon_btn_w.png);
		background-position:0 50%;
		background-repeat:no-repeat;
		background-size:19px 19px;
	}
	#spNav .registBtnS a:hover{
		color:#ca171a;
		background-color:#ffffff;
	}
	#spNav .registBtnS a:hover span{
		background-image:url(../img/common/icon_btn_r.png);
		background-position:0 50%;
		background-repeat:no-repeat;
		background-size:19px 19px;
	}
		
}