@charset "utf-8";

* {
	padding: 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	height: 100%;
}

body {
	color: #333;
	background-color: #f2f6f7;

	/*font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;*/
	font-family: "Noto Serif JP", serif;
	word-wrap: break-word;
	height: 100%;
	line-height: 2.2;
}

.sh {
	display: none;
}
.sh_640_max {
	display: none;
}
.sh_640_min {
	display: block;
}
.font_mincho {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",
		"ＭＳ Ｐ明朝", "MS PMincho", serif;
}

section,
article {
	display: block;
}

img {
	vertical-align: top;
}

a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

a:hover img {
	/*filter: brightness(120%);*/
}

li {
	list-style-type: none;
}

a {
	/*color: #0099CC;*/
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
a:hover {
	/*color: #00CCCC;*/
	text-decoration: none;
}

table {
	border-collapse: collapse;
}
table td {
	border-collapse: collapse;
}

.clfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}

/*
ヘッダー
-------------------------------------------*/
header {
	width: 100%;
	position: fixed;
	z-index: 300;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}

header.fixed {
	background-color: #111;
	background-color: rgba(242, 246, 247, 0.9);
	height: 50px;
}

header h1 a img {
	display: block;
	position: absolute;
}

#g_navi ul li a.ac_menu {
	cursor: pointer;
	overflow: hidden;
}

.pankuzu {
	/*background-color: #036786;*/

	background: linear-gradient(
		to right,
		rgba(48, 218, 224) 0%,
		rgba(48, 218, 224, 0.8) 13%,
		rgb(48, 218, 224, 0.7) 60%,
		rgb(13, 95, 143, 0.7) 80%,
		rgba(0, 14, 95, 0.9) 100%
	);
	font-size: 14px;
	line-height: 30px;
	color: #ffffff;
	text-shadow: 0px 0px 1px #fff;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: 800;
}

.pankuzu ul {
	width: 96%;
	max-width: 1100px;
	margin-right: auto;
	margin-left: auto;
}

.pankuzu li {
	display: inline-block;
}

.pankuzu li a {
	text-decoration: none;
	font-weight: 800;
	color: #fff;
	text-shadow: 0px 0px 1px #fff;
}

.pankuzu li a::after {
	content: ">";
	padding-left: 10px;
	padding-right: 10px;
}

.pankuzu li a:hover {
	color: #fff;
	text-shadow: 0px 0px 0px #fff;
}

.pankuzu li i {
	padding-right: 5px;
}

/*
メインコンテンツ
-------------------------------------------*/
.content {
	width: 100%;
	/*background-color: #F2F6F7;*/
	color: #333;
	/*padding-top: 50px;*/
	/*padding-bottom: 50px;*/
	z-index: -5;
}
.white {
	background-color: #f2f6f7;
	/*background-color: #f9fdff;*/
	padding-top: 50px;
	padding-bottom: 80px;
}
.white_works {
	background-color: #f2f6f7;
	/*background-color: #f9fdff;*/
	padding-top: 50px;
	padding-bottom: 100px;
}
.blue_invisible {
	background-color: #0097ff00;
	/*background-color: #f9fdff;*/
	/*padding-top: 200px;
	padding-bottom: 200px;*/
	height: 100vh;
}
.blue {
	background-color: #f2f6f7;
	/*background-color: #f9fdff;
	*/
	padding: 50px;
	/*padding-bottom: 50px;
	*/
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
}
.content_box {
	background-color: #f2f6f7;
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
}
.content_box_last {
	background-color: #f2f6f7;
	width: 100%;
	padding-top: 50px;
	padding-bottom: 0;
}

.cont_wrap {
	max-width: 1200px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.cont_wrap_1400 {
	max-width: 1400px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.cont_wrap_1400_profile {
	max-width: 1400px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 80px;
}
.cont_wrap_1600 {
	max-width: 1600px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
#sub_top {
	/*background-color: #555;
	background-repeat: no-repeat;
	background-position: top;
	/*background-attachment: fixed;*/
	display: flex;
	height: 250px;
	line-height: 30px;
	padding-top: 30px;
	width: 100%;
	background-size: 100%;
	text-align: center;
	font-weight: bold;
	color: #fff;
	font-size: 34px;
	letter-spacing: 0.1em;
	-moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
}

#sub_top p {
	display: block;
	margin: auto;
}
#sub_top:before {
	content: "";
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100vh;
}

#index_top {
	height: 100vh;
	width: 100%;
	position: relative;
	overflow: hidden;
}

#index_top #top_catch {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 10;
	width: 760px;
	height: 500px;
	margin-top: -250px;
	margin-left: -380px;
	color: #fff;
	background-color: #1bd;
	background-color: rgba(98, 189, 207, 0.4);
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-flow: column;
	flex-flow: column;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

#index_top #top_catch h2 {
	font-size: 50px;
	letter-spacing: 1px;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",
		"ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-weight: normal;
	line-height: 1.5;
	margin-bottom: 20px;
}
#index_top #top_catch p {
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: 2.4;
}

.content h2 {
	/*font-size: 30px;
	line-height: 2.2;
	margin-bottom: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #15394A;
	font-weight: 600;
	letter-spacing: 1px;
	color: #666;
	text-align: center;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	padding-top: 30px;
	padding-right: 10px;
	padding-bottom: 30px;
	padding-left: 10px;
	clear: both;*/
}

.content h2 i {
	padding: 10px;
	color: #71f0bd;
}

.content h2 span {
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ",
		Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	font-size: 24px;
	color: #ff97cb;
	font-weight: bold;
	letter-spacing: 0.1em;
}

.content h2 span.small {
	font-size: 18px;
	font-weight: normal;
	color: #555;
}
/*
.content h4 {
	font-size: 24px;
	line-height: 30px;
	margin-bottom: 30px;
	position: relative;
	margin-top: 30px;
	padding-top: 15px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 44px;
	font-weight: normal;
	color: #2E94AD;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	clear: both;
	letter-spacing: 0.05em;
}

.content h4::after {
	display: block;
	width: 3px;
	height: 20px;
	position: absolute;
	top: 20px;
	left: 20px;
	background-color: #82CCD5;
	content: '';
}

.content h4 span {
	font-size: 15px;
	color: #555;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	padding-left: 15px;
}


.content h4 {
    position: relative;
    margin-bottom: 20px;
	margin-top: 20px;
    padding: 0.5rem;
    background-color: #82CCD5;
    color: white;
    border-radius: 0.1em;
    font-size: 22px;
    font-weight: bold;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.4);
}

.content h4:before {
    position: absolute;
    top: 0rem;
    left: -0.2rem;
    transform: rotate(-0.7deg);
    width: 100%;
    height: 100%;
    border: 2px solid #888;
    /*border-radius: 0.1em;
    background-color: rgb(255, 255, 255, .1);
    content: '';
}
*/
/*
.content h4{
	background: linear-gradient(transparent 60%, #c8f1ff 60%);
	padding: 0 20px 0 20px;
	font-size: 1.5em;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
text-align: center;
font-weight: normal;
color: #585858;
margin: 20px 0 35px 0;
}

.content h4 span{
	font-size: 0.6em;
}
*/
.content h4 {
	font-size: 20px;
	color: #597e84;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #adc4c7;
	letter-spacing: 0.1em;
	padding: 10px;
	font-weight: bold;
	clear: both;
	margin-top: 20px;
	margin-right: 30px;
	margin-bottom: 20px;
	margin-left: 30px;
	text-align: center;
}
/*
.content p {
	font-size: 16px;
	padding: 10px;
	margin-bottom: 30px;
	margin-top: 20px;
	margin-right: 30px;
	margin-left: 30px;
	text-align: justify;
	text-justify: inter-ideograph; /* IE用 */ /*

}*/
.top_p p {
	margin-bottom: 15px;
	margin-top: 5px;
}

.content .ul_news li {
	font-size: 16px;
}
.content .ul_news li a span.date {
	padding-right: 20px;
	color: #888;
}

.content .ul_news li span.i_con {
	display: inline-block;
	padding-left: 5px;
	padding-right: 5px;
	background-color: #f90;
	color: #fff;
	margin-right: 5px;
}
.content .ul_news li span.i_con.cl2 {
	background-color: #36bead;
}

.content .ul_news li a {
	display: block;
	color: #333;
	line-height: 30px;
	padding: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	text-decoration: none;
}

.content .ul_news li a:hover {
	color: #000;
	background-color: #fff;
}

.img_center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.img_center span {
	position: absolute;
	background-color: #333;
	background-color: rgba(0, 0, 0, 0.8);
	color: #fff;
	letter-spacing: 0.1em;
	padding: 10px;
	left: 0;
	top: 0;
}

.img_center div {
	position: absolute;
	background-color: #333;
	background-color: rgba(0, 0, 0, 0.8);
	color: #fff;
	letter-spacing: 0.1em;
	padding: 50px;
	right: 0;
	bottom: 0;
}

.img_left {
	float: left;
	padding-top: 20px;
	padding-right: 50px;
	padding-left: 30px;
	padding-bottom: 20px;
	max-width: 50%;
}
.img_right {
	float: right;
	padding-top: 20px;
	padding-right: 30px;
	padding-left: 50px;
	padding-bottom: 20px;
	max-width: 50%;
}

.img_left img,
.img_right img,
.img_center img {
	width: 100%;
}
.content .img_left p,
.content .img_right p {
	font-size: 14px;
	margin: 0px;
	text-align: center;
	letter-spacing: 0.1em;
	color: #455e65;
}

