@charset "UTF-8";

/*-------------------------------------------------------------------------
							news
-------------------------------------------------------------------------*/

#news{
	padding:0px 0px 10px 0;
	margin-bottom:10px;
	}
	
#news img{
	margin-bottom:10px;
	}

#news tr{ border-bottom:1px dotted #ccc;}
#news th{ padding:10px 0 8px 20px; vertical-align:top; width:20%;}
#news td{ padding:10px 0 8px 20px; }

.text-box{
    margin:0 0 20px 0;
	}
.text-box img{
    margin:0 0 20px 0;
	}
.date{color:#FF860C;}

.tolist{
	float:right;
	text-align:center;
	margin-bottom:30px;
	padding:10px;
	}
.tolist:hover{
	background-color:#ff9900;
	transition:0.5s;
	}
.tolist a{ 
	color:#ff9900;
	text-decoration:none;
	}
.tolist a:hover{ 
	color:#fff;
	text-decoration:none;
	}

@media screen and (max-width: 800px) {

#news{
	padding:0px 0px 10px 0;
	margin-bottom:10px;
	}
#news img{
	margin-bottom:10px;
	height:auto;
	width:100px;
	}

#news tr{ border-bottom:1px dotted #ccc;}
#news th{ padding:10px 0 0 0px; border-bottom:1px dotted #ccc;}
#news td{ padding:10px 0 0 10px; border-bottom:1px dotted #ccc;}


}



/*-------------------------------------------------------------------------
							/area/
-------------------------------------------------------------------------*/

section.area h2 {
font-size:1.0em;
margin-bottom:30px;
text-align:center; 
}
.areabox {
display:flex;
justify-content:space-between;
}
.areabox div {
width:50%; 
}
section.area h3 {
font-size:2.0em;
}

@media only screen and (max-width:900px) {

.areabox {
display:block;
justify-content:center;
}
.areabox div {
width:100%; 
}
.areabox div figure{
text-align:center;
}
.areabox .map img {
width:50%; 
}
section.area h3 {
font-size:1.5em;
}

}



/*-------------------------------------------------------------------------
							/flow/
-------------------------------------------------------------------------*/

.flow {
display:flex; 
}
.flow div {
flex:1; 
}
.flow div:nth-child(2) {
flex:4; 
}

.arrow {
text-align:center;
margin:50px 0; 
}

section.deli {
border-top:9px solid #94D1EC;
text-align:center; 
}
section.deli h2 {
text-align: center;
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
font-size:40px;
font-weight:bold;
color: #403000;
display: inline-block;
position: relative;
margin:30px 0; 
}
section.deli h2:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px; /*下線の上下位置調整*/
  display: inline-block;
  width: 100px; /*下線の幅*/
  height: 3px; /*下線の太さ*/
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translate(-50%); /*位置調整*/
  background-color: #403000; /*下線の色*/
}

.delibox {
display:flex;
justify-content:space-between; 
box-sizing:border-box; 
}
.delibox div {
width:30%;
border:1px dotted #777;
}
.delibox figure {
text-align:center;
height:73px; 
padding:50px 0; 
}
.delibox h3 {
color:#fff;
background:#94D1EC;
padding:10px 0;
text-align:center; 
}
.delibox p {
text-align:left;
padding:20px;
}

@media only screen and (max-width:900px) {

.flow {
display:block; 
}
.flow div {
flex:none;
text-align:center; 
}
.flow div h2 {
text-align: center;
font-size:0.9em;
margin-bottom: 20px;
}

.flow div:nth-child(2) {
flex:none;
text-align:left; 
}

.arrow {
margin:40px 0; 
}

section.deli {
border-top:9px solid #94D1EC;
text-align:center; 
}
section.deli h2 {
font-size:30px;
}
section.deli h2:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px; /*下線の上下位置調整*/
  display: inline-block;
  width: 100px; /*下線の幅*/
  height: 3px; /*下線の太さ*/
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translate(-50%); /*位置調整*/
  background-color: #403000; /*下線の色*/
}

.delibox {
display:block;
justify-content:center; 
}
.delibox div {
width:100%;
margin-bottom:50px; 
}
.delibox div:nth-child(3) {
margin-bottom:0; 
}

.delibox figure {
padding:30px 0; 
}


}




/*-------------------------------------------------------------------------
							/company/
-------------------------------------------------------------------------*/

table.gaiyou {
margin-bottom:60px; 
}
table.gaiyou tr {
margin-bottom:20px;
}
table.gaiyou th {
width:25%;
font-weight:bold;
vertical-align:top; 
}
table.gaiyou th:before {
content:"●";
color:#CB3B58;
font-size:1.5em; 
}
table.gaiyou td {
padding:10px 0; 
}

.map {
margin-bottom: 50px;
}

@media only screen and (max-width:900px) {

table.gaiyou th {
width:100%;
display:block; 
}
table.gaiyou td {
width:100%;
display:block; 
padding:0;
font-size:0.8em;
margin-bottom:10px; 
}

}


/*-------------------------------------------------------------------------
							/design/
-------------------------------------------------------------------------*/

.design h2 {
text-align:center;
color:#CB3B58;
font-size:2.5em;
margin-bottom: 30px;
}
.design div {
border:2px solid #CB3B58;
box-sizing:border-box; 
}
.design div h3 {
background:#CB3B58;
color:#fff;
text-align:center;
padding:10px 0; 
}
.design div figure {
float:left;
padding:20px;
}
.design div p {
padding:20px;
}
.design div:after{
	content: "";
	clear: both;
	display: block;
}

.design_flow {
display:flex; 
}
.design_flow figure {
margin-right:30px; 
}
.design_flow ul {
list-style:none;
}
.design_flow ul li:before {
content:"●";
color:#CB3B58;
font-size:1.5em; 
}



