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

/*---------------　下層共通　-----------------*/

#page-contents {
width: calc(100% - 300px);
padding-left: 300px;
padding-top: 65px;
padding-bottom: 4%;

}

#page-contents .page-title {
margin-bottom: 8%;
}

#page-contents .page-title h2 {
	width: 100%;
font-size: 100%;
text-align: right;
color: #003F10;
margin-bottom: 20px;
}

#page-contents .page-title h2.antiSocial {

	margin-top: -40px;
}

#page-contents .page-title h2 span {
color: #003F10;
font-family: futura-pt, sans-serif;
font-style: normal;
font-weight: 500;
font-size: 90px;
line-height: 80%;
display: block;
border-bottom: solid 1px #003F10;
text-align: left;
margin-bottom: 5px;
padding-bottom: 10px;
}


#page-contents .page-title h2.antiSocial span{
font-size: 70px;
}

#page-contents .page-title p {
text-align: right;
font-size: 110%;
}

#page-contents .page-title p a {
transition: all 0.3s;
}

#page-contents .page-title p a.active {
color: #FF8000;
}

#page-contents section {
padding-bottom: 60px;
}
/*
#page-contents .w1000 {
max-width: 1000px;
width: 100%;
}

#page-contents .w800 {
max-width: 800px;
width: 100%;
}
*/

#page-contents section.page-lead {
padding-bottom: 30px;
}

#page-contents h3 {
font-size: 100%;
color: #003F10;
	margin-bottom: 15px;
}

#page-contents h3 span {
font-size: 40px;
position: relative;
margin-right: 45px;
}

#page-contents h3 span:after {
content: "";
position: absolute;
bottom: 0;
width: 1px;
height: 60px;
background: #003F10;
transform: rotate(35deg);
right: -30px;
}

#page-contents h4 {
margin-bottom: 25px;
padding: 10px 15px 7px;
background: #003F10;
font-size: 130%;
color: #FFFFFF;
}

#page-contents h5 {
margin-bottom: 15px;
padding-bottom: 3px;
border-bottom: solid 1px #003F10;
font-size: 130%;
color: #003F10;
}

#page-contents h6 {
font-size: 110%;
color: #003F10;
}

#page-contents .underline {
text-decoration: underline;
color: #003F10;
}

#page-contents .more-btn-s {
display: inline-block;
padding: 8px 20px;
background: #003F10;
border-radius: 30px;
color: white;
line-height: 100%;
text-decoration: none;
margin: 5px 0 15px;
}

#page-contents ul.page_index {
display: flex;
flex-wrap: wrap;
}

#page-contents ul.page_index li {
width: 46%;
/*/*height: 120px;*/

margin: 0 1% 2% 1%;
text-align: center;
/*background: #FF8000;*/
background: #003F10;
color: #FFFFFF;
font-weight: bold;
line-height: 130%;
font-size: 105%;
box-sizing: border-box;
border-radius: 30px;
}

#page-contents ul.page_index li a {
width: 100%;
height: 100%;
display: flex;
padding: 8px 20px;
align-items: center;
justify-content: center;
/*padding: 15px;*/
box-sizing: border-box;
color: #FFFFFF;
text-decoration: none;
position: relative;
/*border: solid 2px #FF8000;*/
border-radius: 30px;
}

/* 矢印が三角(hoverで反転) */
/*#page-contents ul.page_index li a {
  transition: all 0.9s;
}
#page-contents ul.page_index li a::before {
  background-color: #fff;
  clip-path: polygon(0 100%,100% 0,100% 100%);
  content: "";
  height: 12px;
  margin: auto;
  position: absolute;
  right: 7px;
  bottom: 7px;
  transition: all 0.9s;
  width: 12px;
}
#page-contents ul.page_index li a:hover::before {
  background-color: #FF8000;
}*/
#page-contents ul.page_index li a:hover {
 /* background-color: #fff;  color: #FF8000;
  opacity: 1;*/
}
#page-contents ul.page_index li:hover {
background: #003F10;
color: #FFFFFF;
opacity: 0.7;
}

#page-contents .page_nav p a {
transition: all 0.4s;
}

#page-contents .page_nav p a.active {
color: #FF8000;
}

#page-contents table.normal_table {
width: 100%;
border-bottom: solid 1px #C7C7C7;
border-left: solid 1px #C7C7C7;
line-height: 140%;
background: #FFFFFF;
color: #333333;
}

#page-contents table.normal_table tr.bg {
background: #EEEEEE;
}