.img_left_min {
	float: left;
	padding-top: 20px;
	padding-right: 50px;
	padding-left: 30px;
	padding-bottom: 20px;
	max-width: 400px;
}
.img_right_min {
	float: right;
	padding-top: 20px;
	padding-right: 30px;
	padding-left: 50px;
	padding-bottom: 20px;
	max-width: 400px;
}

.img_left_min img,
.img_right_min img,
.img_center_min img {
	width: 100%;
}

.content .img_left_min p,
.content .img_right_min p {
	font-size: 14px;
	margin: 0px;
	text-align: center;
	letter-spacing: 0.1em;
	color: #455e65;
}

.content p.check {
	color: #ff3333;
}
.content p.p_st {
	font-size: 20px;
	color: #ca28b1;
}

.content .cont_wrap .txt_box {
	background-color: #e6edee;
	padding: 20px;
	margin: 20px;
}
.content .cont_wrap .txt_box h4 {
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: center;
	padding-right: 0px;
	padding-left: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #b6cacd;
	border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	color: #333;
}
.content .cont_wrap .txt_box h4::after {
	display: none;
}

a.ap {
	padding-top: 50px;
	margin-top: -50px;
}

/*
トップへ戻るボタン
-------------------------------------------*/
.to_top {
	position: fixed;
	bottom: 0px;
	right: 0px;
	z-index: 800;
}
.to_top a {
	text-decoration: none;
	text-align: center;
	display: block;
	width: 60px;
	height: 60px;
	background-color: #003457;
	color: #d8f4ff;
	text-align: center;
	font-size: 32px;
	line-height: 60px;
}
.to_top a:hover {
	background-color: #d8f4ff;
	color: #003457;
}

/*ふったー*/

/*
フッター
-------------------------------------------*/
footer {
	/*background-color: rgba(0, 0, 0, 0.7);*/
	color: #eee;
	clear: both;
	width: 100%;
	display: block;
	/*padding-top: 15px;
    padding-bottom: 15px;*/
	background: linear-gradient(270deg, #0066ff 0%, #00dda6 50%, #0004ff 100%);
	background-size: 200% auto;
	background-position: right center;
	padding-top: 50px;
}
footer::after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}
address {
	font-size: 10px;
	font-style: normal;
	padding-top: 5px;
	/* padding-right: 10px;*/
	padding-bottom: 5px;
	/* padding-left: 10px;*/
}
footer ul.f_bn {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: flex-end;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
}

footer .f_bn li {
	display: inline-block;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 5px 40px;
	text-decoration: none;
	/* color: #FFF;
    border: 1px solid #FFF;*/
	background-color: #fff;
	color: #3e4997;
	border: 1px solid #3e4997;
	opacity: 0.7;
	border-radius: 5px;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	/* margin-left: 10px;*/
	font-weight: bold;
	-webkit-filter: alpha(opacity=70);
	transition: 0.4s;
	margin-left: 10px;
	margin-right: 10px;
}

footer .f_bn li:last-child {
	background-color: #f18cb6;
	display: inline-block;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 5px 80px;
	text-decoration: none;
	/* color: #FFF;
    border: 1px solid #FFF;*/
	font-weight: bold;
	color: #3e4997;
	border: 1px solid #3e4997;
	border-radius: 5px;
	opacity: 0.9;
	filter: alpha(opacity=90);
	-ms-filter: "alpha( opacity=90 )";
	-webkit-filter: alpha(opacity=90);
	/* margin-left: 10px;*/
	transition: 0.4s;
}

footer .f_bn li:hover {
	opacity: 1;
	text-decoration: none;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	font-weight: bold;
}
footer .f_bn li a img {
	padding-right: 5px;
	margin-top: 6px;
	width: 22px;
}
footer .f_bn li a i {
	padding-right: 5px;
}

footer .box_pr {
	margin-bottom: -15px;
	clear: both;
	width: 100%;
	display: block;
	padding-top: 17px;
	padding-bottom: 12px;
	text-align: center;
	font-size: 10px;
	color: #eee;
	background-color: #003457;
}
.box_pr ul li {
	display: inline;
	padding: 5px;
}

article {
	display: flex;
	flex-direction: column;
	/*   background: linear-gradient(270deg, #0066ff 0%, #00dda6 50%, #0004ff 100%);
    background-size: 200% auto;
    background-position: right center;*/
}

/* 以下PC用の表示 */
@media screen and (min-width: 640px) {
	article {
		display: flex;
		flex-direction: row;
	}

	.banner {
		display: flex;
		/* flex-wrap:wrap;*/
		/* justify-content: center;*/
		/* margin-bottom: 20px;*/
		/*padding: 20px 0;*/
		margin: auto;
		width: 90%;
		/* align-items: center;*/
	}
	.banner li {
		/* width: calc(100%/4);/*←画像を横に4つ並べる場合*/
		padding: 0 5px; /*←画像の左右に5pxの余白を入れる場合*/
		box-sizing: border-box;
		width: 20%;
		text-align: center;
		display: grid;
		place-items: center;
		height: 100px;
		border-right: 1px solid rgba(255, 255, 255, 0.2);
		border-left: 1px solid rgba(255, 255, 255, 0.2);
		background-color: rgba(255, 255, 255, 0);
		transition: 0.5s;
	}
	.banner li:first-child {
		border-left: 1px solid rgba(255, 255, 255, 0);
	}
	.banner li:last-child {
		border-right: 1px solid rgba(255, 255, 255, 0);
	}

	.banner li:hover {
		background-color: rgba(196, 253, 255, 0.3);
		border: 1px solid rgba(255, 255, 255, 0.5);
		box-shadow: 0 5px 10px rgb(250, 108, 159, 0.4);
	}
	.banner li a {
		display: block;
		height: 100%;
		width: 100%;
		color: #fff;
		font-size: 0.8em;
		padding: 25px 0;
		font-weight: bold;
	}
	.banner li a:hover {
		text-shadow: 0 5px 10px rgb(250, 108, 159);
	}

	.cont_wrap_footer_box {
		width: 100%;
		background-color: rgb(1, 16, 87);
		padding-top: 15px;
		/* padding-bottom: 15px;*/
	}
	.cont_wrap_footer {
		max-width: 1400px;
		width: 100%;
		margin-right: auto;
		margin-left: auto;
	}

	.tab {
		float: right;
		display: inline-block;
		font-size: 0;
		margin-top: 8px;
	}
	.tab li {
		display: inline-block;
		margin: 10px 0;
		padding: 0 10px;
		font-size: 13px;
	}
	.tab li a {
		text-decoration: none;
		color: #eee;
		font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",
			"ＭＳ Ｐ明朝", "MS PMincho", serif;
	}
	/*.tab li a:hover{
        color: #000;
    }*/
	.tab li:hover a {
		color: #000;
	}
	.tab li + li {
		border-left: 2px solid #ccc;
	}
	.tab li:hover {
		background-color: #eee;
		transition: 0.2s;
		-webkit-transition: 0.2s;
		-moz-transition: 0.2s;
		-ms-transition: 0.2s;
		-o-transition: 0.2s;
	}
}
/*
フッター
-------------------------------------------*/
/*


*/
/*
各種テーブル
-------------------------------------------*/
.content table.table_01 {
	border: 1px solid rgb(2, 9, 140);
	width: 90%;
	margin-top: 80px;
	margin-right: auto;
	margin-bottom: 80px;
	margin-left: auto;
}
.content table.table_01 th,
.content table.table_01 td {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #888;
	padding: 20px;
}
.content table.table_01 th {
	font-size: 16px;
	white-space: nowrap;
	font-weight: normal;
	letter-spacing: 1px;
	width: 33%;
	background-color: rgb(2, 9, 140);
	font-weight: bold;
	color: #fff;
}

.content table.table_01 td {
	font-size: 14px;
	line-height: 30px;
	background-color: #ffffff71;
	color: #111;
}

.small {
	font-size: smaller;
	color: #666;
}
.chui {
	color: #f03600;
}

.table_01 caption {
	font-size: 14px;
	line-height: 30px;
	background-color: #e5e5e5;
	color: #111;
	letter-spacing: 1px;
	padding-top: 5px;
	padding-bottom: 5px;
	border: 1px solid #fff;
	box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
}
.table_01 th span {
	font-size: 12px;
	color: #ccc;
}

@media screen and (max-width: 800px) {
	.content table.table_01 th {
		width: 100%;
		display: block;
	}
	.content table.table_01 td {
		width: 100%;
		display: block;
		text-align: center;
	}
}

/*
トップ下部ピックアップ
-------------------------------------------*/
/*3ならび*/

.pick_up {
	width: 100%;
}