@media only screen and (max-width:900px) {

.design h2 {
font-size:1.2em;
}
.design div figure {
float:none;
}

.design_flow {
display:block; 
}
.design_flow figure {
margin-right:0px; 
text-align:center; 
}
.design_flow ul {
list-style:none;
padding-left:20px; 
}
.design_flow ul li:before {
content:"●";
color:#CB3B58;
font-size:1.5em; 
}

}


/*-------------------------------------------------------------------------
							/recruit/
-------------------------------------------------------------------------*/

section.posting h2 {
background:#519C58;
color:#fff;
text-align:center; 
padding:10px 0px;
margin-bottom:30px; 
}
section.posting h3 {
color:#519C58;
border-top:3px dotted #519C58;
border-bottom:3px dotted #519C58;
padding:5px 20px; 
margin-bottom:20px; 
}
section.posting figure.left {
float:left; 
margin:0 20px 30px 20px; 
}
section.posting span {
color:#CB3B58;
font-weight:bold;
}
section.posting .postbox {
display:flex;
justify-content:space-between; 
flex-wrap:wrap; 
}
section.posting .postbox div {
width:48%;
margin-bottom:30px;
border:1px solid #519C58;
}
section.posting .postbox div h4 {
background:#519C58;
color:#fff;
padding:10px 0;
text-align:center;
margin-bottom:30px; 
}
section.posting .postbox div figure {
text-align:center;
height:160px; 
}
section.posting .postbox div p {
padding:20px;
}

section.orikomi h2 {
background:#F39939;
color:#fff;
text-align:center; 
padding:10px 0px;
margin-bottom:30px; 
}
section.orikomi h3 {
color:#F39939;
border-top:3px dotted #F39939;
border-bottom:3px dotted #F39939;
padding:5px 20px; 
margin-bottom:20px; 
}
section.orikomi figure.left {
float:left; 
margin:0 20px 30px 20px; 
}
section.orikomi .oribox {
display:flex;
justify-content:space-between; 
flex-wrap:wrap; 
}
section.orikomi .oribox div {
width:48%;
margin-bottom:30px;
border:1px solid #F39939;
}
section.orikomi .oribox div h4 {
background:#F39939;
color:#fff;
padding:10px 0;
text-align:center;
margin-bottom:30px; 
}
section.orikomi .oribox div figure {
text-align:center;
height:160px; 
}
section.orikomi .oribox div p {
padding:20px;
}

@media only screen and (max-width:900px) {

section.posting h3 {
font-size:0.9em;
text-align:center;
padding:5px 0px; 
}
section.posting figure.left {
float:none; 
}
section.posting .postbox {
display:block;
justify-content:center; 
}
section.posting .postbox div {
width:100%;
}

section.orikomi h3 {
font-size:0.9em;
text-align:center;
padding:5px 0px; 
}
section.orikomi figure.left {
float:none; 
}
section.orikomi .oribox {
display:block;
justify-content:center; 
}
section.orikomi .oribox div {
width:100%;
}

}




/*-------------------------------------------------------------------------
							/contact/
-------------------------------------------------------------------------*/

/***** コンタクトフォーム *****/

/*　ContactForm7のテーブル化レスポンシブ調整　*/

/*テーブルを親要素の幅いっぱいに伸ばす*/
.table-res-form {
    width: 100%;
}
/*一行ごとに上ボーダー*/
.table-res-form tr {
    border-top: 1px #DDD solid;
}
/*一番上の行だけボーダーなし*/
.table-res-form tr:first-child {
    border-top: none;
}
/*奇数行だけ背景色つける*/
.table-res-form tr:nth-child(2n+1) {
    background: #eee;
}
/*thとtd内の余白指定*/
.table-res-form th, .table-res-form td {
    padding: 1.5em;
}
/*th（項目欄）は30%幅、テキストを右寄せ*/
.table-res-form th {
    width: 30%;
}
/*「必須」部分のスタイリング*/
.table-res-form .requied {
    font-size: 0.8em;
    color: #FFF;
    display: inline-block;
    padding: 0.3em 0.3em 0.2em;
				margin-left:20px;
    background:#ff8000;
    border-radius:5px;
}

/*ここから768px以下の指定*/

@media only screen and (max-width: 768px) {
    .table-res-form th, .table-res-form td {
        width: auto;
        display: block;
    }
    .table-res-form th {
        padding-bottom: 0;
        text-align: left;
    }
    .table-res-form .empty {
        display: none;
    }
        .table-res-form tr:last-child {
            border-top: none;
}
        .table-res-form input[type="submit"]{
            margin-top:-1em;
}
}

/*ここまで768px以下の指定---終わり*/

/*ここから入力欄のスタイル指定*/

/*各入力フォームスタイリング*/
.table-res-form input[type="text"], input[type="email"], textarea {
    border: 1px #89BDDE solid;
    padding: 0.5em;
    border-radius: 5px;
    margin-bottom: 0.5em;
    width: 100%;
}
/*入力欄にフォーカスしたら変化*/
.table-res-form input[type="text"]:focus, textarea:focus {
    background: #EEFFFF;
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);
}
/*送信ボタンスタイリング*/
.table-res-form input[type="submit"] {
    border: 1px #89BDDE solid;
    padding: 0.5em 4em;
    border-radius: 5px;
    background: #4C9ED9;
				font-size:20px;
    color: #fff;
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);
}
/*送信ボタン・マウスオーバー時スタイリング*/
.table-res-form input[type="submit"]:hover {
    background: #006599;
    box-shadow: none;
				transition: 0.5s;
				
}