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

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

	初期設定

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

html,body,div,
dl,dt,dd,ul,ol,li,
tr, th, td,
h1,h2,h3,h4,h5,h6,
p,a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	border: none;
	line-height: 1.5;
	text-align: left;
	text-decoration:none;
	color:#000;
}

dl,ul,ol,li {
	list-style: none;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	border:none;
	-webkit-backface-visibility: hidden;
}

button, input, select, textarea {
	font-family:inherit;
	font-size:100%;
}

*:focus {
	outline: none;
}

*,
*:before,
*:after {
	box-sizing: border-box;
}

iframe {
	display: block;
}

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

	メインレイアウト

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

html {
	width:100%;
	height:100%;
}

body {
	width: 100%;
	height: 100%;
	font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';	font-size: 16px;
	-webkit-text-size-adjust: 100%;
	font-weight: 500;
}

#wrapper {
	width: 100%;
	height: 100%;
	position: relative;
	height: auto !important;
	min-height: 100%;
}

#contents {
	width:100%;
	padding-bottom: 499px;
}

#contents section {
	width:100%;
	padding: 100px 0;
}

.access_top {
	padding-bottom: 0px;
}

.inner {
	width: 1000px;
	margin:auto;
	padding: 0 10px;
}

.scroll-fade {
	opacity: 0;
	transition: all 2s/*処理にかかる時間*/;
}

.scroll-up {
	opacity: 0;
	transform: translateY(100px)/*スクロールアップする距離*/;
	transition: all 2s/*処理にかかる時間*/;
}
.scroll-up.done,
.scroll-fade.done {
	opacity : 1;
	transform : translate(0, 0);
}

.load-fade {
	opacity : 0;
	transition : all 2s/*処理にかかる時間*/;
}

.load-up {
	opacity: 0;
	transform: translateY(100px)/*スクロールアップする距離*/;
	transition: all 2s/*処理にかかる時間*/;
}

.load-up.done,
.load-fade.done {
	opacity : 1;
	transform : translate(0, 0);
}

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

	共通設定

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

/*----------リンク---------*/

a {
	color: #8cc63f;
}

a:hover {
	text-decoration:underline;
}

a img {
	transition: .4s;
}

a:hover img {
	opacity: 0.8;
}


/*----------見出し---------*/
.title {
	font-size: 50px;
	color: #006837;
	font-weight:bold;
	font-family: 'Oswald', sans-serif,'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
	text-align:center;
	margin-bottom: 60px;
}

.title span {
	font-size: 20px;
	color: #006837;
	display:block;
	font-weight:normal;
	font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
}

.subtitle {
	color: #6091c1;
	font-size: 30px;
	text-align:center;
	font-weight:bold;
	margin-bottom: 20px;
}

.pagettl {
	width: 100%;
	height: 400px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 90px;
}

.pagettl h2{
	font-size: 50px;
	font-weight:bold;
	color: #fff;
	text-align: center;
	text-shadow: 0 0 10px #333;
	font-family: 'Oswald', sans-serif,'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
}

.pagettl span {
	font-size: 18px;
	display:block;
	letter-spacing: normal;
}

.company_ttl {
	background: url(../img/title/company.jpg) #FFF;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.service_ttl {
	background: url(../img/title/service.jpg) #FFF;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.contact_ttl {
	background: url(../img/title/contact.jpg) #FFF;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.news_ttl {
	background: url(../img/title/news.jpg) #FFF;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.privacy_ttl {
	background: url(../img/title/privacy.jpg) #FFF;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.notfound_ttl {
	background: url(../img/title/notfound.jpg) #FFF;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}


/*----------文字---------*/
.line-break {
	display: none;
}

.center {
	text-align:center;
}

.text {
	margin-bottom: 40px;
}

.right {
	text-align: right;
}

.red {
	color: #F00;
}

.mt_20 {
	margin-top: 20px;
}

.mb_25 {
	margin-bottom: 25px;
}

.bold {
	font-weight:bold;
}

.font_20 {
	font-size: 20px;
}

.font_40 {
	font-size: 40px;
}



/*----------画像---------*/
.pc {
	display:block;
}

.sp {
	display: none;	
}

/*----------ボタン---------*/
.btn {
	display: block;
	width: 300px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	font-size: 18px;
	color: #39b54a;
	text-decoration: none;
	transition: .6s;
	margin: 60px auto 0;
	border: solid 1px #39b54a;
}

.btn:after {
	font-family: "Font Awesome 5 Free";
	content: '\f101';
	font-weight: 800;
	font-size: 14px;
	padding-left: 20px;
}

.btn:hover {
	text-decoration: none;
	background: #39b54a;
	color: #FFF;
}


/*----------テーブル---------*/
table.type01 {
	width:100%;
	border-collapse:collapse;
	margin-bottom:20px;
	border-top: 1px #ccc solid;
}

table.type01 th {
	width: 20%;
	padding: 20px;
	border-bottom: 1px #ccc solid;
	padding-left: 20px;
	vertical-align: top;
	text-align: left;
	font-weight: bold;
	background-color: #ecf7f2;
}

table.type01 td {
	padding: 20px;
	border-bottom: 1px #ccc solid;
	text-align: left;
}


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

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

/*----------ヘッダー---------*/
header {
	width: 100%;
	height: 120px;
	display: flex;
	position: fixed;
	justify-content: space-between;
	z-index: 999;
	padding: 0 40px;
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0.7) 100%);
	transition: .5s;
}