.pick_up ul {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1400px;
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.pick_up ul li {
	width: 32%;
	position: relative;
}
.pick_up ul li a {
	display: block;
	overflow: hidden;
	position: relative;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s;
	background: linear-gradient(270deg, #0066ff 0%, #00dda6 50%, #0004ff 100%);
	background-size: 200% auto;
	background-position: right center;
}
.pick_up ul li a img {
	width: auto;
	max-width: 100%;
	z-index: 1;
}
.pick_up ul li a:hover img {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	opacity: 0.1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

.pick_up ul li a::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(92, 189, 202, 0.2);
	z-index: 5;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

.pick_up ul li a:hover::before {
	/*background-color: rgba(22, 194, 224, 0.9);*/
	background-color: rgba(92, 189, 202, 0);
}

.pick_up ul li a div {
	color: #fff;
	font-size: 32px;
	line-height: 1;
	text-decoration: none;
	text-align: center;
	display: block;
	width: 80%;
	margin-top: -20px;
	margin-left: -40%;
	position: absolute;
	left: 50%;
	top: 47%;
	font-weight: bold;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	z-index: 10;
}
.pick_up ul li a div span {
	font-size: 16px;
	letter-spacing: 2px;
}

/*四並び*/

.pick_up_d {
	width: 100%;
	margin-top: 50px;
	margin-bottom: 50px;
}

.pick_up_d ul {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1400px;
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.pick_up_d ul li {
	width: 24%;
	position: relative;
}
.pick_up_d ul li a {
	display: block;
	overflow: hidden;
	position: relative;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s;
	background: linear-gradient(270deg, #0066ff 0%, #00dda6 50%, #0004ff 100%);
	background-size: 200% auto;
	background-position: right center;
}
.pick_up_d ul li a img {
	width: auto;
	max-width: 100%;
	z-index: 1;
}
.pick_up_d ul li a:hover img {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	opacity: 0.1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

.pick_up_d ul li a::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(92, 189, 202, 0.2);
	z-index: 5;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

.pick_up_d ul li a:hover::before {
	/*background-color: rgba(22, 194, 224, 0.9);*/
	background-color: rgba(92, 189, 202, 0);
}

.pick_up_d ul li a div {
	color: #fff;
	font-size: 32px;
	line-height: 1;
	text-decoration: none;
	text-align: center;
	display: block;
	width: 80%;
	margin-top: -20px;
	margin-left: -40%;
	position: absolute;
	left: 50%;
	top: 47%;
	font-weight: bold;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	z-index: 10;
}
.pick_up_d ul li a div span {
	font-size: 16px;
	letter-spacing: 2px;
}

/*
コンテンツボックス
-------------------------------------------*/

.box_cont {
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
}

.box_cont .box_c_in {
	width: 48%;
	min-height: 200px;
	padding: 10px;
	border: 1px solid #cfdee0;
	margin-bottom: 30px;
}

.box_cont .box_c_in:hover {
	background-color: #fff;
	border-top-color: #1bd;
	border-right-color: #1bd;
	border-bottom-color: #1bd;
	border-left-color: #1bd;
}

.box_cont .box_c_in img {
	max-width: 100%;
	padding: 20px;
}

.content .box_cont .box_c_in h2 {
	padding-bottom: 10px;
	font-size: 24px;
	border-bottom-width: 1px;
	border-bottom-color: #ccc;
	padding-top: 10px;
}

/*
コンテンツボックス４box
-------------------------------------------*/

.box_cont_list {
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
}

.box_cont_list .box_f_in {
	width: 24.5%;
	min-height: 200px;
	padding: 0px;
	border: 1px solid #cfdee0;
	margin-bottom: 30px;
}

.box_cont_list .box_f_in:hover {
	background-color: #fff;
	border-top-color: #1bd;
	border-right-color: #1bd;
	border-bottom-color: #1bd;
	border-left-color: #1bd;
}

.box_cont_list .box_f_in img {
	max-width: 100%;
	padding: 15px;
}

.content .box_cont_list .box_f_in h2 {
	padding-bottom: 10px;
	font-size: 20px;
	font-size: clamp(15px, 1vw, 25px);

	border-bottom-width: 1px;
	border-bottom-color: #ccc;
	padding-top: 10px;
}
.content .box_cont_list .box_f_in p {
	font-size: 14px;
	padding: 0;
}
/*


/*
コンテンツボックス3box
-------------------------------------------*/

.box_cont_recruit {
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
	margin-top: 50px;
}

.box_cont_recruit .box_r_in {
	width: 33%;
	min-height: 200px;
	padding: 0px;
	border: 1px solid #cfdee0;
	margin-bottom: 30px;
}

.box_cont_recruit .box_r_in:hover {
	background-color: #fff;
	border-top-color: #1bd;
	border-right-color: #1bd;
	border-bottom-color: #1bd;
	border-left-color: #1bd;
}

.box_cont_recruit .box_r_in img {
	max-width: 100%;
	padding: 15px;
}

.content .box_cont_recruit .box_r_in h2 {
	padding-bottom: 10px;
	font-size: 20px;
	font-size: clamp(20px, 1vw, 30px);

	border-bottom-width: 1px;
	border-bottom-color: #ccc;
	padding-top: 10px;
}
.content .box_cont_recruit .box_r_in p {
	color: #555;
	font-size: 14px;
	padding: 0;
}

/*








背景入り帯
-------------------------------------------*/

/*さふぁり*/

.obi_001_sp {
	display: none;
}

/*さふぁりここまで*/
.obi_001 {
	background-image: url(../img/home/3.jpg);
	background-repeat: no-repeat;
	text-align: center;
	padding-top: 15%;
	padding-right: 20px;
	padding-bottom: 15%;
	padding-left: 20px;
	background-size: cover;
	background-attachment: fixed;
	background-position: center bottom;
	color: #fff;
	/*margin-top: 100px;/*
	margin-bottom: 50px;*/
}

.content .obi_001 h2 {
	color: #fff;
	border-bottom: none;
	padding-bottom: 0px;
}
.obi_001 p {
	text-align: center;
	line-height: 2.4;
}
_::-webkit-full-page-media,
_:future,
:root .obi_001 {
	background-image: url(../img/obi_001_sp.jpg);
	background-attachment: scroll;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
	::i-block-chrome,
	.obi_001 {
		background-image: url(../img/obi_001_sp.jpg);
		background-attachment: scroll;
	}
}

.obi_002 {
	width: 100%;
	height: auto;
	background-image: url(../img/home/7.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0 0 50%;
	position: relative;
	background-attachment: fixed;
	height: 500px;
}
_::-webkit-full-page-media,
_:future,
:root .obi_002 {
	background-image: url(../img/obi_002.jpg);
	background-attachment: scroll;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
	::i-block-chrome,
	.obi_002 {
		background-image: url(../img/obi_002.jpg);
		background-attachment: scroll;
	}
}
.obi_002 .box_in {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-flow: column;
	flex-flow: column;
	position: absolute;
	color: #fff;
	background-color: rgba(34, 133, 172, 0.447);
}

.obi_002 h2 {
	font-size: 36px;
}
.obi_002 p {
	line-height: 2;
	font-weight: bold;
}

@media screen and (min-width: 960px) {
	body {
		font-size: 16px;
	}

	/*
ヘッダー
-------------------------------------------*/
	header {
		height: 90px; /*メニューの白い部分の高さ*/
	}
	header.fixed h1 a img {
		top: 9px; /*scroll後のlogoの高さ*/
	}

	header h1 a img {
		top: 20px;
		left: 10px;
		height: 40px;
		width: 18%; /*写真の大きさによってはwidthはなくても大丈夫*/
	}

	.menu_btn,
	.btn_close {
		display: none;
	}

	/*
PCグローバルナビ
-------------------------------------------*/
	#g_navi {
		position: absolute;
		right: 10px;
		top: 20px;
		width: auto;
		margin-left: 200px;
		display: block !important;
		z-index: 1000;
	}
	#g_navi.fixed {
		top: 10px;
	}
	header.fixed #g_navi.txt_w {
		top: 10px;
	}
	#g_navi ul li {
		display: inline;
	}

	#g_navi li a {
		width: auto;
		padding: 10px;
		line-height: 30px;
		display: block;
		color: #111;
		text-decoration: none;
		text-align: center;
		position: relative;
		float: left;
		letter-spacing: 1px;
		font-size: 14px;
		font-weight: bold;
	}

	#g_navi.fixed li a {
		line-height: 15px;
	}

	#g_navi li a::before {
		display: block;
		height: 2px;
		position: absolute;
		top: 2px;
		width: 70%;
		left: 15%;
		background-color: rgba(17, 187, 221, 0);
		content: "";
		-webkit-transition: 0.2s linear;
		-moz-transition: 0.2s linear;
		transition: 0.2s linear;
	}

	#g_navi li a:hover::before {
		background-color: rgba(17, 187, 221, 1);
		top: 0px;
		width: 80%;
		left: 10%;
	}

	#g_navi li a:hover {
		color: #1bd !important;
	}

	#g_navi.txt_w li a {
		color: #fff;
	}

	header.fixed #g_navi.txt_w li a {
		color: #111;
		line-height: 15px;
	}

	#g_navi li.contact a {
		background-color: #1bd;
		/*background-color: rgb(255, 151, 203);*/
		color: #fff !important;
		padding-left: 40px;
		padding-right: 40px;
		margin-left: 10px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border: #1bd solid 1px;
		margin-top: -2px;
	}

	#g_navi li.contact a:hover {
		background-color: #fff;
		color: #1bd !important;
		box-shadow: 0 0 5px #00000093;
	}
	#g_navi li.contact a::before {
		display: none;
	}

	#g_navi li.contact_white a {
		background-color: #fff;
		/*background-color: rgb(255, 151, 203);*/
		color: #1bd !important;
		padding-left: 40px;
		padding-right: 40px;
		margin-left: 10px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border: #1bd solid 1px;
		margin-top: -2px;
	}

	#g_navi li.contact_white a:hover {
		background-color: #1bd;
		color: #fff !important;
		border: #fff solid 1px;
		box-shadow: 0 0 5px #00000093;
	}
	#g_navi li.contact_white a::before {
		display: none;
	}

	/*
ヘッダー
-------------------------------------------*/

	#index_top {
		min-height: 850px;
	}
	/*
#sub_top.sample {
	background-image: url(../img/sub_top_sample.jpg);
}
#sub_top.faq {
	background-image: url(../img/sub_top_faq.jpg);
}
#sub_top.contact {
	background-image: url(../img/sub_top_contact.jpg);
}
#sub_top.news {
	background-image: url(../img/sub_top_news.jpg);
}
#sub_top.concept {
	background-image: url(../img/sub_top_concept.jpg);
}
#sub_top.works {
	background-image: url(../img/sub_top_works.jpg);
}
#sub_top.about {
	background-image: url(../img/sub_top_about.jpg);
}
#sub_top.recruit_career {
	background-image: url(../img/slide/unnamed4.jpg);
}
*/
	#sub_top.sample:before {
		background: url(../img/sub_top_sample.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.faq:before {
		background: url(../img/sub_top_faq.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.contact:before {
		/*使ってる*/
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.news:before {
		background: url(../img/sub_top_news.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.concept:before {
		/*使ってる*/
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.works:before {
		background: url(../img/sub_top_works.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.about:before {
		/*使ってる*/
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.recruit_career:before {
		background: url(../img/slide/unnamed4.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.contact_recruit:before {
		background: url(../img/slide/unnamed4.jpg) center no-repeat;
		background-size: cover;
	}

	.no_pc {
		display: none !important;
	}
}
/*-- /960px～ --*/

@media screen and (min-width: 1200px) {
	header h1 a img {
		left: 50%;
		margin-left: -600px;
	}

	header #g_navi {
		right: 50%;
		margin-right: -600px;
	}
}

/*
無限ループ
-------------------------------------------*/
.loop_wrap_base {
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: #f2f6f7;
	padding-top: 30px;
	padding-bottom: 30px;
}

.loop_wrap_base h2 {
	font-weight: normal;
	color: #111;
	text-align: center;
	line-height: 1.2;
	padding: 10px;
	font-size: 24px;
}
.loop_wrap_base h2 span {
	letter-spacing: 0.2em;
	font-size: 14px;
	color: #555;
}

.loop_wrap {
	display: flex;
	width: 220%;
	height: auto;
}

.loop_wrap ul {
	width: 100%;
	height: auto;
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.loop_wrap ul li {
	width: 20%;
}

.loop_wrap ul li a {
	display: block;
	text-decoration: none;
	color: #555;
	text-align: center;
	line-height: 1.6;
	font-size: 14px;
	position: relative;
}
.loop_wrap ul li a img {
	width: 100%;
	display: block;
	margin-bottom: 5px;
}

.loop_wrap ul li a span {
	display: inline-block;
	background-color: #36bead;
	color: #fff;
	font-size: 12px;
	position: absolute;
	top: 0;
	left: 0;
	padding: 5px;
	letter-spacing: 1px;
	z-index: 10;
}

.loop_wrap ul li a span.cl_2 {
	background-color: #333;
}

.loop_wrap ul li a span.cl_3 {
	background-color: #ff9900;
}

@keyframes loop {
	0% {
		transform: translateX(100%);
	}
	to {
		transform: translateX(-100%);
	}
}

@keyframes loop2 {
	0% {
		transform: translateX(0);
	}
	to {
		transform: translateX(-200%);
	}
}

.loop_wrap ul:first-child {
	animation: loop 120s -60s linear infinite;
}

.loop_wrap ul:last-child {
	animation: loop2 120s linear infinite;
}

.loop_wrap:hover ul {
	animation-play-state: paused;
}

/*
SNSボタン
-------------------------------------------*/

.h_sns {
	padding: 5px;
	position: fixed;
	top: 200px;
	right: 0px;
	/*background-color: rgba(17,187,221,0.8);*/
	background-color: #1bd;

	border-radius: 8px 0px 0px 8px;
	-webkit-border-radius: 8px 0px 0px 8px;
	-moz-border-radius: 8px 0px 0px 8px;
}
.h_sns li a {
	display: block;
	padding: 10px;
	color: #fff;
	line-height: 15px;
	width: 50px;
	text-align: center;
	text-decoration: none;
	font-size: 18px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.h_sns li a:hover {
	background-color: #fff;
	color: #1bd;
}
.h_sns li a span {
	font-size: 0.8em;
}
.h_sns i {
	margin-bottom: 5px;
}

/*
エフェクト
-------------------------------------------*/
.effect {
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
	transform: translateY(20px);
	-webkit-transform: translateY(20px);
	-moz-transform: translateY(20px);
	-webkit-transition: 1s ease-out;
	-moz-transition: 1s ease-out;
	transition: 1s ease-out;
}
.effect.d_02 {
	transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;
}
.effect.d_04 {
	transition-delay: 0.4s;
	-webkit-transition-delay: 0.4s;
}
.effect.d_06 {
	transition-delay: 0.6s;
	-webkit-transition-delay: 0.6s;
}
.effect.d_08 {
	transition-delay: 0.8s;
	-webkit-transition-delay: 0.8s;
}
.effect.start {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	transform: translateY(0px);
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
}

/*------------------------------*/
.box_in h2 {
	padding-top: 30px;
}

.obi_002 .box_in p a.tel {
	font-size: 24px;
	color: #fff;
	text-decoration: none;
	line-height: 1.2;
}
.obi_002 .box_in p a.tel strong {
	padding-left: 10px;
	font-size: 150%;
}

.content .box_att {
	margin-top: 30px;
}

.content .box_att h2 {
	font-weight: normal;
	font-size: 24px;
	color: #3eadbd;
	padding: 15px;
	border-bottom-color: #8ed1db;
}
.content .box_att p {
	font-size: 14px;
	margin: 0px;
	color: #328b98;
}

/*
FAQ
-------------------------------------------*/
dl.faq {
	display: block;
	margin: auto;
	width: 90%;
}

dl.faq dt {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",
		"ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 20px;
	color: #fff;
	background-color: #278498;
	display: block;
	position: relative;
	width: 80%;
	margin-left: 20%;
	margin-bottom: 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}

dl.faq dt::before {
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ",
		Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	font-size: 24px;
	content: "Q.";
	position: absolute;
	left: 20px;
	top: 13px;
}
dl.faq dt::after {
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	pointer-events: none;
	position: absolute;
	border-color: rgba(39, 132, 152, 0);
	border-top-width: 16px;
	border-bottom-width: 16px;
	border-left-width: 8px;
	border-right-width: 8px;
	border-bottom-color: #278498;
	bottom: 100%;
	right: 30px;
}
dl.faq dd {
	font-size: 16px;
	background-color: #fff;
	display: block;
	position: relative;
	width: 80%;
	padding: 20px;
	margin-bottom: 50px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}
dl.faq dd::after {
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	pointer-events: none;
	position: absolute;
	border-color: rgba(255, 255, 255, 0);
	border-top-width: 16px;
	border-bottom-width: 16px;
	border-left-width: 8px;
	border-right-width: 8px;
	border-bottom-color: #ffffff;
	bottom: 100%;
	left: 30px;
}

dl.faq dd::before {
	font-size: 24px;
	content: "A.";
	position: absolute;
	left: 20px;
	top: 13px;
}

/*
事例一覧＆ギャラリー
-------------------------------------------*/
.works_list {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-top: 50px;
}

.works_list li {
	display: block;
	/*float: left;*/
	width: 33%;
	padding: 20px;
}

.works_list li a {
	display: block;
	text-decoration: none;
	width: 100%;
	padding: 10px;
	border: 1px solid #f2f6f7;
	position: relative;
}

.works_list li a:hover {
	background-color: #fff;
	border: 1px solid #dde7ea;
}

.works_list li a span {
	display: block;
	color: #fff;
	font-size: 12px;
	background-color: #36bead;
	position: absolute;
	top: 5px;
	left: 5px;
	z-index: 10;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
}

.works_list li a span.cl_2 {
	background-color: #333333;
}

.works_list li a span.cl_3 {
	background-color: #ff9900;
}

.works_list li a img {
	width: 100%;
	height: auto; /*写真の大きさを同じにするならautoで、トリミングするなら、高さを指定する*/
	object-fit: cover;
}

.works_list li a p {
	color: #111;
	text-align: center;
	margin: 0px;
}

.access_listbox {
	display: flex;
}
.access_listbox_in_a {
	width: 60%;
	border: 2px solid #00ffd9;
	padding: 5px;
	margin: 5px;
}
.access_listbox_in_b {
	width: 40%;
	border: 2px solid #00ffd9;
	padding: 5px;
	margin: 5px;
}
/*駐車場用*/
/*
.g_list li {
	display: block;
	float: left;
	width: 33%;
	padding: 10px;
}
*/
.g_list {
	display: flex;
	/*justify-content:space-around;*/
}

.g_list li {
	display: block;
	width: 33%;
	padding: 10px;
}
.g_list li a {
	display: block;
	width: 100%;
	height: 150px;
	overflow: hidden;
}

.g_list li a img {
	width: 100%;
	height: 150px;
	object-fit: cover;
}

.g_list li a img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

/*駐輪場用*/
/*
.g_list li {
	display: block;
	float: left;
	width: 33%;
	padding: 10px;
}
*/
.g_list_bicycle {
	display: flex;
	/*justify-content:space-around;*/
}

.g_list_bicycle li {
	display: block;
	width: 50%;
	padding: 10px;
}
.g_list_bicycle li a {
	display: block;
	width: 100%;
	height: 150px;
	overflow: hidden;
}

.g_list_bicycle li a img {
	width: 100%;
	height: 150px;
	object-fit: cover;
}

.g_list_bicycle li a img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}
/**/

.g_list_map {
	display: flex;
	justify-content: center;
	align-items: center;
}
.g_list_map li {
	display: block;
	/*float: left;*/
	width: 40%;
	padding: 20px;
}

.g_list_map li a {
	display: block;
	width: 100%;
	height: 250px;
	overflow: hidden;
}

.g_list_map li a img {
	width: 100%;
	height: 250px;
	object-fit: cover;
}

.g_list_map li a img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

/*
Facebook
-------------------------------------------*/

.content .cont_wrap .box_left {
	width: 80%;
	/*float: left;*/
	padding: 10px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50px;
}
.content .cont_wrap .box_right {
	width: 50%;
	float: right;
	text-align: center;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
}

/*
ページャー
-------------------------------------------*/

.pager {
	padding-top: 50px;
	padding-bottom: 50px;
	clear: both;
}

.pager .pagination {
	text-align: center;
}

.pager .pagination li {
	display: inline;
	margin: 0 2px;
	padding: 0;
	display: inline-block;
	width: 36px;
	height: 36px;
	text-align: center;
	position: relative;
}

.pager .pagination li a {
	vertical-align: middle;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	display: table;
	color: #fff;
	text-decoration: none;
	background-color: #333333;
}

.pager .pagination li a span {
	display: table-cell;
	vertical-align: middle;
}

.pager .pagination li a:hover,
.pager .pagination li a.active {
	color: #000;
	background-color: #f9f9f9;
}

.footer05 {
	color: #fff;
	/*background: #e5e5e5;*/
	padding: 30px 30px 10px 30px;
}
.footer05 a {
	/*color: #fff;
	text-decoration: none;*/
	position: relative;
	display: inline-block;
	text-decoration: none;
}
/*-
   .footer05 ul li a::after {
	position: absolute;
	bottom: 1px;
	left: 0;
	content: '';
	width: 100%;
	height: 1.5px;
	background: #ffffffb6;
	transform: scale(0, 1);
	transform-origin: right top;
	transition: transform .3s;
  }
  .footer05 a:hover::after {
	transform-origin: left top;
	transform: scale(1, 1);
  }
*/
/*
   .footer05 li a:hover {
	text-decoration: underline;
   }
*/
.wh li a {
	color: #fff;
}
.wh li a:hover {
	font-weight: 800;
}

.footer05 .wrap {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.footer05 .wrap h4 {
	font-size: 1.17em;
	margin: 0 0 10px 0;
	padding: 0;
	border-bottom: 1px #fff solid;
}
.footer05 .wrap h4 img{
	width: 250px;filter: drop-shadow(0 0 2px #fff);
}
.footer05 .wrap h4 a {
	color: #fff;
}
.footer05 .wrap p {
	margin: 0;
	padding: 0 0 20px 10px;
}
.footer05 .wrap .box {
	width: 20%;
}
.footer05 .wrap .box:nth-child(1) {
	width: 25%;
}
.footer05 .wrap .box:nth-child(2) {
	width: 20%;
}
.footer05 .wrap .box:nth-child(3) {
	width: 50%;
}

.footer05 .wrap .box ul {
	margin: 0;
	padding: 0 0 20px 10px;
	list-style: none;
}
.footer05 .wrap .copyright {
	width: 100%;
	padding: 20px 0 0 0;
}
.footer02 {
	color: #fff;
	/*background: #e5e5e5;*/
	text-align: center;
	padding: 30px 30px 30px 30px;
}
/*
   .footer02 a {
	color: #fff;
	text-decoration: none;

   }
   .footer02 a:hover {
	text-decoration: underline;

   }
   */

.footer02 .ccc {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.footer02 .ccc li {
	margin: 0;
	padding: 0 20px;
}
.footer02 .copyright {
	margin: 0;
	padding: 20px 0 0 0;
}

.contact_box {
	display: flex;
	width: 70%;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
	justify-content: center;
}

.contact_box h4 {
	text-align: center;
}
.contact_box p {
	text-align: center;
}
.recruit_home {
	width: 35%;
}
.document_home {
	width: 35%;
}
.recruit_home p {
	font-size: 1em;
}
.document_home p {
	font-size: 1em;
}

.recruit {
	width: 50%;
}
.document {
	width: 50%;
}
.recruit p {
	font-size: 1em;
}
.document p {
	font-size: 1em;
}

@media screen and (max-width: 640px) {
	.contact_box {
		flex-direction: column;
	}

	.recruit_home {
		width: 90%;
	}
	.document_home {
		width: 90%;
	}
	.recruit {
		width: 90%;
		margin: auto;
	}
	.document {
		width: 90%;
		margin: auto;
	}
	/*
コンテンツボックス４box
-------------------------------------------*/
}

.contact_btn {
	text-decoration: none;
	/*ボタンの形状*/
	display: block;
	padding: 5px;
	/*border-radius:30px;*/
	text-align: center;
	border: 1px solid #fff;
	color: #fff;
	outline: none;
	/*アニメーションの指定*/
	transition: all 0.4s ease-out;
	font-weight: 600;
	font-size: 1.3em;
	margin: 20px auto;
	width: 300px;
}

/*hoverした際、グラデーションと影を付ける*/
.contact_btn:hover {
	/*ボタンの形状*/
	border-color: transparent;
	color: #fff;
	/*背景の色と形状*/
	background: linear-gradient(270deg, #00ccff 0%, #6cfadb 50%, #0066ff 100%);
	background-size: 200% auto;
	background-position: right center;
	/*ボックスの影*/
	box-shadow: 0 5px 10px rgb(250, 108, 159, 0.4);
	text-shadow: 0 5px 10px rgb(250, 108, 159);
}
/*== グラデーション線から塗に変化する ふったーここまで*/

@media screen and (max-width: 1200px) {
	footer .f_bn li a {
		font-size: 0.8em;
		padding: 10px 32px;
	}
}
@media screen and (max-width: 1000px) {
	address {
		letter-spacing: 1px;
		text-align: center;
		display: block;
		/*float: right;*/
		/*padding-top: 30px;
       /* padding-right: 10px;*/
	}
	footer .f_bn li a {
		font-size: 14px;

		padding: 10px 40px;
	}
	.box_cont_list .box_f_in {
		width: 49.5%;
		min-height: 200px;
		padding: 0px;
		border: 1px solid #cfdee0;
		margin-bottom: 30px;
	}

	.access_listbox {
		display: block;
	}
	.access_listbox_in_a {
		width: 90%;
		border: 2px solid #00ffd9;
		padding: 5px;
		margin: 5px auto;
	}
	.access_listbox_in_b {
		width: 90%;
		border: 2px solid #00ffd9;
		padding: 5px;
		margin: 5px auto;
	}
}
@media only screen and (max-width: 999px) {
	.footer05 .wrap .box:nth-child(1) {
		width: 60%;
		margin-right: auto;
		margin-left: auto;
	}
	.footer05 .wrap .box:nth-child(2) {
		width: 40%;
		margin-right: auto;
		margin-left: auto;
	}

	.footer05 .wrap .box:nth-child(3) {
		width: 100%;
		text-align: center;
	}
}

@media screen and (max-width: 959px) {
	.box_cont_recruit .box_r_in {
		width: 49%;
		min-height: 200px;
		padding: 0px;
		border: 1px solid #cfdee0;
		margin-bottom: 30px;
	}

	.box_cont_recruit .box_r_in:last-child {
		width: 100%;
		min-height: 200px;
		padding: 0px;
		border: 1px solid #cfdee0;
		margin-bottom: 30px;
	}
	.box_cont_recruit .box_r_in:last-child img {
		width: 50%;
		object-fit: cover;
		max-height: 250px;
	}

	.box_cont_recruit .box_r_in:last-child {
		display: flex;
	}
	.img_left_min {
		float: left;
		padding-top: 20px;
		padding-right: 25px;
		padding-left: 15px;
		padding-bottom: 15px;
		max-width: 350px;
	}
	.img_right_min {
		float: right;
		padding-top: 20px;
		padding-right: 15px;
		padding-left: 25px;
		padding-bottom: 15px;
		max-width: 350px;
	}

	.contact_box {
		display: flex;
		width: 100%;
		margin-right: auto;
		margin-left: auto;
		margin-top: 20px;
		justify-content: center;
	}

	body {
		font-size: 16px;
	}

	body.fixed {
		overflow: hidden;
	}

	img {
		max-width: 100% !important;
		height: auto;
		width/***/: auto;
		margin-left: auto;
		margin-right: auto;
	}

	.content h4 {
		margin-right: 10px;
		margin-left: 10px;
	}
	.content .cont_wrap .box_left {
		width: 100%;
		float: none;
	}
	.content .cont_wrap .box_right {
		width: 100%;
		float: none;
		overflow: hidden;
	}

	.content .cont_wrap .box_right .fb-page {
		width: 100% !important;
	}

	.works_list li {
		width: 33.33%;
	}

	.g_list li {
		width: 33.33%;
	}

	/*
メニューボタン
-------------------------------------------*/

	.menu_btn {
		display: block;
		height: 40px;
		width: 40px;
		text-align: center;
		padding-top: 5px;
		padding-bottom: 5px;
		position: fixed;
		z-index: 5000;
		top: 5px;
		right: 5px;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		cursor: pointer;
	}
	.menu_btn:hover {
		cursor: pointer;
	}

	.menu_btn span {
		width: 28px;
		height: 2px;
		display: block;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -14px;
		background-color: #1bd;
	}
	.menu_btn span {
		transition: all 0.3s;
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
	}
	.menu_btn span.top {
		transform: translateY(-8px);
		-webkit-transform: translateY(-8px);
		-moz-transform: translateY(-8px);
	}
	.menu_btn span.bottom {
		transform: translateY(8px);
		-webkit-transform: translateY(8px);
		-moz-transform: translateY(8px);
	}

	.menu_btn:hover span.top {
		transform: translateY(-10px);
		-webkit-transform: translateY(-10px);
		-moz-transform: translateY(-10px);
	}
	.menu_btn:hover span.bottom {
		transform: translateY(10px);
		-webkit-transform: translateY(10px);
		-moz-transform: translateY(10px);
	}

	.menu_btn.opened span {
		background-color: #7bc;
	}

	.menu_btn.opened span.middle {
		background: rgba(255, 255, 255, 0);
		transform: translateX(30px);
		-webkit-transform: translateX(30px);
		-moz-transform: translateX(30px);
	}
	.menu_btn.opened span.top {
		background-color: rgb(255, 255, 255);
		transform: rotate(-45deg) translateY(0px);
		-webkit-transform: rotate(-45deg) translateY(0px);
		-moz-transform: rotate(-45deg) translateY(0px);
	}
	.menu_btn.opened span.bottom {
		background-color: rgb(255, 255, 255);
		transform: rotate(45deg) translateY(0px);
		-webkit-transform: rotate(45deg) translateY(0px);
		-moz-transform: rotate(45deg) translateY(0px);
	}

	/*
グローバルナビ
-------------------------------------------*/
	#g_navi {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0px;
		overflow: auto;
		z-index: 3000;
		/*background-color: #F2F6F7;
	background-color: rgba(242, 246, 247, 0.919);*/
		background-color: #f8feff;
		display: none;
		padding-left: 10%;
		padding-right: 10%;
	}
	#g_navi ul {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: column;
		flex-flow: column;
		-webkit-justify-content: center;
		justify-content: center;
		min-height: 50%;

		margin-top: 5%;
	}

	#g_navi ul li a {
		color: #111;
		text-decoration: none;
		display: block;
		padding: 20px;
		background-color: #ffffff00;
		line-height: 22px;
		font-size: 14px;
		text-align: center;
		font-weight: bold;
		letter-spacing: 1px;
		border-bottom: #1bd solid 1px;
	}
	#g_navi ul li:first-child a {
		border-top: #1bd solid 1px;
	}

	#g_navi ul li a:hover {
		/*color: #1BD;*/
		background-color: #ffffffe4;
	}

	#g_navi ul li.contact a {
		text-align: center;
		background-color: #1bd;
		color: #fff;
		width: 100%;
		display: none;
	}

	#g_navi ul li.contact a:hover {
		background-color: #fff;
		color: #1bd;
	}
	.recruit_mini {
		position: relative;
		width: 600px;
		margin: 10px auto;
	}
	.recruit_min {
		/*width: 70%;*/

		display: block;

		transition: 0.5s;
		box-shadow: 0 0 5px #000000b1;
	}

	.recruit_min a {
		bottom: 0;
	}

	.recruit_min_box_color {
		background-color: rgba(112, 234, 255, 0.192);
		width: 100%;
		height: 100%;
		z-index: 1;
		position: absolute;
	}
	.recruit_min_box_color:hover {
		background-color: rgba(112, 234, 255, 0);
	}

	.recruit_min_box {
		position: absolute;
		left: 0;
		right: 0;
		top: 35%;
		font-size: 2em;
		color: #fff;
		font-weight: bold;
		text-shadow: 1px 2px 3px #2d2c2c;
		z-index: 2;
	}

	.boxa {
		overflow: hidden;
		position: relative;
		width: 100%;
		cursor: pointer;
		margin: 1px 0;
	}

	.box-bga {
		background: url("../image/recruit_1.jpg") center center / cover no-repeat;
		width: 100%;
		height: 200px;
		position: relative;
		z-index: 0;
		transition: 0.3s ease-in-out;
	}

	.box-bga:hover {
		transform: scale(1.1);
	}
	.box-bga:hover::before {
		background-color: #00c8ff90;
	}
	.box-bga::before {
		/*background: linear-gradient(45deg, rgba(3, 188, 255, 0.7) 0%, rgba(3, 188, 255, 0.3) 70%);*/
		background-color: #ffffff00;
		content: "";
		height: 100%;
		position: absolute;
		width: 100%;
		z-index: -1;
		left: 0;
		transition: 0.5s;
	}

	.box-texta {
		position: absolute;
		top: 35%;
		left: 0;
		right: 0;
		pointer-events: none;
	}

	.box-texta h2 {
		text-align: center;
		color: #1c1657;
		font-size: 28px;
		font-weight: bold;
		text-shadow: 2px 2px #5c5c5c68;
		background-color: #ffffffc1;
		width: 50%;
		margin: auto;
	}

	.box-texta p {
		color: #fff;
		font-size: 17px;
		margin-top: 20px;
	}

	.sh {
		display: block;
	}

	メニューシャドウ -------------------------------------------*/ .bg_bl {
		background-color: #fff;
		height: 100%;
		width: 100%;
		opacity: 0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha( opacity=80 )";
		display: block;
		position: fixed;
		z-index: 2000;
	}

	/*
ヘッダー
-------------------------------------------*/

	header {
		height: 52px;
	}

	header h1 a img {
		top: 5px;
		left: 10px;
		height: 36px;
	}

	header .h_menu {
		display: none;
	}

	header #info {
		display: none;
	}

	/*
#sub_top.sample {
	background-image: url(../img/sub_top_sample_sp.jpg);
}
#sub_top.faq {
	background-image: url(../img/sub_top_faq_sp.jpg);
}
#sub_top.contact {
	background-image: url(../img/sub_top_contact_sp.jpg);
}
#sub_top.news {
	background-image: url(../img/sub_top_news_sp.jpg);
}
#sub_top.concept {
	background-image: url(../img/sub_top_concept_sp.jpg);
}
#sub_top.works {
	background-image: url(../img/sub_top_works_sp.jpg);
}
#sub_top.about {
	background-image: url(../img/sub_top_about_sp.jpg);
}
*/
	#sub_top.sample:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.faq:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.contact:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.news:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.concept:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.works:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.about:before {
		background: url(../img/contact.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.recruit_career:before {
		background: url(../img/slide/unnamed4.jpg) center no-repeat;
		background-size: cover;
	}
	#sub_top.contact_recruit:before {
		background: url(../img/slide/unnamed4.jpg) center no-repeat;
		background-size: cover;
	}

	/*
フッター
-------------------------------------------*/
	footer {
		border-bottom-width: 60px;
	}

	footer .cont_wrap .f_box {
		width: 50%;
		text-align: center;
	}
	footer .cont_wrap .f_box.lg {
		width: 100%;
	}

	.no_sp {
		display: none;
	}
}
/*-- /～960px --*/

@media only screen and (max-width: 768px) {
	.content .obi_001 h2 {
		color: #fff;
	}

	.pager {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	.pager .pagination li {
		display: none;
	}

	.pager .pagination li.pre,
	.pager .pagination li.next {
		display: inline-block;
		width: 40%;
		height: 40px;
		text-align: center;
	}

	.pager .pagination li.pre a,
	.pager .pagination li.next a {
		width: 100%;
		text-align: center;
	}

	.pager .pagination li.pre span::after {
		content: "　前の10件へ";
	}

	.pager .pagination li.next span::before {
		content: "次の10件へ　";
	}

	.works_list li {
		width: 50%;
		padding: 10px;
	}

	.g_list li {
		width: 50%;
	}

	.img_center span {
		font-size: 14px;
		padding: 5px;
	}

	.img_center div {
		font-size: 12px;
		padding: 20px;
	}

	dl.faq {
		width: 96%;
	}

	dl.faq dt {
		font-size: 18px;
		width: 90%;
		margin-left: 10%;
	}

	dl.faq dd {
		width: 90%;
	}
	#sub_top {
		height: 180px;
		padding-top: 40px;
	}

	.content {
		padding-top: 20px;
		/*padding-bottom: 20px;*/
	}

	.content p {
		margin-bottom: 20px;
		margin-top: 10px;
		margin-right: 20px;
		margin-left: 20px;
		font-size: 0.9em;
	}

	
	
}

@media screen and (max-width: 640px) {
	.sh_640_max {
		display: block;
	}
	.sh_640_min {
		display: none;
	}
	.g_list {
		display: block;
		/*justify-content:space-around;*/
	}

	.g_list li {
		display: block;
		width: 90%;
		padding: 10px;
		margin: auto;
	}
	.g_list li a {
		height: 200px;
	}

	.g_list li a img {
		height: 200px;
	}

	.g_list_bicycle {
		display: block;
	}
	.g_list_bicycle li {
		display: block;
		width: 90%;
		padding: 10px;
		margin: auto;
	}
	.g_list_bicycle li a {
		height: 200px;
	}

	.g_list_bicycle li a img {
		height: 200px;
	}

	.g_list_map {
		display: block;
	}
	.g_list_map li {
		display: block;
		margin: auto;
		width: 90%;
		padding: 20px;
	}

	.content h2 {
		/*	font-size: 25px;
		line-height: 2.2;
		margin-bottom: 20px;
		border-bottom-width: 1px;
		border-bottom-style: dotted;
		border-bottom-color: #15394A;
		font-weight: 600;
		letter-spacing: 1px;
		color: #666;
		text-align: center;
		/*font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;*/
		/*	padding-top: 15px;
		padding-right: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		clear: both;*/
	}
	.content h4 {
		background: linear-gradient(transparent 60%, #c8f1ff 60%);
		padding: 0 20px 0 20px;
		font-size: 1.5em;
		/*font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;*/
		text-align: center;
		font-weight: normal;
		color: #585858;
		margin: 20px 0 35px 0;
		font-size: 1.3em;
	}

	.content h4 span {
		font-size: 0.6em;
	}

	.box_cont_recruit .box_r_in {
		width: 100%;
		min-height: 200px;
		padding: 0px;
		border: 1px solid #cfdee0;
		margin-bottom: 30px;
	}

	.box_cont_recruit .box_r_in:last-child {
		width: 100%;
		min-height: 200px;
		padding: 0px;
		border: 1px solid #cfdee0;
		margin-bottom: 30px;
	}
	.box_cont_recruit .box_r_in:last-child img {
		width: 100%;
		object-fit: cover;
		max-height: 100%;
	}

	.box_cont_recruit .box_r_in:last-child {
		display: block;
	}
	.img_left_min {
		float: left;
		padding-top: 20px;
		padding-right: 20px;
		padding-left: 15px;
		padding-bottom: 5px;
		max-width: 50%;
	}
	.img_right_min {
		float: right;
		padding-top: 20px;
		padding-right: 15px;
		padding-left: 20px;
		padding-bottom: 5px;
		max-width: 50%;
	}

	.recruit_min {
		border: 10px solid #fff;
		width: 100%;
	}
	.h_sns {
		width: 100%;
		display: -webkit-box;
		display: -moz-box;
		display: -webkit-flexbox;
		display: -moz-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: -moz-flex;
		display: flex;
		-webkit-box-lines: multiple;
		-moz-box-lines: multiple;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		top: auto;
		bottom: 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		padding-right: 60px;
	}

	.h_sns li {
		width: 50%;
	}
	.h_sns li a {
		width: 100%;
		text-align: center;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.h_sns li a span {
		font-size: 0.8em;
		padding-left: 10px;
	}
	footer .box_pr {
		/*margin-bottom:50px;*/
	}

	#index_top #top_catch {
		top: 25%;
		left: 5%;
		width: 90%;
		height: 50%;
		margin-top: 0px;
		margin-left: 0px;
	}

	#index_top #top_catch h2 {
		font-size: 40px;
	}

	#index_top #top_catch p {
		font-size: 12px;
	}

	
	.img_left,
	.img_right {
		float: none;
		display: block;
		margin-left: auto;
		margin-right: auto;
		padding-left: 10px;
		padding-right: 10px;
		padding-bottom: 10px;
		max-width: 100%;
	}

	.pick_up ul li {
		width: 100%;
	}

	.content .ul_news li span.date {
		padding-right: 0px;
		display: block;
	}

	/*さふぁり*/

	.obi_001 {
		display: none;
	}
	/*さふぁりここまで*/
	.obi_001_sp {
		background-image: url(../img/obi_001_sp.jpg);
		padding-left: 10px;
		padding-right: 10px;
		display: block;

		background-repeat: no-repeat;
		text-align: center;
		padding-top: 15%;
		padding-right: 20px;
		padding-bottom: 15%;
		padding-left: 20px;
		background-size: cover;
		background-attachment: fixed;
		background-position: center bottom;
		color: #fff;
		/*margin-top: 50px;
	margin-bottom: 50px;*/
	}
	_::-webkit-full-page-media,
	_:future,
	:root .obi_001_sp {
		background-image: url(../img/obi_001_sp.jpg);
		background-attachment: scroll;
	}
	@media screen and (-webkit-min-device-pixel-ratio: 0) {
		::i-block-chrome,
		.obi_001_sp {
			background-image: url(../img/obi_001_sp.jpg);
			background-attachment: scroll;
		}

		.obi_002 {
			height: 700px;
		}
	}

	.obi_001_sp p {
		text-align: center;
		margin-left: 15px;
		margin-right: 15px;
		font-size: 14px;
	}
	.obi_001_sp h2 {
		color: #fff;
	}

	.obi_002 {
		background-image: url(../img/obi_002_sp.jpg);
		padding: 0 0 100%;
	}
	_::-webkit-full-page-media,
	_:future,
	:root .obi_001_sp {
		background-image: url(../img/obi_002_sp.jpg);
		background-attachment: scroll;
		padding: 0 0 100%;
	}
	@media screen and (-webkit-min-device-pixel-ratio: 0) {
		::i-block-chrome,
		.obi_001_sp {
			background-image: url(../img/obi_002_sp.jpg);
			background-attachment: scroll;
			padding: 0 0 100%;
		}
	}

	.loop_wrap {
		width: 400%;
	}

	.box_cont {
		padding-right: 10px;
		padding-left: 10px;
	}

	.box_cont .box_c_in {
		width: 100%;
		padding: 5px;
	}

	.content .cont_wrap .txt_box {
		margin-left: 0px;
		margin-right: 0px;
	}

	.content .obi_001 h2 {
		color: #fff;
	}
}

@media only screen and (max-width: 599px) {
}
@media screen and (max-width: 480px) {
	.box_cont_list .box_f_in {
		width: 100%;
		min-height: 200px;
		padding: 0px;
		border: 1px solid #cfdee0;
		margin-bottom: 30px;
	}

	.footer05 .wrap {
		width: 100%;
		padding: 0 0;
		box-sizing: border-box;
	}
	.footer05 .wrap h4 {
		border: none;
	}
	.footer05 .wrap .box {
		width: 100%;
		text-align: center;
	}
	.footer05 .wrap .box:nth-child(1) {
		width: 100%;
		text-align: center;
	}
	.footer05 .wrap .box:nth-child(2) {
		width: 100%;
		text-align: center;
	}

	.footer05 .wrap .box:nth-child(3) {
		width: 100%;
		text-align: center;
	}
	.footer05 .wrap .box ul {
		border-top: 1px #ffffff solid;
	}
	.footer05 .wrap .box .f_bn {
		border-top: 1px #c4c4c400 solid;
	}

	.footer05 .wrap .box ul li a {
		display: block;
		padding: 5px 10px;
		/*border-bottom: 1px #ffffff dotted;*/
		width: 97%;
		margin-right: auto;
		margin-left: auto;
	}
	.footer05 .wrap .box .f_bn li a {
		border-bottom: 1px #fff solid;
	}

	footer ul.f_bn li {
		width: 300px;
		margin-bottom: 10px;
	}

	.footer05 .wrap .box ul {
		margin: 0;
		padding: 0 10px 20px;
		list-style: none;
	}

	input,
	textarea {
		max-width: 300px !important;
	}

	.content table.table_01 th,
	.content table.table_01 td {
		width: 100% !important;
		display: block;
	}

	.content table.table_01 th {
		background-color: #f6f6f6;
	}

	#index_top #top_catch h2 {
		font-size: 30px;
	}

	#sub_top {
		font-size: 24px;
	}

	.content h2 {
		font-size: 24px;
	}

	.content .obi_001 h2 {
		font-size: 22px;
	}
}

/*スクロールバー*/
::-webkit-scrollbar {
	width: 10px;
}
::-webkit-scrollbar-track {
	background-color: #ccc;
	border: #e6c8d4 solid 1px;
}
::-webkit-scrollbar-thumb {
	background-color: #f18cb6;
	border-radius: 50px;
	border: #bd2864b4 solid 1px;
}
/*スクロールバー終わり*/

iframe {
	filter: hue-rotate(325deg);
	-webkit-filter: hue-rotate(325deg);
}

/*丸がボタンに変形する*/

.btntransform {
	/*丸の基点とするためrelativeを指定*/
	position: relative;
	/*ボタンの形状*/
	display: inline-block;
	padding: 0 15px 0 15px;
	line-height: 50px;
	color: #000000;
	text-decoration: none;
	outline: none;
}

/* 丸が動く */
.btntransform::before {
	content: "";
	/*絶対配置で丸の位置を決める*/
	position: absolute;
	left: 0;
	z-index: 0;
	/*丸の形状*/
	width: 50px;
	height: 50px;
	background: #00f65268;
	border-radius: 25px;
	/*アニメーションの指定*/
	transition: 0.3s ease-out;
}

/*hoverした際の形状*/
.btntransform:hover::before {
	width: 100%;
}
.btntransform:hover {
	color: #000;
	text-shadow: 0 -1px #000;
}
/* 矢印の形状 */
/*.btntransform::after{
	position: absolute;
    content: '';
    top: 1.3em;
    right: -15px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(45deg);
}
*/

/*
コンテンツ大ボタン
-------------------------------------------*/
.btn_cnt a {
	font-size: 16px;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
	display: block;
	width: 280px;
	background-color: #d4086b;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
	line-height: 22px;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: both;
	font-weight: bold;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.btn_cnt a i {
	padding-right: 10px;
}
.btn_cnt a:hover {
	color: #d4086b;
	background-color: #fff;
}

.btn_cnt.rt a {
	float: right;
	max-width: 220px;
	margin-right: 10px;
}

@media screen and (min-width: 960px) {
	/*
PCグローバルナビ
-------------------------------------------*/
	#g-nav {
		position: absolute;
		right: 10px;
		top: 20px;
		width: auto;
		margin-left: 200px;
		display: block !important;
		z-index: 1000;
	}
	#g-nav.fixed {
		top: 10px;
	}
	header.fixed #g-nav.txt_w {
		top: 10px;
	}
	#g-nav ul li {
		display: inline;
	}

	#g-nav li a {
		width: auto;
		padding: 10px;
		line-height: 30px;
		display: block;
		color: #111;
		text-decoration: none;
		text-align: center;
		position: relative;
		float: left;
		letter-spacing: 1px;
		font-size: 14px;
		font-weight: bold;
	}

	#g-nav.fixed li a {
		line-height: 15px;
	}

	#g-nav li a::before {
		display: block;
		height: 2px;
		position: absolute;
		top: 2px;
		width: 70%;
		left: 15%;
		background-color: rgba(17, 187, 221, 0);
		content: "";
		-webkit-transition: 0.2s linear;
		-moz-transition: 0.2s linear;
		transition: 0.2s linear;
	}

	#g-nav li a:hover::before {
		background-color: rgb(221, 17, 17);

		top: 0px;
		width: 80%;
		left: 10%;
	}

	#g-nav li a:hover {
		color: rgb(14, 3, 116) !important;
	}

	#g-nav.txt_w li a {
		color: #fff;
	}

	header.fixed #g-nav.txt_w li a {
		color: #111;
		line-height: 15px;
	}

	#g-nav li.contact a {
		background-color: #1bd;
		/*background-color: rgb(255, 151, 203);*/
		color: #fff !important;
		padding-left: 40px;
		padding-right: 40px;
		margin-left: 10px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border: #1bd solid 1px;
		margin-top: -2px;
	}

	#g-nav li.contact a:hover {
		background-color: #fff;
		color: #1bd !important;
		box-shadow: 0 0 7px #0000003e;
	}
	#g-nav li.contact a::before {
		display: none;
	}

	#g-nav li.contact_white a {
		background-color: #fff;
		/*background-color: rgb(255, 151, 203);*/
		color: #1bd !important;
		padding-left: 40px;
		padding-right: 40px;
		margin-left: 10px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border: #1bd solid 1px;
		margin-top: -2px;
	}

	#g-nav li.contact_white a:hover {
		background-color: #1bd;
		color: #fff !important;
		border: #fff solid 1px;
		box-shadow: 0 0 5px #00000093;
	}
	#g-nav li.contact_white a::before {
		display: none;
	}
	
	
	/*ここから新しく作成*/
