@charset "UTF-8";

body	{margin: 0;
height:100%;
font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif}

/* 凸 */
.text-center{
text-align: center;
}
.text-left{
text-align: left;
}
.text-right{
text-align: right;
}
.text-size-13{
font-size: 13px;
}
.text-size-15{
font-size: 15px;
}
.text-size-18{
font-size: 18px;
}
.text-size-20{
font-size: 20px;
}

.text-size-25{
font-size: 25px;
}


.bold{
font-weight: bold;
}
.left{
float: left;
}
.right{
float: right;
}
.color-black{
color: #555555
}
.color-brown{
color: #DA8300
}
.com-name{
float: left;
padding: 0 50px;
}

.margin-botm-80{
margin-bottom: 80px;
}

header{
text-align: center;
background-attachment: scroll;
background-position: center center;
background-repeat: none;
width: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}

header .intro-text {
padding-top: 100px;
padding-bottom: 50px;
}

header .intro-text .intro-lead-in {
margin-bottom: 25px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 22px;
color: #fff;
line-height: 22px;
}

header .intro-text .intro-heading {
margin-bottom: 25px;
text-transform: uppercase;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 50px;
color: #3c3c3c;
line-height: 50px;
}

header .intro-text .intro-lead-in {
margin-bottom: 25px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 60px;
line-height: 60px;
letter-spacing: 20px;
text-shadow: 0 0 10px #fff;
}

header .intro-text .intro-heading {
margin-bottom: 50px;
text-transform: uppercase;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 50px;
line-height: 75px;
text-shadow:
-1px -1px #fff,
1px -1px #fff,
-1px 1px #fff,
1px 1px #fff;
}

.heading1{
width: 700px;
margin-left: auto;
margin-right: auto
}
.heading1 p{
margin-top: 0;
padding-top: 0;
}

.heading2{
width: 700px;
margin-left: auto;
margin-right: auto
}
.heading2 p{
margin-top: 0;
padding-top: 0;
}

h2 {
display: flex;
align-items: center;
text-align: center; /* for no-flexbox browsers */
margin-bottom: 0;
padding-bottom: 0;
color: #555555
}

h2:before,
h2:after {
border-top: 3px solid;
content: "";
display: inline; /* for IE */
flex-grow: 1;
}

h2:before {
margin-right: 0.5em;
}

h2:after {
margin-left: 0.5em;
}

/* お知らせ */
.news-area{
width: 50%;
margin-left: auto;
margin-right: auto;
padding: 0;
border-top: solid  1px #D5D5D5;
border-bottom: solid  1px #D5D5D5;
float: left;
}
.news-area ul {margin:0;
padding: 0;
list-style: none;
}
.news-area li time{
font-size: 15px;
font-weight: 600;
}
.news-area .text	{float: none;
width: auto;
font-size: 15px;}
.news-area li{
padding: 20px 0;
border-bottom: solid 1px #dddddd;
}

.fb-page{
width: 50%;
}

/*会社紹介 */

table.company th,
table.company td {
padding: 30px;
}

table.company th {
background: #ff9900;
vertical-align: middle;
text-align: left;
width: 100px;
overflow: visible;
position: relative;
color: #fff;
font-weight: normal;
}

table.company th:after {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(136, 183, 213, 0);
border-left-color: #ff9900;
border-width: 10px;
margin-top: -10px;
}
/* firefox */
@-moz-document url-prefix() {
table.company th::after {
float: right;
padding: 0;
left: 30px;
top: 10px;
content: " ";
height: 0;
width: 0;
position: relative;
pointer-events: none;
border: 10px solid transparent;
border-left: #295890 10px solid;
margin-top: -10px;
}
}

table.company td {
background: #f8f8f8;
width: 360px;
padding-left: 20px;
}

/*業務内容*/
.poster{
margin: 20px 5px;
padding: 0;
}

.poster ul {
margin:10px 0 5px 0;
padding: 0 10px;
list-style: none
}

.poster-list {
display: block;
width: 30.5%;
background-color: #fff;
padding: 5px;
margin: 10px ;
text-align: center;
float: left;
}