#page-contents table.normal_table th {
width: 38%;
padding: 10px;
border-top: solid 1px #C7C7C7;
border-right: solid 1px #C7C7C7;
background: #DFEAE3;
}

#page-contents table.normal_table td {
width: 62%;
padding: 10px;
border-top: solid 1px #C7C7C7;
border-right: solid 1px #C7C7C7;
}


#page-contents table.normal_table2 th {
width: 50%;
}

#page-contents table.normal_table2 td {
width: 50%;
}

#page-contents a[href^="https://www.rectus.co.jp/"]:after {
margin: inherit;
font-family: inherit;
content: '';
font-weight: inherit;
}

#page-contents a[href^="http"]:after,
#page-contents a[href^="//"]:after {
margin: 0 0 0 3px;
font-family: "Font Awesome 5 Free";
content: '\f35d';
font-weight: 900;
}
#page-contents a[href^="https://www.rectus.co.jp/"]:after {
margin: inherit;
font-family: inherit;
content: '';
font-weight: inherit;
}

#page-contents .mt5{margin-top: 5px;}
#page-contents .mt10{margin-top: 10px;}
#page-contents .mt20{margin-top: 20px;}
#page-contents .mb5{margin-bottom: 5px;}
#page-contents .mb10{margin-bottom: 10px;}
#page-contents .mb15{margin-bottom: 15px;}
#page-contents .mb20{margin-bottom: 20px;}

#page-contents .red{color: red;}
#page-contents .yellow{color: red;}

#page-contents .center{text-align: center;}

#page-contents .line {
padding-top: 20px;
margin-top: 20px;
border-top: dashed 1px #C7C7C7;
}

#page-contents .frame {
border: solid 1px #C7C7C7;
box-sizing: border-box;
}

/*---------------　代表挨拶　-----------------*/

#page-contents.concept h3 {
margin-bottom: 8%;
}

#page-contents.concept .page-lead_t {
margin-left: 4%;
}

#page-contents.concept .page-lead_t span {
font-size: 34px;
color: #003F10;
font-weight: bold;
line-height: 160%;
display: inline-block;
}

#page-contents.concept .lead {
line-height: 220%;
}

#page-contents.concept .sign {
text-align: right;
margin-top: 10%;
}

/*---------------　沿革　-----------------*/

#page-contents.history dl {
margin-bottom: 20px;
padding-bottom: 20px;
display: flex;
border-bottom: dashed 1px #C7C7C7;
}

#page-contents.history dt {
width: 120px;
font-size: 180%;
color: #003F10;
flex-shrink: 0;
}

#page-contents.history dd {
flex-grow: 1;
}

/*---------------　会社概要　-----------------*/

#page-contents.outline dl {
margin-bottom: 20px;
padding-bottom: 20px;
display: flex;
border-bottom: dashed 1px #C7C7C7;
}

#page-contents.outline dt {
width: 160px;
font-weight: bold;
color: #003F10;
flex-shrink: 0;
}

#page-contents.outline dd {
flex-grow: 1;
}

#page-contents.outline iframe {
margin: 10px 0 20px;
}

/*---------------　事業案内　-----------------*/

#page-contents.products .page-lead {
display: flex;
justify-content: space-between;
align-items: flex-start;
}

#page-contents.products .page-lead .inbox {
width: 54%;
}

#page-contents.products .page-lead img {
width: 42%;
}

#page-contents.products .page-lead .lead {
margin-top: 8%;
}

#page-contents.products .item {
margin-bottom: 40px;
}

#page-contents.products .item .inbox {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-direction: row-reverse;
}

#page-contents.products .item .inbox .img {
width: 50%;
max-width: 600px;
margin-left: 20px;
}

#page-contents.products .item .inbox .img img {
width: 100%;
height: auto;
}

#page-contents.products .item .inbox .txt {
width: 64%;
}

#page-contents.products .item .inbox .img2 {
width: 30%;
max-width: 300px;
text-align: right;
}

#page-contents.products .item .inbox .img2 img {
margin-bottom: 10px;
}

#page-contents.products .item .inbox2 .txt {
width: 44%;
}

#page-contents.products .item ul.comment,
#page-contents.products .item ul.comment li {
list-style: disc;
}

#page-contents.products .item ul.comment {
padding-left: 1em;
}

#page-contents.products .column3 {
display: flex;
justify-content: space-between;
}

#page-contents.products .column3 .column3_box {
width: 31%;
}

#page-contents.products .column2 {
display: flex;
justify-content: space-between;
}

#page-contents.products .column2 .column2_box {
width: 48%;
}

#page-contents.products .item_column .item table.normal_table th {
width: 45%;
}

