@charset "utf-8";

/*全体の設定
---------------------------------------------------------------------------*/
html,body{
	margin: 0;
	padding: 0;
	height: 100%;
}
body{
	font: 16px "游ゴシック Medium",YuGothic,YuGothicM,"游ゴシック体","游ゴシック","Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
	font-weight: 500;
	-webkit-text-size-adjust: none;
	line-height: 2;
	color: #000;
	text-align:center;
	background-color:#486d46;
	background-image: url("images/bg.jpg?20210608");
	-moz-background-size:cover;
	background-size: cover;
	background-attachment: fixed;
	background-position: center center;
}

h1,h2,h3,p,ul,li,form{
	margin: 0;
	padding: 0;
}
ul{
	list-style-type: none;
}
img{
	border: none;
}
table{
	margin:0 auto;
}
table caption{
	font-weight: 600;
	line-height: 2.4;
}
table span{
	color:#e00;
	font-weight:600;
}
h2{
	font-size: 26px;
	font-family: "游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",'メイリオ',Meiryo,sans-serif;
}
/*リンク設定
---------------------------------------------------------------------------*/
a{
	text-decoration: none;
}
a:hover{
	text-decoration: none;
}
/* 上部メニューバー */
---------------------------------------------------------------------------*/
#menubar {
	top: 0;
	left: 0;
}
#menubar ul {
	width: 100%;
	position: fixed;
	font-family: "游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",'メイリオ',Meiryo,sans-serif;
	font-weight: 600;
	background-color:#111;
	filter: alpha(opacity=80);
	opacity: 0.8;
	z-index:10;
}
#menubar ul li {
	line-height: 2.8;
	display: inline-block;
	*display:inline; *zoom:1; /* 上記のIE7対策 */
}
#menubar ul li a {
	display: block;
	padding: 0 1.6em;
	color: #fff;
}
#menubar ul li a:hover {
	color:#ffa07a;
}

/* ▼ボックスの高さを最低でも1画面分にする */
div.pagebox{
	min-height: 100%;
}
/* ▼各画面の設定 */
---------------------------------------------------------------------------*/
#home{
	margin:0 auto;
}
#p1{
	padding:0 0 90px 0;
	background:#e1b860;
}
#p1 h1{
	font-family: "游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",'メイリオ',Meiryo,sans-serif;
	font-size: 18px;
	line-height: 2.8;
	padding:130px 0 90px;
	background-image: url("images/bg4.jpg?2021053003");
}

#p1 p.title{
	margin:100px 0 20px 0;
}

#p1 ul.point, #p1 ul.point2{
	display:table;
	margin:0 auto;
	line-height: 1.6;
	font-size: 15px;
}
#p1 ul.point h3, #p1 ul.point2 h3{
	font-size: 24px;
	margin-top: 144px;
	line-height: 2.4;
	font-family: "游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",'メイリオ',Meiryo,sans-serif;
}
#p1 ul.point li#point1 h3 
	line-height: 2.1;
}
#p1 ul.point2 li#point5 h3{
	line-height: 2;
}
#p1 ul.point li, #p1 ul.point2 li{
	display:table-cell;
	vertical-align:middle;
	display: inline-block;
	width:312px;
	height:392px;
	margin-left: 20px;
	margin-right:20px;
	margin-bottom:36px;
}
#p1 ul.point li#point1{
	background-image: url("images/5points_01.jpg");
	background-repeat: no-repeat;
	background-position: left top;
}
#p1 ul.point li#point2{
	background-image: url("images/5points_02.jpg");
	background-repeat: no-repeat;
}
#p1 ul.point li#point3{
	background-image: url("images/5points_03.jpg");
	background-repeat: no-repeat;
}
#p1 ul.point2 li#point4{
	background-image: url("images/5points_04.jpg");
	background-repeat: no-repeat;
}
#p1 ul.point2 li#point5{
	background-image: url("images/5points_05.jpg");
	background-repeat: no-repeat;
}
#outline{
	padding:110px 0;
	background:#fffff0;
	border-bottom:1px solid #ccc;
}
#access{
	padding:110px 0 100px;
	background:#fff;
	border-bottom:1px solid #ccc;
}
#design{
	padding:110px 0 100px;
	background:#fffff0;
}
div#contact{
	padding:110px 0 80px;
	background: #eeeeef;
}
#company{
	padding:50px 0 40px;
	background:#ccc;
	border-bottom: 1px solid #bbb;
}
#footer{
	padding:20px 0;
	background-image:url("images/bg3.jpg?2021053003");
	font-size:13px;
}

/*タイトル
---------------------------------------------------------------------------*/
#title{
	width:100%;
	font: 16px "游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",'メイリオ',Meiryo,sans-serif;
	font-weight: 600;
	line-height: 2.6;
	position: absolute;
	left: 50%;
	top: 45%;
	-webkit-transform: translate(-50%,-45%);
	-moz-transform: translate(-50%,-45%);
	-ms-transform: translate(-50%,-45%);
	-o-transform: translate(-50%,-45%);
	transform: translate(-50%,-45%);
	color:#fff;
	font-size:60px;
	text-shadow:5px 2px 5px #555;
	-webkit-animation-name: fadeIn;
	-webkit-animation-duration:8s;
	-moz-animation-name:fadeIn;
	-moz-animation-duration:8s;
	-ms-animation-name:fadeIn;
	-ms-animation-duration:8s;
}

@-webkit-keyframes fadeIn{
	0%{
		filter: alpha(opacity=0);
		-moz-opacity:0;
		opacity:0;
	}
	100%{
		filter: alpha(opacity=100);
		-moz-opacity:1;
		opacity:1;
	}
}