.poster .poster-list a {
color: #000000;
font-size: 15px;
text-decoration: none;
}
.poster-list img{
max-width: 100%;
max-height: 350px;
margin-bottom: 0px;
border: solid 6px #3c3c3c;
-webkit-transition:all 0.25s ease-in-out;
transition:all 0.25s ease-in-out;
}

.poster-list p{
font-size: 15px;
margin: auto ;
}

.poster-list a:hover	{opacity: 0.8}

/*業務内容*/
.poster{
margin: 20px 5px;
padding: 0;
}

.poster ul {
margin:10px 0 5px 0;
padding: 0 10px;
list-style: none
}

.poster-list2 {
display: block;
width: 31.7%;
background-color: #C1C1C1;
padding: 5px;
margin: 10px ;
text-align: center;
float: left;
}

.poster .poster-list2 a {
color: #000000;
font-size: 15px;
text-decoration: none;
}
.poster-list2 img{
max-width: 100%;
max-height: 350px;
margin-bottom: 0px;
border: solid 6px #3c3c3c;
-webkit-transition:all 0.25s ease-in-out;
transition:all 0.25s ease-in-out;
}

.poster-list2 p{
font-size: 15px;
margin: auto ;
}

.poster-list2 a:hover	{opacity: 0.8}


.pricearea img{
width: 100%;
}

.button,
.button::before,
.button::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .5s;
transition: all .5s;
}
.btn{
margin: 15px 0 30px 0;
padding: 15px 0;
}
.btn1	{
text-decoration: none;
color: #fff;
font-size: 18px;
border: 3px solid #fff;
padding: 20px 50px;
border-radius: 15px;
background-color: rgba(0, 0, 0, 0.7);
cursor: pointer}

.btn1:hover	{border: 3px solid #fff;
color: #3c3c3c;
background-color: #fff;}

.btn1 i	{color: #3c3c3c;
margin-right: 15px;
font-size: 18px}

.btn1 span	{display: inline-block;
text-indent: -9999px}

.btn2	{
text-decoration: none;
color: #fff;
font-size: 18px;
margin: 50px 0;
border: 3px solid #fff;
padding: 20px 50px;
border-radius: 15px;
background-color: rgba(0, 0, 0, 0.7);
cursor: pointer}

.btn2:hover	{border: 3px solid #fff;
color: #fff;
background-color: #188E66;}

.btn2 i	{color: #3c3c3c;
margin-right: 15px;
font-size: 18px}

.btn2 span	{display: inline-block;
text-indent: -9999px}

footer{
background-color: #555555;
height: 180px;
}
/* コピーライト */
.copyright{
margin-top: 80px;
padding: 30px 0 0 0;
color: #fff;
}
.copyright a {
padding: 5px;
margin: 5px ;
color: #fff;
text-decoration: none
}

.copyright a:hover {
color:#555555 
}


.txtfiled {
box-sizing: border-box;
width: 95%;
height: 50px;
margin-left: 15px;
border-width: 1px;
border-style: solid;
padding: 5px;
outline: 0;
font-family: inherit;
font-size: 18px;
}
.txtfiled:focus {
background-color: #ffffcc;
border: 1px solid red;
}

.txtfiled2 {
box-sizing: border-box;
width: 95%;
height: 200px;
margin-left: 15px;
border-width: 1px;
border-style: solid;
padding: 5px;
outline: 0;
font-family: inherit;
font-size: 18px;
}
.txtfiled2:focus {
background-color: #ffffcc;
border: 1px solid red;
}

/*ボタンデザイン*/
.submit{
font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;
cursor:pointer;/*カーソルを指先型にします*/
font-size:100%;
font-weight: bold;
width:200px;
padding: 16px 0;
margin:0.5em 0.5em 0.5em 0;
border-style:none;/*デフォルトのボーダーを消す。ボーダーの指定を上書きしてもOK*/
color: #fff;
background:#ff9900;/*背景色を指定*/
}
/*↓「:hover」で、ロールオーバー時に変えたい指定をします。ここでは背景色だけ変更*/
.submit:hover {
background-color: #FFBF00;
}

.more{
padding: 15px 100px;
text-decoration: none;
background-color: #ff9900;
color: #fff;
}

.more:hover{
background-color: #FFBF00;
}

/* ########### 599px以下 ########### */
@media (max-width: 599px) {
.poster-list {
width: 95%;
}

#menubtn{padding: 6px 12px;
	border: solid 1px #aaaaaa;
	border-radius: 5px;
	background-color: #ffffff;
	position: absolute;
	top: 20px;
	right: 15px;
	cursor: pointer}

#menubtn:hover	{background-color: #dddddd}

#menubtn:focus	{outline: none}

#menubtn i	{color: #888888;
	font-size: 18px}

#menubtn span	{display: inline-block;
	text-indent: -9999px}