#page-contents.products .item_column .item table.normal_table td {
width: 55%;
}

#page-contents.products dl {
margin-bottom: 20px;
padding-bottom: 20px;
display: flex;
align-items: center;
border-bottom: solid 1px #C7C7C7;
}

#page-contents.products dt {
width: 260px;
font-size: 110%;
font-weight: bold;
color: #003F10;
}

#page-contents table.spec_table {
width: 100%;
border-bottom: solid 1px #C7C7C7;
border-left: solid 1px #C7C7C7;
line-height: 140%;
background: #FFFFFF;
color: #333333;
}

#page-contents table.spec_table tr:first-child {
background: #699E7E;
color: #FFFFFF;
}

#page-contents table.spec_table tr.bg {
background: #DFEAE3;
}

#page-contents table.spec_table th {
width: 33%;
padding: 15px;
border-top: solid 1px #C7C7C7;
border-right: solid 1px #C7C7C7;
}

#page-contents table.spec_table td {
width: 33%;
padding: 15px;
border-top: solid 1px #C7C7C7;
border-right: solid 1px #C7C7C7;
}

#page-contents.products .system_flow {
display: flex;
flex-wrap: wrap;
}
#page-contents.products .system_flow div {
position: relative;
width: 16.6%;
height: 100px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
background: #7BAA8E;
font-weight: bold;
color: #FFFFFF;
line-height: 140%;
padding-left: 20px;
box-sizing: border-box;
}

#page-contents.products .system_flow div p {
margin-bottom: 5px;
font-size: 160%;
color: #FFFFFF;
font-family: Verdana, Geneva, "sans-serif";
}

#page-contents.products .system_flow div:not(:last-child)::before,
#page-contents.products .system_flow div:not(:last-child)::after {
position: absolute;
z-index: 2;
top: 0;
bottom: 0;
left: 100%;
content: '';
border: 50px solid transparent;
border-left: 20px solid #7BAA8E;
margin: auto;
}
#page-contents.products .system_flow div:not(:last-child)::before {
margin-left: 1px;
border-left-color: #FFFFFF;
}

#page-contents.products ul.example {
display: flex;
flex-wrap: wrap;
}

#page-contents.products ul.example li {
width: 32%;
margin: 0 0.5% 1% 0.5%;
padding: 17px 10px 15px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #003F10;
border: solid 1px #699E7E;
font-weight: bold;
line-height: 100%;
border-radius: 3px;
box-sizing: border-box;
}

#page-contents.products ul.rack {
display: flex;
flex-wrap: wrap;
}

#page-contents.products ul.rack li {
width: 48%;
margin-right: 4%;
}

#page-contents.products ul.rack li:nth-child(2n) {
margin-right: 0;
}

#page-contents.products ul.rack li p {
line-height: 140%;
text-align: center;
margin-top: 10px;
}

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

#page-contents.contact .normal_table {
margin: 20px 0 10px;
}

#page-contents.contact .normal_table th,
#page-contents.contact .normal_table td {
padding: 20px 10px;
}

#page-contents.contact input.w400 {
max-width: 400px;
width: 100%;
box-sizing: border-box;
}

#page-contents.contact input.w300 {
max-width: 300px;
width: 100%;
box-sizing: border-box;
}

#page-contents.contact textarea {
width: 100%;
box-sizing: border-box;
}

#page-contents.contact input.send {
  padding: 10px 40px;
  background: #003F10;
  border-radius: 30px;
	color: #FFF;
	border: none;
	margin-top: 15px;
	  cursor : pointer;
}
#page-contents.contact input.send:hover {
	opacity: 0.7;
}

/*---------------　個人情報保護　-----------------*/

#page-contents.privacy-policy ol {
padding-left: 1.5em;
list-style: decimal;
}

#page-contents.privacy-policy li {
margin-bottom: 20px;
list-style: decimal;
}

/*---------------　お知らせ　-----------------*/

#page-contents.news dl {
margin-bottom: 20px;
padding-bottom: 20px;
display: flex;
border-bottom: dashed 1px #C7C7C7;
}

#page-contents.news dt {
width: 120px;
font-weight: bold;
color: #003F10;
}


/* タブレットレイアウト : 768 px ～ 959 px*/
@media screen and (max-width:959px)
{
#page-contents {
width: 90%;
margin: 0 auto;
padding-left: 0;
}
}


/* スマホ設定  768 以下*/
@media screen and (max-width:767px)
{

/*---------------　下層共通　-----------------*/

#page-contents .page-title {
display: block;
margin-bottom: 16%;
padding-right: 0;
}

