@charset "UTF-8";

/* ポリシー*/
#philosophy{width:80%; margin:50px auto}

#philosophy p{width:44%; float:left; padding:0 3%;}
#philosophy img{width:50%;}

/* 会社概要*/
#profile>h2{width:70%; margin:0 auto;}
#profile{width: 100%;background-color:#A0D9A8;padding:80px 20px 150px;box-sizing: border-box; color:#606060;line-height: 1.8;}
#profile2{max-width:800px; /* テーブルの最大幅 */width:100%;margin: 0 auto;background-color: #fff; border-radius:0px; padding: 10px 0; /* 上下の余白 */}
/*テーブル本体のデザイン*/
.profile-table {width: 90%; /* コンテナ内で少し小さくして左右の余白を作る */margin: 0 auto;border-collapse: collapse; /* 隙間をなくす */}
.profile-table th,
.profile-table td {padding: 20px;text-align: left;position: relative;vertical-align: top;}
.profile-table th {width:25%; /* PCでの項目幅 */font-weight: bold;}
/* 下線（共通） */
.profile-table tr {border-bottom: 1px solid #565656;}
/* 最後の行だけ下線を消す */
.profile-table tr:last-child {border-bottom: none;}
/*-------thの右側の縦線（疑似要素）------*/
.profile-table th::after {content: "";display: block; width: 2px; height: 50%; /* 線の高さ（余白を作るポイント） */  background-color: #565656; position: absolute; right: 0; top: 25%; /* 中央に配置 */ border-radius: 40px;}

/*---スマホ対応（レスポンシブ）----*/
@media screen and (max-width: 640px) {.profile-table {  width: 90%; }
/* テーブル要素をブロック化して縦積みにする */
.profile-table tr,
.profile-table th,
.profile-table td { display: block; width: 100%; box-sizing: border-box;}
.profile-table tr {margin-bottom: 5px; border-bottom: 1px solid #565656;}
.profile-table tr:last-child { margin-bottom: 0;padding-bottom: 0;border-bottom: none;}
.profile-table th { padding: 10px 0 5px;width: 100%; }
.profile-table td { padding: 0 0 10px; }
/* スマホではth右の縦線を消す */
.profile-table th::after{display: none;}}

/* 沿革*/
#history{width:70%; margin:0 auto; padding:50px 0 100px;}
.timeline {list-style: none;}
.timeline > li{margin-bottom:100px;}

/* for Desktop */
@media ( min-width:640px){.timeline > li {overflow: hidden; margin: 0;position: relative; }
.timeline-date { width:150px; float:left ; margin-top:10px; font-size:1.4em;color:#005B2B;line-height:2.4em;}
.timeline-content {width:75%;float:left; border-left:3px #e5e5d1 solid; padding-left:35px;/* 線が長くなる */padding-top: 5px;padding-bottom:50px; }
.timeline-content:before {content:''; width:13px; height:13px; background:#6fc173; position:absolute; left:145px; top:24px; border-radius:100%;}
}