header.transform{
	background: rgba(255,255,255,0.8);
}

#header_inner {
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.header_box {
	display: flex;
	justify-content: space-between;
	align-items: center;
}


/*----------メニュー---------*/
header nav {
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
	background: rgba(000, 000, 000, 0.8);
	width: 100%;
	height: 100vh;
	transform: translateX(100%);
	transition: all 0.6s;
	display: flex;
	justify-content: center;
	align-items: center;
}

header nav ul li{
	text-align:left;
	padding-bottom: 30px;
}

header nav ul li:last-child  {
	padding-bottom: 0;
}

header nav ul li a{
	color: #fff;
	text-decoration: none;
	font-size: 35px;
	font-weight:bold;
	font-family: 'Oswald', sans-serif,'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
}

header nav ul li {
	transition: .4s all;
}

header nav ul li a span {
	display:block;
	font-size: 20px;
	color: #fff;
}

header nav ul li a:hover {
	text-decoration: none;
}

header nav ul li:hover {
	opacity:0.7;
}

/* クリックでjQueryで追加・削除 */
header nav.active {
	opacity: 100;
	/*display: block;*/
	transform: translateX(0%);
}

.hamburger,
.hamburger span {
	display: inline-block;
	transition: all 0.4s;
}
.hamburger {
	position: relative;
	width: 50px;
	height: 34px;
	cursor: pointer;
	z-index: 400;
}
	
.hamburger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: #009245;
}
	
.hamburger span:nth-of-type(1) {
	top: 0;
}
.hamburger span:nth-of-type(2) {
	top: 15px;
}
.hamburger span:nth-of-type(3) {
	bottom: 0;
}
	
.hamburger.active span:nth-of-type(1) {
	transform: translateY(15px) rotate(-315deg);
}
	
.hamburger.active span:nth-of-type(2) {
	opacity: 0;
}
	
.hamburger.active span:nth-of-type(3) {
	transform: translateY(-15px) rotate(315deg);
}


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

	トップページ

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

/*----------スライド---------*/
.top_slide {
	position: relative;
}

.catchcopy{
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	z-index:99;
}

.slide div {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	height: 95vh;
	margin: 0;
}

.slide div .img_01 {
	background-image:url(../img/slide01.jpg);
}

.slide div .img_02 {
	background-image:url(../img/slide02.jpg);
}

.slide div .img_03 {
	background-image:url(../img/slide03.jpg);
}




/*----------お知らせ---------*/
.top_news {
	width: 60%;
	background: #009245;
	display: flex;
	align-items: center;
	padding: 10px 40px;
	position: absolute;
	bottom: -32px;
	right: 0;
	z-index:99;
}

.top_news h2{
	font-weight: bold;
	color: #FFF;
	border-right: solid #FFF 1px;
	padding: 10px 40px 10px 0;
}

.top_news p{
	color: #FFF;
	padding-left: 20px;
}

.top_news p span {
	margin-right: 20px;
}

.top_news a {
	color: #FFF;
}