#page-contents .page-title h2 {
width: 100%;
}

#page-contents .page-title h2 span {
font-size: 60px;
}

#page-contents .page-title h2.antiSocial span{
font-size: 60px;
}	
#page-contents .page-title p {
margin-top: 20px;
margin-left: 0;
font-size: 90%;
text-align: center;
}

#page-contents section {
padding-right: 0;
}

#page-contents h3 span {
font-size: 36px;
}

#page-contents h3 span:after {
height: 50px;
right: -25px;
}

#page-contents ul.page_index li {
width: 48%;
height: 80px;
font-size: 100%;
}

#page-contents .page_nav p {
text-align: center;
}

/*---------------　代表挨拶　-----------------*/

#page-contents.concept section.page-lead {
padding-bottom: 40px;
}

#page-contents.concept .page-lead_t span {
font-size: 26px;
}


/*---------------　沿革　-----------------*/

#page-contents.history dl {
display: block;
}

#page-contents.history dt {
width: 100%;
margin-bottom: 10px;
}

#page-contents.history dd {
font-size: 100%;
}

/*---------------　会社概要　-----------------*/

#page-contents.outline dl {
display: block;
}

#page-contents.outline dt {
width: 100%;
margin-bottom: 10px;
padding: 5px 10px 3px;
box-sizing: border-box;
background: #003F10;
color: #FFFFFF;
}

#page-contents.outline dd {
font-size: 100%;
}

/*---------------　事業案内　-----------------*/

#page-contents.products .page-lead {
display: block;
}

#page-contents.products .page-lead .inbox {
width: 100%;
}

#page-contents.products .page-lead img {
width: 100%;
}

#page-contents.products .page-lead .lead {
margin-bottom: 20px;
}

#page-contents.products .item .inbox {
display: block;
}

#page-contents.products .item .inbox .img {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
margin-left: 0;
}

#page-contents.products .item .inbox .txt {
width: 100%;
}

#page-contents.products .item .inbox .img2 {
width: 100%;
max-width: 100%;
display: flex;
justify-content: space-between;
flex-flow: wrap;
}

#page-contents.products .item .inbox .img2 img {
width: 49%;
margin-right: 2%;
margin-bottom: 2%;
}

#page-contents.products .item .inbox .img2 img:nth-child(2n) {
margin-right: 0;
}

#page-contents.products .item .inbox2 .txt {
width: 100%;
}

#page-contents.products .column3 {
display: block;
}

#page-contents.products .column3 .column3_box {
width: 100%;
}

#page-contents.products .column2 {
display: block;
}

#page-contents.products .column2 .column2_box {
width: 100%;
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: dashed 1px #FFFFFF;
}

#page-contents.products .column2 .column2_box:nth-child(2) {
border-bottom: none;
}

#page-contents.products .item_column .item table.normal_table th {
width: 45%;
}

#page-contents.products .item_column .item table.normal_table td {
width: 55%;
}

#page-contents.products dl {
display: block;
}

#page-contents.products dt {
width: 100%;
}

#page-contents.products .system_flow div {
height: 160px;
justify-content: flex-start;
flex-direction: row;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
font-feature-settings: normal;
padding-left: 15px;
}

#page-contents.products .system_flow div p {
margin-top: 15px;
font-weight: bold;
}

#page-contents.products .system_flow div:not(:last-child)::before,
#page-contents.products .system_flow div:not(:last-child)::after {
border: 80px solid transparent;
border-left: 15px solid #7BAA8E;
}
#page-contents.products .system_flow div:not(:last-child)::before {
margin-left: 1px;
border-left-color: #FFFFFF;
}

#page-contents.products ul.example li {
width: 48%;
margin: 0 1% 2% 1%;
}

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

#page-contents.contact .normal_table {
margin: 20px 0 10px;
}

#page-contents.contact .normal_table th,
#page-contents.contact .normal_table td {
	display: list-item;
padding: 20px 10px;
	list-style: none;
	width: 100%;
	box-sizing: border-box;
}

#page-contents.contact input.w400 {
max-width: 100%;
width: 100%;
box-sizing: border-box;
	font-size: 16px;
}

#page-contents.contact input.w300 {
max-width: 100%;
width: 100%;
box-sizing: border-box;
	font-size: 16px;
}

#page-contents.contact textarea {
width: 100%;
box-sizing: border-box;
}	
	
	
/*---------------　お知らせ　-----------------*/

#page-contents.news dl {
display: block;
}

#page-contents.news dt {
width: 100%;
}

}