@charset "utf-8";

/*
Theme Name: kamata_theme
Theme URI: http://kamatakenchiku.com/
Description: カマタ建築株式会社
Version: 1.0
Author: Kunishige
*/

/**
/* CSS RESET START
----------------------------------------------- */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;vertical-align: baseline;box-sizing: border-box;-webkit-box-sizing: border-box;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
html{overflow-y: scroll;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
input, textarea{margin: 0;padding: 0;outline: none;}
ol, ul{list-style:none;}
table{border-collapse: collapse; border-spacing:0;width:100%;}
caption, th{text-align: left;}
img {vertical-align: middle;max-width:100%;height: auto;}
.clearfix {min-height: 1px;}
.clearfix:after {content: "."; display: block;clear: both;height: 0;visibility: hidden;}
.both{clear:both;}


html, *{
  margin:0;
  padding:0;
  box-sizing: border-box;
}

html{
	scroll-behavior: smooth;
}

body {
    font-family: "游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    font-weight: 400;
	font-size: 16px;
	margin: 0;
	padding: 0;
	line-height: 1.6;
	letter-spacing: 0.04em;
}

#Wrapper{
	width: 100%;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
/*ヘッダー*/
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
::before , ::after {
	box-sizing: inherit;
}
button {
	margin: 0;
	padding: 0;
	outline: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	vertical-align: middle;
	text-align: inherit;
	font: inherit;
	-webkit-appearance: none;
	appearance: none;
}
a{
	text-decoration: none;
}

/**************** 以下、ハンバーガーボタンのスタイリング ****************/

.btn {
	/* ボタンの配置位置  */
	/*position: fixed;
	top: 32px;
	right: 16px;
	/* 最前面に */
	z-index: 1000;
	/* ボタンの大きさ  */
	width: 48px;
	height: 48px;
}
/***** 真ん中のバーガー線 *****/
.btn-line {
	display: block;
	/* バーガー線の位置基準として設定 */
	position: relative;
	/* 線の長さと高さ */
	width: 100%;
	height: 4px;
	/* バーガー線の色 */
	background-color: #d6d5d5;
	transition: .2s;
}
/***** 上下のバーガー線 *****/
.btn-line::before , .btn-line::after {
	content: "";
	/* 基準線と同じ大きさと色 */
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #d6d5d5;
	transition: .5s;
}
.btn-line::before {
	/* 上の線の位置 */
	transform: translateY(-16px);
}
.btn-line::after {
	/* 下の線の位置 */
	transform: translateY(16px);
}
/***** メニューオープン時 *****/
.btn-line.open {
	/* 真ん中の線を透明に */
	background-color: transparent;
}
.btn-line.open::before , .btn-line.open::after {
	content: "";
	background-color: #333;
	transition: .2s;
}
.btn-line.open::before {
	/* 上の線を傾ける */
	transform: rotate(45deg);
}
.btn-line.open::after {
	/* 上の線を傾ける */
	transform: rotate(-45deg);
}
/**************** ここまで、ハンバーガーボタンのスタイリング ****************/
/**************** 以下、メニューのスタイリング ****************/
.menu {
	/* メニューを縦に */
	display: flex;
	flex-direction: column;
	position: fixed;
	/* メニューの位置マイナス指定で画面外に */
	right: -100%;
	width: 100%;
	height: 100vh;
	background-color: #306E76;
	color: #efefef;
	transition: .3s;
	padding: 30px;
}
.menu-list {
	/* メニューテキスト位置をリスト内中心に */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    font-weight: lighter;
}
.menu-list img{
	width: 200px;
	height: auto;
}
.menu-list:hover {
	background-color: rgba(255, 255, 255, .5);
	color: #333;
	cursor: pointer;
	transition: .3s;
}
/***** メニューオープン時位置0にして画面内に *****/
.menu.open {
	position: absolute;
	right: 0;
	z-index: 100;
}
/* 600px以上はハンバーガーボタン非表示、ヘッダー固定 */
@media screen and (min-width: 728px) {
	.btn {
		display: none;
	}
}

.top_header{
	width: 100vw;
	display: flex;
	background-color: #1D2025;
	position: fixed; /* ウィンドウを基準に画面に固定 */
    top: 0; /* 上下の固定位置を上から0pxにする */
    left: 0; /* 左右の固定位置を左から0pxにする */
	z-index: 10;
}
.top_list{
	margin-left: auto;
	flex-direction: row;
	height: 100px;
	display: flex;
	justify-content:space-around;
	margin-right: 50px;
}
.top_list li{
	list-style: none;
	font-size: 16px;
	color: #fff;
	text-align: center;
	margin-top: 35px;
	margin-left: 20px;
	margin-right: 25px;
}
.top_list a{
	color: #fff;
}
.top_logo{
	width: 30%;
	height: 100px;
}
.top_logo li{
	list-style: none;
	font-size: 18px;
	color: #fff;
	text-align: center;
	margin-top: 35px;
}
.top_logo a{
	color: #fff;
}
@media screen and (max-width: 728px) {
	.top_header{
		background-color: #1D2025;
	}
	.top_logo{
		width: 100vw;
		height: 100px;
		margin-left: 60px;
	}
	.top_logo li{
		list-style: none;
		font-size: 20px;
		color: #fff;
		text-align: center;
		margin-top: 35px;
	}
	.top_list{
		display: none;
	}
	.menu a{
		color: #fff;
	}
}
@media only screen and (min-width: 729px) and (max-width: 1024px){
	.top_list{
		height: 80px;
		margin-right: 30px;
	}
	.top_logo{
		width: 30%;
		height: 80px;
	}
	.top_logo li{
		margin-top: 30px;
	}
	.top_list li{
		margin-top: 30px;
		margin-left: 15px;
		margin-right: 20px;
	}
}
/*ヘッダー終わり*/


@media screen and (max-width: 728px) {
/*ヘッダー*/
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
::before , ::after {
	box-sizing: inherit;
}
button {
	margin: 0;
	padding: 0;
	outline: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	vertical-align: middle;
	text-align: inherit;
	font: inherit;
	-webkit-appearance: none;
	appearance: none;
}
/**************** 以下、ハンバーガーボタンのスタイリング ****************/

.btn {
	/* ボタンの配置位置  */
	/*position: fixed;
	top: 28px;
	right: 16px;
	/* 最前面に */
	/* ボタンの大きさ  */
	width: 58px;
	height: 48px;
	margin: 25px 20px 0 0;
}
/***** 真ん中のバーガー線 *****/
.btn-line {
	display: block;
	/* バーガー線の位置基準として設定 */
	position: relative;
	/* 線の長さと高さ */
	width: 100%;
	height: 4px;
	/* バーガー線の色 */
	background-color: #d6d5d5;
	transition: .2s;
}
/***** 上下のバーガー線 *****/
.btn-line::before , .btn-line::after {
	content: "";
	/* 基準線と同じ大きさと色 */
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #d6d5d5;
	transition: .5s;
}
.btn-line::before {
	/* 上の線の位置 */
	transform: translateY(-16px);
}
.btn-line::after {
	/* 下の線の位置 */
	transform: translateY(16px);
}
/***** メニューオープン時 *****/
.btn-line.open {
	/* 真ん中の線を透明に */
	background-color: transparent;
}
.btn-line.open::before , .btn-line.open::after {
	content: "";
	background-color: #333;
	transition: .2s;
}
.btn-line.open::before {
	/* 上の線を傾ける */
	transform: rotate(45deg);
}
.btn-line.open::after {
	/* 上の線を傾ける */
	transform: rotate(-45deg);
}
/**************** ここまで、ハンバーガーボタンのスタイリング ****************/
/**************** 以下、メニューのスタイリング ****************/
.menu {
	/* メニューを縦に */
	display: flex;
	flex-direction: column;
	position: fixed;
	/* メニューの位置マイナス指定で画面外に */
	right: -100%;
	width: 	100vw;
	height: 100vh;

	color: #efefef;
	transition: .3s;
}
.menu-list {
	/* メニューテキスト位置をリスト内中心に */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
.menu-list:hover {
	background-color: rgba(255, 255, 255, .5);
	color: #333;
	cursor: pointer;
	transition: .3s;
}
/***** メニューオープン時位置0にして画面内に *****/
.menu.open {
	position: absolute;
	right: 0;
}
}

/*FV*/
.top_img_back{

}

.top_img_back img{
	width: 100%;
	height: 600px;
}

@media screen and (max-width: 728px) {
	.top_img_back{

	}
	
	.top_img_back img{
		width: 100%;
		height: 550px;
		margin-bottom: -10px;
		object-fit: cover;
	}
}


/*コンセプト*/
.top_concept{
	width: 100vw;
	height: 550px;
	background-color: #1D2025;
	margin-top: -10px;
}
.top_concept_title{
	width: 100vw;
	text-align: center;
	font-size: 35px;
	color: #fff;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	font-weight: 50;
	padding-top: 50px;
}
.top_concept_contents{
	width: 100vw;
	text-align: center;
	font-size: 15px;
	color: #fff;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: 50;
	padding-top: 50px;
	line-height: 30px;
}
@media screen and (min-width: 728px) {
.top_concept_br_sp{
	display: none;
}
}
  /* 001 */
.button001{
	margin-top: 80px;
}
.button001 a {
    background: #016D79;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 300px;
    padding: 15px 35px;
    color: #FFF;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    transition: 0.3s ease-in-out;
    font-weight: lighter;
	text-decoration: none;
	letter-spacing:3px;
}
.button001 a:hover {
    background: #313131;
    color: #FFF;
}
.button001 a:after {
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    transition: 0.3s ease-in-out;
}
.button001 a:hover:after {
    border-color: #016D79;
}

@media screen and (max-width: 728px) {
	.top_concept{
		width: 100vw;
		height: 600px;
		background-color: #1D2025;
		margin-top: -10px;
	}
	.top_concept_title{
		width: 100vw;
		text-align: center;
		font-size: 30px;
		color: #fff;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_concept_contents{
		width: 100vw;
		text-align: center;
		font-size: 15px;
		color: #fff;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-weight: 50;
		padding-top: 50px;
		line-height: 35px;
	}
	
	
	  /* 001 */
	.button001{
		margin-top: 50px;
	}
	.button001 a {
		background: #016D79;
		border-radius: 3px;
		position: relative;
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 0 auto;
		max-width: 300px;
    	padding: 15px 35px;
		color: #FFF;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		transition: 0.3s ease-in-out;
		font-weight: 500;
		text-decoration: none;
		letter-spacing:3px;
	}
	.button001 a:hover {
		background: #313131;
		color: #FFF;
	}
	.button001 a:after {
		transform: rotate(45deg) translateY(-50%);
		position: absolute;
		top: 50%;
		right: 20px;
		transition: 0.3s ease-in-out;
	}
	.button001 a:hover:after {
		border-color: #016D79;
	}
}

/*ニュース*/
.top_news{
	width: 100vw;
	height: 470px;
	background-color: #FFF;
	margin-top: -10px;
}
.top_news_title{
	width: 100vw;
	text-align: center;
	font-size: 35px;
	color: #333;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	font-weight: 50;
	padding-top: 50px;
}
.top_news_subcontents{
	display: flex;
}
.top_news_contents{
	width: 450px;
	margin: 0 auto;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	padding-top: 30px;
	display: flex;
	text-align: center;
}
.top_news_date{
	width: 35%;
	text-align: center;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-size: 16px;
	font-weight: 550;
}
.top_news_topic{
	width: 65%;
	display: flex;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-size: 16px;
	border-bottom:solid ;
	border-color: #333;
	border-width: 2px;
	padding-bottom: 3px;
	font-weight: 550;
}
.top_news_article a{
	color: #333;
}
.top_news_arrow{
	width: 10%;
	margin-left: auto;
}
.top_news_arrow img{
	width: 15px;
	margin-left: 15px;
}


  /* 002 */
.button002{
	margin-top: 50px;
	margin-bottom: 100px;
}
.button002 a {
    background: #000;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
	max-width: 300px;
    padding: 15px 35px;
    color: #FFF;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    transition: 0.3s ease-in-out;
    font-weight: 500;
	text-decoration: none;
	letter-spacing:3px;
}
.button002 a:hover {
    background: #313131;
    color: #FFF;
}
.button002 a:after {
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    transition: 0.3s ease-in-out;
}
.button002 a:hover:after {
    border-color: #016D79;
}

@media screen and (max-width: 728px) {
	.top_news{
		width: 100vw;
		height: 550px;
		background-color: #FFF;
		margin-top: -10px;
	}
	.top_news_title{
		width: 100vw;
		text-align: center;
		font-size: 30px;
		color: #333;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_news_contents{
		display: block;
		width: 80%;
		text-align: center;
		margin: 0 auto;
	}
	.top_news_date{
		width: 30%;
		text-align: center;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 16px;
	}
	.top_news_topic{
		width: 100%;
		margin: 0 auto;
		text-align: center;
		display: flex;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 16px;
		border-bottom:solid ;
		border-color: #333;
		border-width: 2px;
		padding-bottom: 3px;
	}
	.top_news_article{
		text-align: center;
	}
	.top_news_article a{
		color: #333;
	}
	  /* 002 */
	.button002{
		margin-top: 70px;
	}
	.button002 a {
		background: #000;
		border-radius: 3px;
		position: relative;
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 0 auto;
		max-width: 300px;
    	padding: 15px 35px;
		color: #FFF;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		transition: 0.3s ease-in-out;
		font-weight: 500;
		text-decoration: none;
		letter-spacing:3px;
	}
	.button002 a:hover {
		background: #313131;
		color: #FFF;
	}
	.button002 a:after {
		transform: rotate(45deg) translateY(-50%);
		position: absolute;
		top: 50%;
		right: 20px;
		transition: 0.3s ease-in-out;
	}
	.button002 a:hover:after {
		border-color: #016D79;
	}
}

/*事業内容*/
.top_service{
	width: 100vw;
	height: 400px;
	background-color: #1D2025;
	margin-top: -10px;
	display: flex;
}
.top_service .fadein{
	width: 80vw;
	margin: 0 auto;
}
.top_service_size{
	width: 900px;
	display: flex;
	text-align: center;
	margin: 0 auto;
}
.top_service_img{
	width: 50%;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_service_img img{
	width: 350px;
	height: auto;
	align-items: center;
	margin-top: 70px;
}
.top_service_flex{
	width: 50%;
	margin-top: 0px;
}
.top_service_title{
	text-align: center;
	font-size: 35px;
	color: #fff;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	font-weight: 50;
	padding-top: 50px;
}
.top_service_contents{
	width: 70%;
	text-align: center;
	margin: 0 auto;
	font-size: 15px;
	color: #fff;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: 50;
	padding-top: 30px;
	line-height: 30px;
}

  /* 003 */
  .button003{
	margin-top: 30px;
}
.button003 a {
    background: #016D79;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
	max-width: 300px;
    padding: 15px 35px;
    color: #FFF;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    transition: 0.3s ease-in-out;
    font-weight: 500;
	text-decoration: none;
	letter-spacing:3px;
}
.button003 a:hover {
    background: #313131;
    color: #FFF;
}
.button003 a:after {
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    transition: 0.3s ease-in-out;
}
.button003 a:hover:after {
    border-color: #016D79;
}

@media screen and (max-width: 728px) {
	.top_service{
		width: 100vw;
		height: 70%;
		background-color: #1D2025;
		margin-top: -10px;
		display: block;
	}
	.top_service .fadein{
		width: 100%;
		margin: 0 auto;
	}
	.top_service_size{
		width: 100vw;
		display: block;
		text-align: center;
		margin: 0 auto;
	}
	.top_service_img{
		width: 100%;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.top_service_img img{
		width: 100% !important;
		height: 250px;
		align-items: center;
		object-fit: cover; 
		margin: 0 auto;
	}
	.top_service_flex{
		width: 100%;
	}
	.top_service_title{
		text-align: center;
		font-size: 35px;
		color: #fff;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_service_contents{
		width: 90%;
		text-align: center;
		margin: 0 auto;
		font-size: 15px;
		color: #fff;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-weight: 50;
		padding-top: 30px;
		line-height: 30px;
	}
	.button003{
		margin-top: 50px;
		padding-bottom: 100px;
	}
	.button003 a {
		background: #016D79;
		border-radius: 3px;
		position: relative;
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 0 auto;
		max-width: 300px;
    	padding: 15px 35px;
		color: #FFF;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		transition: 0.3s ease-in-out;
		font-weight: 500;
		text-decoration: none;
		letter-spacing:3px;
	}
	.button003 a:hover {
		background: #313131;
		color: #FFF;
	}
	.button003 a:after {
		transform: rotate(45deg) translateY(-50%);
		position: absolute;
		top: 50%;
		right: 20px;
		transition: 0.3s ease-in-out;
	}
	.button003 a:hover:after {
		border-color: #016D79;
	}
}
.top_service_img2 img{
	width: 100vw;
	height: 400px;
	object-fit: cover; 
}
@media screen and (max-width: 728px) {
	.top_service_img2 img{
		width: 100vw;
		height: 250px;
		object-fit: cover; 
	}
}

/*求人*/
.top_kyuujin{
	width: 100vw;
	height: 680px;
	background-color: #1D2025;
	margin-top: -10px;
}
.top_kyuujin_title{
	width: 100vw;
	text-align: center;
	font-size: 35px;
	color: #fff;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	font-weight: 50;
	padding-top: 50px;
}
.top_kyuujin_contents{
	width: 100vw;
	text-align: center;
	font-size: 15px;
	color: #fff;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: 50;
	padding-top: 50px;
	line-height: 30px;
}
.top_kyuujin_images{
	width: 820px;
	display: flex;
	text-align: center;
	margin: 0 auto;
	margin-top: 50px;
}
.top_kyuujin_img1{
	width: 50%;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_kyuujin_img1 img{
	width: 400px;
	height: 200px;
	align-items: center;
	object-fit: cover; 
	text-align: center;
	display: block;
	opacity: .6;
	margin-right: 8px;
}
.top_kyuujin_img1 p{
	position: absolute;
	color: #fff;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	font-weight: 600;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
.top_kyuujin_img2{
	width: 50%;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_kyuujin_img2 img{
	width: 400px;
	height: 200px;
	align-items: center;
	object-fit: cover; 
	text-align: center;
	display: block;
	opacity: .6;
	margin-left: 8px;
}
.top_kyuujin_img2 p{
	position: absolute;
	color: #fff;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	font-weight: 600;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
.top_kyuujin_img1_sp{
	display: none;
}
.top_kyuujin_img2_sp{
	display: none;
}
  /* 004 */
.button004{
	margin-top: 80px;
}
.button004 a {
    background: #016D79;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
	max-width: 300px;
    padding: 15px 35px;
    color: #FFF;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    transition: 0.3s ease-in-out;
    font-weight: 500;
	text-decoration: none;
	letter-spacing:3px;
}
.button004 a:hover {
    background: #313131;
    color: #FFF;
}
.button004 a:after {
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    transition: 0.3s ease-in-out;
}
.button004 a:hover:after {
    border-color: #016D79;
}

@media screen and (max-width: 728px) {
	.top_kyuujin{
		width: 100vw;
		height: 700px;
		background-color: #1D2025;
		margin-top: -10px;
	}
	.top_kyuujin_title{
		width: 100vw;
		text-align: center;
		font-size: 35px;
		color: #fff;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_kyuujin_contents{
		width: 80vw;
		text-align: center;
		margin: 0 auto;
		font-size: 15px;
		color: #fff;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-weight: 50;
		padding-top: 50px;
		line-height: 30px;
	}
	.top_kyuujin_images{
		width: 80vw;
		display: block;
		text-align: center;
		margin: 0 auto;
		margin-top: 50px;
	}
	.top_kyuujin_img1{
		display: none;
	}
	.top_kyuujin_img2{
		display: none;
	}
	.top_kyuujin_img1_sp{
		width: 100%;
		position: relative;
		display: flex;
	}
	.top_kyuujin_img1_sp img{
		width: 100%;
		height: auto;
		display: block;
		opacity: .6;

	}
	.top_kyuujin_img1_sp p{
		position: absolute;
		color: #fff;
		top: 50%;
		left: 50%;
		-ms-transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
		margin:0;
		padding:0;
		font-weight: 600;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	}
	.top_kyuujin_img2_sp{
		width: 100%;
		position: relative;
		display: flex;
		margin-top: 30px;
	}
	.top_kyuujin_img2_sp img{
		width: 100%;
		height: auto;
		display: block;
		opacity: .6;
	}
	.top_kyuujin_img2_sp p{
		position: absolute;
		color: #fff;
		top: 50%;
		left: 50%;
		-ms-transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
		margin:0;
		padding:0;
		font-weight: 600;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	}
	  /* 004 */
	.button004{
		margin-top: 80px;
	}
	.button004 a {
		background: #016D79;
		border-radius: 3px;
		position: relative;
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 0 auto;
		max-width: 300px;
    	padding: 15px 35px;
		color: #FFF;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		transition: 0.3s ease-in-out;
		font-weight: 500;
		text-decoration: none;
		letter-spacing:3px;
	}
	.button004 a:hover {
		background: #313131;
		color: #FFF;
	}
	.button004 a:after {
		transform: rotate(45deg) translateY(-50%);
		position: absolute;
		top: 50%;
		right: 20px;
		transition: 0.3s ease-in-out;
	}
	.button004 a:hover:after {
		border-color: #016D79;
	}
	}

@media screen and (max-width: 728px) {
	.top_kyuujin_img3{
		width: 100vw;
		height: auto;
	}
	.top_kyuujin_img3 img{
		width: 100vw;
		height: 250px;
		object-fit: cover; 
		margin-bottom: -53px;
	}
}
@media screen and (min-width: 728px) {
.top_kyuujin_img3 img{
	display: none;
}
}

/*協力者募集*/
.top_kyouryokusya{
	width: 100vw;
	height: 350px;
	background-color: #fff;
	margin-top: -10px;
	display: flex;
}
.top_kyouryokusya .fadein{
	width: 80vw;
	margin: 0 auto;
}
.top_kyouryokusya_size{
	width: 900px;
	display: flex;
	text-align: center;
	margin: 0 auto;
}
.top_kyouryokusya_img{
	width: 500px;
	height: auto;
	text-align: center;
	display: flex;
	justify-content: center;
}
.top_kyouryokusya_img img{
	width: 350px;
	height: auto;
	align-items: center;
	margin-top: 50px;
}
.top_kyouryokusya_flex{
	width: 500px;
	margin-top: 55px;
}
.top_kyouryokusya_title{
	text-align: center;
	font-size: 35px;
	color: #333;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	font-weight: 50;
}
.top_kyouryokusya_contents{
	width: 70%;
	text-align: center;
	margin: 0 auto;
	font-size: 15px;
	color: #333;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: 50;
	padding-top: 30px;
	line-height: 30px;
}

  /* 005 */
  .button005{
	margin-top: 30px;
}
.button005 a {
    background: #016D79;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
	max-width: 300px;
    padding: 15px 35px;
    color: #FFF;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    transition: 0.3s ease-in-out;
    font-weight: 500;
	text-decoration: none;
	letter-spacing:3px;
}
.button005 a:hover {
    background: #313131;
    color: #FFF;
}
.button005 a:after {
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    transition: 0.3s ease-in-out;
}
.button005 a:hover:after {
    border-color: #016D79;
}

@media screen and (max-width: 728px) {
	.top_kyouryokusya{
		width: 100vw;
		height: 70%;
		background-color: #1D2025;
		display: block;
	}
	.top_kyouryokusya .fadein{
		width: 100%;
		margin: 0 auto;
	}
	.top_kyouryokusya_size{
		width: 100vw;
		display: block;
		text-align: center;
		margin: 0 auto;
	}
	.top_kyouryokusya_img{
		width: 100%;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		display: none;
	}
	.top_kyouryokusya_img img{
		width: 100%;
		height: 250px;
		align-items: center;
		object-fit: cover; 
	}
	.top_kyouryokusya_flex{
		width: 100%;
	}
	.top_kyouryokusya_title{
		text-align: center;
		font-size: 35px;
		color: #fff;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_kyouryokusya_contents{
		width: 90%;
		text-align: center;
		margin: 0 auto;
		font-size: 15px;
		color: #fff;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-weight: 50;
		padding-top: 30px;
		line-height: 30px;
	}
	.button005{
		margin-top: 50px;
		padding-bottom: 100px;
	}
	.button005 a {
		background: #016D79;
		border-radius: 3px;
		position: relative;
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 0 auto;
		max-width: 300px;
    	padding: 15px 35px;
		color: #FFF;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		transition: 0.3s ease-in-out;
		font-weight: 500;
		text-decoration: none;
		letter-spacing:3px;
	}
	.button005 a:hover {
		background: #313131;
		color: #FFF;
	}
	.button005 a:after {
		transform: rotate(45deg) translateY(-50%);
		position: absolute;
		top: 50%;
		right: 20px;
		transition: 0.3s ease-in-out;
	}
	.button005 a:hover:after {
		border-color: #016D79;
	}
}
.top_kyouryokusya_img2 img{
	width: 100vw;
	height: 400px;
	object-fit: cover; 
}
@media screen and (max-width: 728px) {
	.top_kyouryokusya_img2 img{
		width: 100vw;
		height: 250px;
		object-fit: cover; 
	}
}

/*お問い合わせ*/
.top_contact{
	width: 100vw;
	height: 500px;
	background-color: #B5B5B5;
	margin-top: -10px;
}
.top_contact_title{
	width: 100vw;
	text-align: center;
	font-size: 35px;
	color: #333;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	font-weight: 50;
	padding-top: 50px;
}
.top_contact_contents{
	width: 100vw;
	text-align: center;
	font-size: 15px;
	color: #333;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-weight: 50;
	padding-top: 50px;
	line-height: 30px;
}
@media screen and (min-width: 728px) {
.top_contact_br_sp{
	display: none;
}
}
  /* 006 */
.button006{
	margin-top: 50px;
}
.button006 a {
    background: #000;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
	max-width: 300px;
    padding: 15px 35px;
    color: #FFF;
	font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    transition: 0.3s ease-in-out;
    font-weight: 500;
	text-decoration: none;
	letter-spacing:3px;
}
.button006 a:hover {
    background: #313131;
    color: #FFF;
}
.button006 a:after {
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    transition: 0.3s ease-in-out;
}
.button006 a:hover:after {
    border-color: #016D79;
}

@media screen and (max-width: 728px) {
	.top_contact{
		width: 100vw;
		height: 500px;
		background-color: #fff;
		margin-top: -10px;
	}
	.top_contact_title{
		width: 100vw;
		text-align: center;
		font-size: 30px;
		color: #333;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_contact_contents{
		width: 90%;
		text-align: center;
		margin: 0 auto;
		font-size: 15px;
		color: #333;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-weight: 50;
		padding-top: 50px;
	}
	.top_concept_br_pc{
		display: none;
	}
	
	  /* 006 */
	.button006{
		margin-top: 50px;
	}
	.button006 a {
		background: #000;
		border-radius: 3px;
		position: relative;
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 0 auto;
		max-width: 300px;
    	padding: 15px 35px;
		color: #FFF;
		font-family:'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
		transition: 0.3s ease-in-out;
		font-weight: 500;
		text-decoration: none;
		letter-spacing:3px;
	}
	.button006 a:hover {
		background: #313131;
		color: #FFF;
	}
	.button006 a:after {
		transform: rotate(45deg) translateY(-50%);
		position: absolute;
		top: 50%;
		right: 20px;
		transition: 0.3s ease-in-out;
	}
	.button006 a:hover:after {
		border-color: #016D79;
	}
}

/*フッター*/
footer{
	margin-top: auto;
}
.top_footer{
	background-color: #000000;
	width: 100vw;
}
.top_footer_list{
	padding-top: 50px;
	text-align: center;
}
.top_footer_list li{
	display: inline-block;
}
.top_footer_list a{
	color: #fff;
	display: block;
	padding: 0 15px;
	text-align: center;
	color: #fff;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
.top_footer_logo{
	text-align: center;
	margin-top: 40px;
	margin-bottom: 30px;
}
.top_footer_logo img{
	width: 226px;
	height: auto;
}
.top_footer_name{
	width: 100vw;
	text-align: center;
}
.top_footer_companyname{
	color: #fff;
	font-size: 8px;
	font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
@media screen and (max-width: 728px) {
	.top_footer{
		background-color: #000000;
		width: 100vw;
	}
	.top_footer_list{
		padding-top: 50px;
	}
	.top_footer_list li{
		display: block;
		font-size: 16px;
		border-bottom: 1px solid #ffffff;
	}
	.top_footer_list li a{
		position: relative;
		display: block;
		text-align: left;
		font-size: 3.8vw;
		line-height: 2.8;
		border: none;
		padding: 0 5%;
	}
	.top_footer_list li a:after {
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		right: 5%;
		width: 6px;
		height: 6px;
		margin: -4px 0 0 0;
		border-top: solid 2px #ffffff;
		border-right: solid 2px #ffffff;
		-webkit-transform: rotate(45deg);
		        transform: rotate(45deg);
	}
	.top_footer_logo{
		text-align: center;
		margin-top: 40px;
		margin-bottom: 20px;
	}
	.top_footer_logo img{
		width: 150px;
  		height: auto;
	}
	.top_footer_name{
		width: 100vw;
		text-align: center;
	}
	.top_footer_companyname{
		color: #fff;
		font-size: 8px;
		font-family:"游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		margin-top: 10px;
	}
	
}
@media only screen and (min-width: 729px) and (max-width: 1024px){
	
}
/*ふわっとアニメーション*/
/* 画面外にいる状態 */
.fadein {
	opacity : 0.3;
	transform : translate(0, 50px);
	transition : all 1000ms;
	}

/* 画面内に入った状態 */
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
	}

body {
	-webkit-animation: fadeIn 1.5s ease 0s 1 normal;
	animation: fadeIn 1.5s ease 0s 1 normal;
	}

	@keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
	}

	@-webkit-keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
	}

/*スマホふわっとアニメーション*/
@media screen and (max-width: 728px) {
	.top_img_back{ 
		font-size:40px;
	  　opacity:0;
		animation-name:sample02;
		animation-duration:5s; 
		animation-iteration-count: 1;
	  }
	  @keyframes sample02 {
	  0% {
	   opacity: 0;
	   transform: translateX(-50px);
	  }
		50%{
		  opacity: 1;
		  transform: translateX(0);
		}
	   100% {
	   opacity:0;
	   transform: translateX(50px);
	   } 
	  }
}