/* ナビゲーション */
.menu	{display: none}

/* ナビゲーション */
.menu ul{margin: 0;
padding: 0;
list-style: none}

.menu li a	{display: block;
padding: 13px;
color: #000000;
font-size: 15px;
border-left: solid 1px #ccc;
text-decoration: none}

.menu li span{
font-size: 10px;
}

.menu li:last-child{
border-right: solid 1px #ccc;
}


.menu li a:hover{
background-color: 	#FFBF00;
color: #fff;
}

.menu ul:after	{content: "";
display: block;
clear: both}

.menu li	{float: left;
text-align: center;
width: 100%;
}

}

/* ########### 767px以下 ########### */
@media (max-width: 767px) {
header{
height: 100px;
padding-top: 70px;
}
.news-area{
width: 100%;
}
.fb-del{
display: none;
}
header .intro-text .intro-lead-in {
font-size: 15px;
line-height: 15px;
letter-spacing: 10px;
text-shadow:
-1px -1px #3c3c3c,
1px -1px #3c3c3c,
-1px 1px #3c3c3c,
1px 1px #3c3c3c;
}

header .intro-text .intro-heading {
font-size: 13px;
line-height: 15px;
text-shadow:
-1px -1px #fff,
1px -1px #fff,
-1px 1px #fff,
1px 1px #fff;
}

.heading1{
width: 300px;
margin-top: 60px;
}
.heading2{
width: 300px;
margin-top: 60px;
}
table.company td {
width: auto;
padding: 20px;
}
.btn1	{
text-decoration: none;
color: #fff;
font-size: 15px;
border: 3px solid #fff;
padding: 10px 30px;
border-radius: 13px;
background-color: rgba(0, 0, 0, 0.7);
cursor: pointer}
}
/* ########### 768px以上 ########### */
@media (min-width: 768px) {
nav{
position: fixed;
width: 100%;  
z-index: 999;
}
/* トグルボタン */
#menubtn	{display: none}
.menu2{
float: right;
}
/* ナビゲーション */
.menu ul{margin: 0;
padding: 0;
list-style: none}

.menu li a	{display: block;
padding: 13px;
color: #000000;
font-size: 15px;
border-left: solid 1px #ccc;
text-decoration: none}

.menu li span{
font-size: 10px;
}

.menu li:last-child{
border-right: solid 1px #ccc;
}


.menu li a:hover{
background-color: 	#FFBF00;
color: #fff;
}

.menu ul:after	{content: "";
display: block;
clear: both}

.menu li	{float: left;
text-align: center;
width: 150px;
}
header{
padding-top: 74px;
}
.heading1{
margin-top: 40px;
}
.heading2{
margin-top: 100px;
}
table.company {
width: 700px;
margin: 0 auto;
border-collapse: separate;
border-spacing: 0px 5px;
}
.poster-list {
width: 28%;
}
nav	{

border-top:3px solid #ff9900 ;
background-color: #fff;
}

}


/* ########### 1190px以上 ########### */
@media (min-width: 1190px) {
table.company {
width: 1100px;
}
.poster-list {
width: 30.5%;
}
.col-1,.col-2,.col-4,.copyright{
width: 1200px;
margin-left: auto;
margin-right: auto
}
}