/*---------株式会社ACTIVEについて---------*/
.about_bg {
	background:url(../img/about_bg.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 110px 0px !important;
}

.about_bg p {
	line-height: 2;
	text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff;
}

.about_bg .inner {
	position:relative;
}

.about_active {
	position: absolute;
	bottom:0;
	right:0;
}

/*----------事業紹介---------*/
.top_service h3 {
	font-weight:bold;
	font-size: 30px;
	color: #009245;
	margin-bottom: 30px;
}

.top_service {
	display: flex;
	justify-content: center;
}

.top_service .text{
	width: 50%;
	padding: 0 60px;
	margin: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.top_service .btn {
	margin: 60px 0 0 0;
}

.top_service .img_01 {
	width: 50%;
	height: 545px;
	background:url(../img/service_01.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
}

.top_service .img_02 {
	width: 50%;
	height: 545px;
	background:url(../img/service_02.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
}

.top_service .img_03 {
	width: 50%;
	height: 545px;
	background:url(../img/service_03.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
}




/*----------SNS---------*/
.sns_bg {
	background: #f9f9f9;
}

.sns ul{
	display: flex;
	justify-content: center;
	margin-top: 60px;
}

.sns li {
	padding-right: 40px;
}

.sns li:last-child {
	padding-right: 0px;
}


/*---------お問い合わせ---------*/
.top_contact {
	padding-top: 0px !important;
}

.top_contact_ttl {
	width: 100%;
	height: 400px;
	/*height: 0;
	padding-top: 23.4375%;*/
	background:url(../img/contact_bg.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
	display: flex;
	justify-content: center;
	align-items: center;

}

.top_contact_ttl h2,
.top_contact_ttl h2 span {
	color: #fff;
	margin-bottom: 0px;
}

.top_contact .inner {
	position: relative;

}

.top_contact .map {
	width: 700px;
	height: 500px;
	margin-top: -40px;
}

.top_contact .office {
	position: absolute;
	top: -60px;
	right: 10px;
	width: 350px;
	background: #006837;
	padding: 40px;
	z-index: 99;
}

.top_contact .office h3 {
	font-family: 'Oswald', sans-serif,'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
	font-size: 30px;
	font-weight: bold;
	color: #fff;
}

.top_contact .office p {
	margin-top: 20px;
	color:#fff;
}

.mail {
	user-select: none;
	-webkit-user-select: none;
	-webkit-user-drag: none;
}

/*----------ページトップ---------*/
#page_top{
	width: 50px;
	height: 50px;
	position: fixed;
	right: 20px;
	bottom: 20px;
	background: #a3d165;
	transition: .4s;
	z-index: 100;
}

#page_top a{
	display: block;
	width: 50px;
	height: 50px;
	text-decoration: none;
}

#page_top a::before{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f106';
	font-size: 25px;
	color: #fff;
	position: absolute;
	width: 25px;
	height: 25px;
	top: -10px;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
}

#page_top:hover{
	opacity: 0.8;
}


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

	子ページ

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

/*----------会社案内---------*/
.page .about_active {
	position: absolute;
	bottom: -80px;
	right: 0;
}	

.timeline li {
	margin: 0;
	position: relative;
	overflow: hidden;
}

.timeline_content {
	width: 100%;
	float: left;
	border-left: 1px #ccc solid;
	padding: 15px 0 40px 15px;
	margin-left: 6px;
}

.timeline_content:before {
	content: '';
	width: 14px;
	height: 14px;
	background: #39b54a;
	position: absolute;
	left: 0px;
	top: 22px;
	border-radius: 100%;
}

.timeline_content h3 {
	width: 100%;
	color: #009245;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
	position: relative;
	padding-left: 40px;
	display: inline-block;
}

.timeline_content h3 span{
	width: 170px;
	display:inline-block;
	padding-left: 10px;
}

.timeline_content h3:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	display: inline-block;
	width: 40px;
	height: 1px;
	background-color: #009245;
	backface-visibility: hidden;
}

.timeline_content h3:after {
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	left: 210px;
	display: inline-block;
	width: 80%;
	height: 1px;
	background-color: #ccc;
}

.timeline_content p {
	padding-left: 6%;
}

/*----------事業紹介---------*/
.service {
	position: relative;
}

.service .img_01 {
	width: 80%;
	height: 600px;
	background:url(../img/service_01.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
}

.service .img_02 {
	width: 80%;
	height: 600px;
	background:url(../img/service_02.jpg) no-repeat;
	background-position: center top;
	background-size: cover;
	margin-left: auto;
}

.service .img_03 {
	width: 80%;
	height: 600px;
	background:url(../img/service_03.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
}

.service h3 {
	font-weight: bold;
	font-size: 30px;
	color: #009245;
	margin-bottom: 30px;
}
.service .text {
	width: 70%;
	margin-top: -100px;
	margin-left: auto;
	background: #f5fbf8;
	padding: 80px;
	margin-right: 100px;
	margin-bottom: 0;
}

section:nth-child(odd) .service .text {
	margin-right: auto;
	margin-left: 100px;
}


/*----------プライバシーポリシー---------*/
.privacy div {
	margin-bottom: 60px;

}

.privacy h3 {
	font-weight: bold;
	font-size: 20px;
	margin-bottom: 10px;
	color: #006837;
}

.privacy dl {
	margin-top: 20px;
}

.privacy dt {
	counter-increment: number_01;
	margin-bottom: 10px;
	font-weight:bold;
	color: #009245;
}

.privacy dt:before {
	content: "("counter(number_01)")";
}

.privacy dd {
	margin-bottom: 40px;
}

.privacy ol{
	counter-reset: number_02;
	padding-left: 0;
	margin-bottom: 20px;
}

.privacy li{
	text-indent: -1.3em;
	padding-left: 1.3em;
	margin-bottom: 10px;
}

.privacy li:before {
	counter-increment: number_02;
	content: counter(number_02)'.';
	padding-right: .5em;
}

.privacy ol>ol{
	counter-reset: number_03;
	padding-left: 1em;
	margin-top: 10px;
}

.privacy ol ol>li:nth-of-type(1) {
	counter-reset: number_03;
}

.privacy ol ol>li:not(:nth-of-type(1)) {
	counter-increment: number_03;
}

.privacy ol ol>li::before {
	content: counter(number_03)'.';
	padding-right: .5em;
}

.privacy ol ol {
	padding-left: 1.3em;
}

.privacy ol ol li {
	margin-top: 10px
}

.privacy ol ol ol {
	padding-left: 1.5em;
}



/*----------新着情報---------*/
.news_list dt {
	padding: 0 20px 20px 20px;
	font-weight: bold;
	color: #006837;
	font-size: 20px;
}

.news_list dd {
	margin-bottom: 30px;
	text-align: left;
	border-bottom: solid 1px #ccc;
	padding: 0 20px 20px 20px;
}

.news_list dd:last-child {
	margin-bottom: 0px;
}


/*----------お問い合わせ---------*/

.contact {
	display: flex;
	justify-content: center;
}

.contact li {
	padding-right: 40px;
}

.contact li:last-child {
	padding-right: 0px;
}

.tel,
.fax {
	font-size: 40px;
	color: #009245;
	font-family: 'Oswald', sans-serif,'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif';
	font-weight:bold;
	margin-bottom: 20px;
	text-align:center;
}

.contact i {
	margin-right: 20px;
}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 5px 10px;
}

.input_button {
	text-align:center;
	margin-top: 40px;
}

input[type="submit"], input[type="button"], input[type="reset"] {
	-webkit-appearance: none;
	border-radius: 0;
}

input[type="submit"],input[type="reset"],input[type="button"] {
	display: block;
	width: 300px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	font-size: 18px;
	color: #39b54a;
	text-decoration: none;
	transition: .6s;
	margin: 60px auto 0;
	border: solid 1px #39b54a;
	background:none;

}

input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover {
	cursor: pointer;
	background: #39b54a;
	color: #FFF;
}

.error_messe {
	color: #F00;
}

table.contact_foam {
	width: 100%;
	margin-top: 60px;
}

table.contact_foam th {
	vertical-align: top;
	text-align: left;
	padding-bottom: 20px;
	display:block;
	font-weight:bold;
}

table.contact_foam td {
	text-align: left;
	padding-bottom: 40px;
	display:block;
}

table.contact_foam tr:last-child td {
	padding-bottom: 0px;
}

table.contact_foam th span {
	margin-left: 20px;
	display: inline-block;
	padding: 5px 10px;
	background: #ff6666;
	color: #fff;
	font-size: 14px;
}

.mail_copy {
	user-select:none;
	-webkit-user-select:none;
	-moz-user-select:none;
	-khtml-user-select:none;
	-webkit-user-drag:none;
	-khtml-user-drag:none;
}

.mail_copy {
	user-select:none;
	-webkit-user-select:none;
	-moz-user-select:none;
	-khtml-user-select:none;
	-webkit-user-drag:none;
	-khtml-user-drag:none;
}

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

	フッター

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

footer {
	width:100%;
	position:absolute;
	bottom:0;
	background:#151515;
}

#footer_inner {
	width: 1000px;
	margin: 0 auto;
	padding: 40px 0;
	display: table;
	table-layout: fixed;
}

#footer_inner p {
	text-align:center;
	color: #fff;
}

#footer_inner .logo img {
	background:#FFF;
	padding: 10px;

}

#footer_inner .address {
	margin-top: 20px;
}

#footer_inner .address span {
	margin-top: 15px;
	display:block;
}

.footer_menu {
	width: 100%;
	margin-top: 40px;
}

.footer_menu nav {
	width: 1000px;
	margin: 0 auto;
}

.footer_menu ul {
	display: flex;
	justify-content: center;
}

.footer_menu ul li{
	padding: 0 20px;
	border-right: solid 1px #FFF;
}

.footer_menu ul li a{
	color: #FFF;
}

.footer_menu ul li:last-child {
	border: none;
}

.footer_sns {
	margin-top: 20px;
}

.footer_sns li {
	border: none !important;
}

.footer_sns i{
	font-size: 30px;
}

.footer_sns i:hover{
	opacity: 0.8;
}

#footer_inner .copy {
	font-size: 14px;
	text-align: center;
	color:#FFF;
	margin-top: 40px;
}