/*2階層目を持つliの矢印の設定*/
#g-nav ul li.has-child:hover::before{
	content:'';
	position: absolute;
	left:110px;
	top:30px;
	width:6px;
	height:6px;
	border-top: 2px solid #0c0090;
    border-right:2px solid #0c0090;
    transform: rotate(135deg);
}
	/*下の階層を持っているulの指定*/
#g-nav li.has-child ul{
    /*絶対配置で位置を指定*/
	position: absolute;
	left:15px;
	top:52px;
	z-index: 4;
    /*形状を指定*/
	background:#fff;
	width:480px;
    /*はじめは非表示*/
	visibility: hidden;
	opacity: 0;
    /*アニメーション設定*/
	transition: all .3s;
}

/*hoverしたら表示*/
#g-nav li.has-child:hover > ul,
#g-nav li.has-child ul li:hover > ul,
#g-nav li.has-child:active > ul,
#g-nav li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
#g-nav li.has-child ul li a{
	color: #14758e;
	/*border-bottom:solid 1px rgba(255,255,255,0.6);*/
	width: 120px;
}

#g-nav li.has-child ul li:last-child > a{
 border-bottom:none;
 }

#g-nav li.has-child ul li a:hover,
#g-nav li.has-child ul li a:active{
	background:#28BFE7;
	color: #fff;
}

	
	
	
}