@-moz-keyframes fadeIn{
	0%{
		filter: alpha(opacity=0);
		-moz-opacity:0;
		opacity:0;
	}
	100%{
		filter: alpha(opacity=100);
		-moz-opacity:1;
		opacity:1;
	}
}

@-ms-keyframes fadeIn{
	0%{
		filter: alpha(opacity=0);
		-moz-opacity:0;
		opacity:0;
	}
	100%{
		filter: alpha(opacity=100);
		-moz-opacity:1;
		opacity:1;
	}
}


/*スクロールボタン
---------------------------------------------------------------------------*/
#scroll_btn{
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
	width:100px;
	height: 64px;
	background-color:#222;
	opacity: 0.7;
	filter: alpha(opacity=70);
	box-shadow: 0px -1px 10px #666;
}
#scroll_btn a{
	font-size: 18px;
	color: #fff;
	font-family: "Palatino Linotype", Verdana, Cambria, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#scroll_btn a span#text{
	margin:0 auto;
	position: absolute;
	right: 26px;
	bottom: 26px;
}
a span#arrow{
	position: absolute;
	left: 50%;
	bottom: 15px;
	width: 25px;
	height: 25px;
	margin-left: -12px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(-45deg);
	animation: sdb 2s infinite;
	opacity: 0;
	box-sizing: border-box;
}
@-webkit-keyframes sdb{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}
@keyframes sdb{
	0% {
		opacity: 0;
	}
	50%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}

#access p{
	font-family: "游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E",'メイリオ',Meiryo,sans-serif;
	font-weight: 600;
	font-size: 18px;
	padding-top: 10px;
	
}
#access table{
	margin-top:35px;
	border-collapse: separate;
	border-spacing:7px;
}
#access table caption{
	margin: 0 7px;
	background: #a3d9ed;
	font-size: 18px;
}
#access table td, #design table td{
	empty-cells:hide;
	padding:0;
	border:1px solid #ccc;
}
#access table td a img, #design table td a img{
	display: block;
	width:150px;
	height:150px;
	opacity: 0.8;
	filter: alpha(opacity=80);
}
#access table td a:hover img, #design table td a:hover img{
	opacity: 0.4;
	filter: alpha(opacity=40);
}
#design table.tb1{
	margin-top:20px;
	border-collapse: separate;
	border-spacing:7px;
}
#design table.tb2{
	border-collapse: separate;
	border-spacing:7px;
}
#design table caption{
	margin: 0 5px;
	width: 97%;
	background: #d4bd9d;
	font-size: 18px;
}
#design table.tb2 caption{
	margin: 0 14px 0 7px;
}
#outline .situation{
	display: table;
	margin:20px auto 15px;
	max-width:700px;
	text-align:left;
	font-size:14px;
	line-height: 1.8;
}
#outline .situation span{
	color:#e00;
	font-weight:600;
}
#outline .situ_image{
	display: table-cell;
	vertical-align: top;
	border:1px solid #a0a0a0;
}
#outline .situ_text{
	display: table-cell;
	vertical-align: middle;
	padding:0 0 5px 15px;
}
#outline a{
	color:#4169e1;
	text-decoration: underline;
}
#outline a:hover{
	text-decoration: underline;
}
#outline table{
	width:750px;
	border-collapse: collapse;
	line-height:2;
	text-align:left;
	background:#fff
}
#outline table th, #outline table td{
	border:solid 1px #aaa;
	padding:7px 15px;
}
#outline table td{
	font-weight:400;
}
#outline table th{
	width:70px;
	background:#ffe4e1;
}
/*メールフォーム
---------------------------------------------------------------------------*/
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"],
input[type="reset"] {
  border-radius: 2px;
  -webkit-appearance: button;
  appearance: button;
  border: 1px solid #777;
  background: #fff;
  font-size: 16px;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus,
input[type="reset"]::focus {
  outline-offset: -2px;
}
/* フォーム */
#contact table{
	margin-top:20px;
	width: 750px;
	margin-bottom: 15px;
	border-collapse: collapse;
	line-height:2;
	text-align:left;
}
#contact table th, #contact table td{
	border: 1px solid #bfbfbf;
	line-height: 2;
	padding: 10px;
	word-break: break-all;
}
#contact table td{
	font-weight:400;
}
#contact table th{
	width: 180px;
	background: #cbe4cb;
}
#contact table th.tamidashi{
	background: #7f7f7f;
	color:#fff
}
#contact table .wl {
	width: 96%;
}
#contact table .wm {
	width: 60%;
}
#contact table .ws {
	width: 40%;
}
#contact form input[type="submit"],
#contact form input[type="reset"] {
	font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"游ゴシック体","游ゴシック","Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
	font-size:16px;
	margin: 12px 16px 0;
	padding: 2px 35px 0;
	background: linear-gradient(to top, #bbb, 3%, white);
	border-radius: 3px;
	line-height: 1.9;
}
#contact form input[type="submit"]:hover,
#contact form input[type="reset"]:hover {
	background: #fff;
}
#contact form input[type="text"],
#contact form input[type="tel"] {
	line-height: 1.5;
}
#company{
	line-height: 1.8;
	font-weight: 400;
}


/*幅1024px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1024px){
body{
	background: url("images/bg2.jpg?20210608") no-repeat #486d46 center center !important;
	-moz-background-size:cover;
	background-size: cover;
}
#title{
	top: 40%;
}
#menubar ul li a {
	line-height: 3;
	font-size: 110%;
}
#contact form input[type="submit"],
#contact form input[type="reset"] {
	padding: 2px 35px;
}
#contact form input[type="text"],
#contact form input[type="tel"],
#contact form textarea {
	line-height: 1.5;
	font-size:18px;
}
#access table td a img, #design table td a img{
	width:140px;
	height:140px;
}
}