@media screen and (min-width: 1200px) {
	header h1 a img {
		left: 50%;
		margin-left: -600px;
	}

	header #g-nav {
		right: 50%;
		margin-right: -600px;
	}
}

@media screen and (max-width: 959px) {
	/*
グローバルナビ
-------------------------------------------*/
	/*========= ナビゲーションのためのCSS ===============*/

	/*アクティブになったエリア*/
	#g-nav.panelactive {
		/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
		position: fixed;
		z-index: 999;
		top: 0;
		width: 100%;
		height: 100vh;
	}
body.stay{
		overflow: hidden;
	}
	/*丸の拡大*/
	.circle-bg {
		position: fixed;
		z-index: 3;
		/*丸の形*/
		width: 100px;
		height: 100px;
		border-radius: 50%;
		background: rgba(17, 187, 221, 0.929);
		/*丸のスタート位置と形状*/
		transform: scale(0); /*scaleをはじめは0に*/
		right: -50px;
		top: -50px;
		transition: all 0.6s; /*0.6秒かけてアニメーション*/
	}

	.circle-bg.circleactive {
		transform: scale(50); /*クラスが付与されたらscaleを拡大*/
	}

	/*ナビゲーションの縦スクロール*/
	#g-nav-list {
		display: none; /*はじめは表示なし*/
		/*ナビの数が増えた場合縦スクロール*/
		position: fixed;
		z-index: 999;
		width: 100%;
		height: 100vh;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	#g-nav.panelactive #g-nav-list {
		display: block; /*クラスが付与されたら出現*/
		overflow-x: hidden;
	}

	/*ナビゲーション*/
	#g-nav ul {
		opacity: 0; /*はじめは透過0*/
		/*ナビゲーション天地中央揃え※レイアウトによって調整してください。不必要なら削除*/
		position: absolute;
		z-index: 999;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 50%;
		min-width: 500px;
	}

	/*背景が出現後にナビゲーションを表示*/
	#g-nav.panelactive ul {
		opacity: 1;
	}

	/* 背景が出現後にナビゲーション li を表示※レイアウトによって調整してください。不必要なら削除*/
	#g-nav.panelactive ul li {
		animation-name: gnaviAnime;
		animation-duration: 1s;
		animation-delay: 0.2s; /*0.2 秒遅らせて出現*/
		animation-fill-mode: forwards;
		opacity: 0;
	}
	@keyframes gnaviAnime {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}

	/*リストのレイアウト設定*/
	#g-nav li {
		text-align: center;
		list-style: none;
		/*border-bottom: 1px solid #fff;*/
	}

	#g-nav li a {
		color: #fff;
		font-size: 1.1em;
		text-decoration: none;
		padding: 10px;
		display: block;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		font-weight: bold;
	}

	#g-nav li a:hover {
		text-shadow: 0 0 3px #fff;
	}
	
	
	/*ここから新しい*/
		#g-nav li.has-child ul{
  	position: relative;
		top:10px;	
			
			padding: 0;
			font-size: 0.7em;
			line-height:1;
			display: flex;
			justify-content:center;
	/*left:0;
	top:0;*/
	width:100%;
/*	visibility:visible;/*JSで制御するため一旦表示*/
/*	opacity:1;/*JSで制御するため一旦表示*/
/*	display: none;/*JSのslidetoggleで表示させるため非表示に*/
/*	transition:none;/*JSで制御するためCSSのアニメーションを切る*/
}
	
	
	#g-nav li.has-child ul li{
		border-right: 1px solid rgba(255, 255, 255, 0.66);
	}
	#g-nav li.has-child ul li:first-child{
		border-left: 1px solid rgba(255, 255, 255, 0.66);
	}
	#g-nav li.has-child ul li a{
		color:#fff;
		font-weight: bold;
	}
	/*
	#g-nav li.has-child ul li:hover{
		border-radius: 50px;transition: 1s;
	}
	*/
/*矢印の位置と向き*/

	#g-nav ul li.has-child::before{
	left:20px;	
}

	#g-nav ul ul li.has-child::before{
    transform: rotate(135deg);
	left:20px;
}
    
	#g-nav ul li.has-child.active::before{
    transform: rotate(-45deg);
}
	
	
	

	.sh {
		display: block;
	}

	メニューシャドウ -------------------------------------------*/ .bg_bl {
		background-color: #fff;
		height: 100%;
		width: 100%;
		opacity: 0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha( opacity=80 )";
		display: block;
		position: fixed;
		z-index: 2000;
	}
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
	position: fixed;
	top: 0;
	right: 10px;
	z-index: 9999; /*ボタンを最前面に*/
	cursor: pointer;
	width: 50px;
	height: 50px;
}

/*×に変化*/
.openbtn span {
	display: inline-block;
	transition: all 0.4s;
	position: absolute;
	left: 14px;
	height: 3px;
	border-radius: 2px;
	background-color: #056591e3;
	width: 45%;
}

.openbtn span:nth-of-type(1) {
	top: 15px;
}

.openbtn span:nth-of-type(2) {
	top: 23px;
}

.openbtn span:nth-of-type(3) {
	top: 31px;
}

.openbtn.active span:nth-of-type(1) {
	top: 18px;
	left: 18px;
	transform: translateY(6px) rotate(-45deg);
	width: 30%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
	top: 30px;
	left: 18px;
	transform: translateY(-6px) rotate(45deg);
	width: 30%;
}

/*同じページの移動pointの設置*/
.a_point {
	margin-top: -90px;
	padding-bottom: 90px;
	display: block;
}

.security_policy {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	width: 90%;
}
.security_policy li {
	text-align: center;
	margin: 5% 1% 1% 1%;

	font-size: 0.8em;
}

.security_policy li a {
	text-decoration: none;
	color: #fff;
	background-color: #333;
	padding: 5px 20px;
}
.security_policy li .size{
	padding-right: 22.5px;
}
.security_policy li a:hover {
	color: #333;
	background-color: #ffffff00;
}