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

/* 基本枠組み サブページ用
----------------------------------------*/
main#sub .main-title {
	width:calc(100% - 100px);
	padding:150px 0px 150px 100px;
}

main#sub .main-title h2 {
	font-size:35px;
	position:relative;
	z-index:0;
	letter-spacing:10px;
}

main#sub .main-title h2 span {
	font-size:120px;
	letter-spacing:10px;
	display:block;
	color:#f1f6f9;
	position:absolute;
	top:-100px;
	left:-40px;
	z-index:-1;
}

@media only screen and (max-width:767px){
main#sub .main-title {
	width:100%;
	padding:150px 0px 100px 0;
}
main#sub .main-title h2 {
	font-size:30px;
	text-align:center;
	margin: 0 auto 0 10px;
	letter-spacing:10px;
}
main#sub .main-title h2 span {
	font-size:22vw;
	letter-spacing:5px;
	display:block;
	text-align:center;
	color:#f1f6f9;
position: absolute;
top:25%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
z-index:-1;
}
}



/* 基本枠組み サブページ用
----------------------------------------*/

.sub-content {
	max-width:1100px;
	margin:0 auto;
}

@media only screen and (max-width:1560px){
.sub-content {
	max-width:80%;
	margin:0 auto;
}
}

/* サブページ基本　サブタイトル */
.sub-content h3 {
	margin:100px 0 0;
	font-size:24px;
	letter-spacing:10px;
	color:#00699f;
}

.sub-content h3 {
    color:#00699f;
    font-size:25px;
    font-weight:600;
    letter-spacing:6px;
    padding:0 0 0 45px;
    position:relative;
    margin-bottom:30px;
}

.sub-content h3::before {
    content:"";
    background:url('../images/global_b.svg');
    background-repeat:no-repeat;
    width: 31px;
    height: 31px;
    background-size:contain;
    position:absolute;
    top: 50.8%;
    left:0;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


/*　会社概要ページ
----------------------------------------*/
.company-exp {
	font-size:15px;
	line-height:2.2;
	letter-spacing:1px;
	font-weight:500;
}

table.company-table {
	margin:20px 0 0;
	font-size:17px;
	border-collapse:collapse;
	width:100%;
	letter-spacing:1.5px;
	border-top:1px solid rgba(0,0,0,.2);
}

table.company-table th {
	padding:20px 0 20px 50px;
	border-bottom:1px solid rgba(0,0,0,.2);
}

.company-table td {
	padding:20px 0;
	font-weight:500;
	border-bottom:1px solid rgba(0,0,0,.2);
}

@media only screen and (max-width:767px){
table.company-table {
	font-size:15px;
	letter-spacing:0px;
}
table.company-table th {
	padding:20px 0 20px 0;
}
.company-table td {
	padding:20px 0 20px 10px;
	font-weight:500;
	border-bottom:1px solid rgba(0,0,0,.2);
}
}

@media only screen and (max-width:400px){
table.company-table {
	font-size:14px;
	letter-spacing:0px;
}
table.company-table th {
	padding:20px 0 20px 0;
}
}


/*　レスポンシブテーブル　*/
table.company-table02 {
	margin: 20px 0 0;
	font-size:17px;
	border-collapse:collapse;
	width:100%;
	letter-spacing:1.5px;
	border-top:1px solid rgba(0,0,0,.2);
}

table.company-table02 th {
	padding:20px 0 20px 50px;
	vertical-align: text-top;
	border-bottom:1px solid rgba(0,0,0,.2);
}

.company-table02 td {
	padding:20px 0;
	font-weight:500;
	border-bottom:1px solid rgba(0,0,0,.2);
}

.company-table02 td ul {
	margin:10px 0 0;
}

.company-table02 td ul li {
    display: flex;
    align-items:center;
	line-height:2;
	position:relative;
}

.company-table02 td ul li::before {
	content:"";
	width:5px;
	height:5px;
	margin-top: 2.5px;
	margin-right:15px;
	border-radius: 50%;
	border: #00699f 2px solid;
	text-align: center;
}

@media only screen and (max-width:767px){
table.company-table02 {
	font-size:15px;
	letter-spacing:0px;

}
table.company-table02 th {
	padding:20px 0 20px 0;
	display:block;
	width:100%;
	text-align:center;
}
.company-table02 td {
	padding:20px 0 20px 0;
	font-weight:500;
	display:block;
	width:100%;
	border-bottom:1px solid rgba(0,0,0,.2);
}
}

@media only screen and (max-width:400px){
table.company-table02 {
	font-size:14px;
	letter-spacing:0px;
}
table.company-table02 th {
	padding:20px 0 20px 0;
}
}


/*　事業内容ページ
----------------------------------------*/
table.business-table {
	margin:25px 0 50px;
	font-size:17px;
	border-collapse:collapse;
	width:100%;
	letter-spacing:1.5px;
	border-top:1px solid rgba(0,0,0,.2);
}

table.business-table th {
	padding:20px 0 20px 50px;
	vertical-align:text-top;
	border-bottom:1px solid rgba(0,0,0,.2);
	color:#00699f;
}

.business-table td {
	padding:20px 20px 20px;
	font-weight:500;
	border-bottom:1px solid rgba(0,0,0,.2);
	position:relative;
}

.business-table td::before {
	content:"";
	position:absolute;
	height:80%;
	left:-20px;
	width:0.8px;
	background:rgba(0,0,0,.2);
}

.business-table td ul li {
    display: flex;
    align-items:center;
    line-height:2.5;
    position:relative;
}

.business-table td ul li.has-btn {
	line-height:3.8;
}

.business-table td ul li::before {
	content:"";
    width:5px;
	height:5px;
	margin-top: 2.5px;
    margin-right:15px;
    border-radius: 50%;
    border: #00699f 2px solid;
    text-align: center;
}

@media only screen and (max-width:1350px){
table.business-table th {
	padding:20px 0 20px 20px;
	width:8em;
}
}

@media only screen and (max-width:767px){
table.business-table {
	letter-spacing:0px;
}
table.business-table th {
	padding:20px 0 20px;
	display:block;
	width:100%;
	text-align:center;
}
.business-table td {
	padding: 20px 0 20px 5px;
	font-weight:500;
	display:block;
	width:100%;
	border-bottom:1px solid rgba(0,0,0,.2);
}
.business-table td::before {
	display:none;
}
.business-table td ul li::before {
    margin-right:10px;
}
}

@media only screen and (max-width:400px){
table.business-table {
	font-size:16px;
	letter-spacing:0px;
}
table.business-table th {
	padding:20px 0 20px 0;
}
}

/*図*/
.graph {
	max-width:600px;
	margin:auto;
}

@media only screen and (max-width:820px){
.graph {
	max-width:80%;
	margin:auto;}	
}

@media only screen and (max-width:767px){
.graph {
	max-width:100%;
	margin:auto;}	
}



.btn_box {
position: absolute;
top: 50%;
left:15em;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.btn {
	background-color:#f1f6f9;
	font-size:14px;
	font-weight: 600;
	letter-spacing: .1em;
	text-align: center;
	text-decoration:none!important;
	line-height:43px;
	width:180px;
	height:43px;
	margin: auto;
	position: relative;
	display: block;
	overflow: hidden;
	transition: 0.5s;
	border-radius: 100px;
	text-decoration: none;
}

.btn a { 
	color:#00699f;
	text-decoration:none!important;
}

.btn a:hover {
	text-decoration:none!important;
}

.btn .icon {
  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  background: #abced8;
}

.btn .icon.arrow {
  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
  left:8px;
  width:20px;
  height:2px;
  background: none;
}

.btn .icon.arrow::before {
  position: absolute;
  content: "";
  top:-0.35em;
  right:8px;
  width:10px;
  height:10px;
  border-top:2px solid #abced8;
  border-right:2px solid #abced8;
  transform: rotate(45deg);
}


.btn:hover .icon.arrow {
  background: #abced8;
  transform: translate(0.5em, 0);
}

@media only screen and (max-width:767px){
.btn_box {
position: absolute;
top: 50%;
left:10em;
}
.btn {
	font-size:14px;
	line-height:38px;
	width:110px;
	height:38px;
	padding:0 0 0 1.5em;
}
}

/*　組織概要　*/
div.com-section {
margin:100px auto;
  position: relative;
  width:400px;
  height:400px;
  border-radius: 50%;
z-index:-1;
  background-image: conic-gradient(rgba(0,105,159,0.1) 0deg 90deg, rgba(0,105,159,0.3) 90deg 180deg, rgba(0,105,159,0.4) 180deg 270deg, rgba(0,105,159,0.2) 270deg 360deg);
}

div.com-section::before{
content: "タカ産業";
font-weight:600;
font-size:25px;
color:#fff;
text-align:center;
line-height:200px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
  width:200px;
  height:200px;
  border-radius: 50%;
  background-color: #00699f;
z-index:-1;
}




@media only screen and (max-width:767px){
div.com-section {
margin:50px auto;
  width:250px;
  height:250px;
}
div.com-section::before{
font-size:20px;
line-height:130px;
  width:130px;
  height:130px;}
}


div.com-section p {
	font-size:18px;
	font-weight:500;
	color:#00699f;
	line-height:1.8;
	text-shadow: #fff 0 0 3px,#fff 0 0 6px,#fff 0 0 6px;
}

div.com-section p span {
	font-size:16px;
	font-weight:500;
	margin:0 0 0 0.5em;
	padding:2px 7px 5px;
	color:#fff;
	background-color:#00699f;
	text-shadow:none;
}

div.com-section p.osaka {
	position: absolute;
	top:-10px;
	left:-40px;
}

div.com-section p.komu {
	position: absolute;
	top:-10px;
	right:-30px;
}

div.com-section p.kanri {
	position: absolute;
	bottom:-10px;
	left:-30px;
}

div.com-section p.product {
	position: absolute;
	bottom:-10px;
	right:-30px;
}


@media only screen and (max-width:767px){
div.com-section p {
	font-size:15px;
}
div.com-section p span {
	font-size:15px;
}

div.com-section p.osaka {
	left:-30px;
}
div.com-section p.komu {
	right:-25px;
}
div.com-section p.kanri {
	left:-25px;
}
div.com-section p.product {
	right:-25px;
}
}


/* 施工事例
----------------------------------------*/
.sub-content h2.works-slogan {
	font-size:30px;
	color:#00699f;
	letter-spacing:2px;
}
.sub-content h2.works-slogan span {
	display:block;
	position:relative;
}

.sub-content h2.works-slogan span::after {
	position:absolute;
	content:"";
	top: 50%;
	left:11em;
	width:200px;
	height:1px;
	background:#00699f;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

@media only screen and (max-width:1360px){
.sub-content h2.works-slogan {
	font-size:26px;
	letter-spacing:1px;}	
}
@media only screen and (max-width:1150px){
.sub-content h2.works-slogan {
	font-size:25px;}	
}

@media only screen and (max-width:1060px){
.sub-content h2.works-slogan {
	font-size:28px;}	
}

@media only screen and (max-width:1023px){
.sub-content h2.works-slogan {
	font-size:25px;
	margin-top:-70px;}	
}
@media only screen and (max-width:767px){
.sub-content h2.works-slogan {
	font-size:24px;
	margin-top:-50px;}
.sub-content h2.works-slogan span::after {
	width:55px;
	height:1.2px;
}
}

@media only screen and (max-width:400px){
.sub-content h2.works-slogan {
	font-size:23px;}
.sub-content h2.works-slogan span::after {
	width:45px;
}
}


/*　施工事例　カテゴリータイトル左　*/
.works-cate_title {
  display:flex;
  z-index: 1;
  position: relative;
  width:80%;
  margin:50px auto;
}

.works-cate_title_img {
height:auto;
z-index:1;
margin:0 10% 0 0;
max-width:550px;
width:48%
}

.works-cate_title_txt {
flex: 1;
margin:120px 0 0;
background:#fff;
padding:60px;
}

.works-cate_title_txt h2 {
font-size:28px;
color:#00699f;
letter-spacing:2px;
position:relative;
margin:0 0 30px;
}

.works-cate_title_txt h2::before {
	position:absolute;
	content:"";
	bottom:-10px;
	left:-10vw;
	width:20vw;
	height:1.2px;
	background:#00699f;
	z-index:0;
}

.works-cate_title_txt h3 {
font-size:23px;
letter-spacing:2px;
}

.works-cate_title_txt p {
font-size:14px;
margin:10px 0 0;
font-weight:500;
}

.works-cate_title:after {
background-color:#f1f6f9;
bottom:-100px;
content: "";
left:100px;
display: block;
height: calc(100% + 50px);
position: absolute;
width:100%;
z-index:-1;
}

@media only screen and (max-width:1600px){
.works-cate_title {
  width:90%;
}
.works-cate_title_img {
  margin:0 6% 0 0;
  width:45%
}
.works-cate_title_txt {

}
.works-cate_title_txt h2 {
font-size:26px;
}
.works-cate_title_txt h3 {
font-size:20px;
}
.works-cate_title_txt p {
font-size:14px;}
}

@media only screen and (max-width:1200px){
.works-cate_title_txt {
flex: 1;
margin:80px 0 0;
padding:50px;
}
.works-cate_title:after {
bottom:-50px;
}
}

@media only screen and (max-width:1150px){
.works-cate_title {
  width:90%;
}
.works-cate_title_img {
  margin:0 6% 0 0;
  width:40%
}
.works-cate_title_txt {
flex: 1;
margin:60px 0 0;
padding:40px;
}
.works-cate_title_txt h3 {
font-size:18px;
}
.works-cate_title_txt p {
font-size:13px;
}
}

@media only screen and (max-width:767px){
.works-cate_title {
display:flex;
flex-wrap: wrap;
}
.works-cate_title_img {
height:auto;
z-index:1;
margin:-50px 10% 0 0;
width:90%}
}

/*　施工事例　カテゴリータイトル右　*/
.works-cate_title_right {
  display:flex;
  z-index: 1;
  position: relative;
  flex-direction: row-reverse;
  width:80%;
  margin:50px auto;
}

.works-cate_title_right_img {
height:auto;
z-index:1;
margin:0 0 0 10%;
max-width:550px;
width:48%
}

.works-cate_title_right_txt {
flex: 1;
margin:120px 0 0;
background:#fff;
padding:60px;
}

.works-cate_title_right_txt h2 {
font-size:28px;
color:#00699f;
letter-spacing:2px;
position:relative;
margin:0 0 30px;
}

.works-cate_title_right_txt h2::before {
	position:absolute;
	content:"";
	bottom: -10px;
	left: 100px;
	width: 50vw;
	height:1.2px;
	background:#00699f;
	z-index:0;
}

.works-cate_title_right_txt h3 {
font-size:23px;
letter-spacing:2px;
}

.works-cate_title_right_txt p {
font-size:14px;
margin:10px 0 0;
font-weight:500;
}

.works-cate_title_right:after {
	right: 120px;
	background-color:#f1f6f9;
	bottom:-100px;
	content: "";
	right:100px;
	display: block;
	height: calc(100% + 50px);
	position: absolute;
	width:100%;
	z-index:-1;
}

@media only screen and (max-width: 1800px){
.works-cate_title_right {
  width:90%;
}
.works-cate_title_right:after {
	right: 120px;
	bottom:-100px;
	right:50px;
	width:80%;
}	
.works-cate_title_right_img {
  margin:0 0 0 6%;
  width:45%
}
.works-cate_title_right_txt {

}
.works-cate_title_right_txt h2 {
font-size:26px;
}
.works-cate_title_right_txt h3 {
font-size:20px;
}
.works-cate_title_right_txt p {
font-size:14px;}
}

@media only screen and (max-width:1200px){
.works-cate_title_right_txt {
flex: 1;
margin:80px 0 0;
padding:50px;
}
.works-cate_title_right:after {bottom:-50px;left: -50px;}
}

@media only screen and (max-width:1150px){
.works-cate_title_right {
  width:90%;
}
.works-cate_title_right_img {
  margin:0 6% 0 0;
  width:40%
}
.works-cate_title_right_txt {flex: 1;margin:60px 0 0;padding:40px;}
.works-cate_title_right_txt h3 {
font-size:18px;
}
.works-cate_title_txt p {
font-size:13px;
}
}

@media only screen and (max-width:767px){
.works-cate_title_right {
display:flex;
flex-wrap: wrap;
}
.works-cate_title_right_img {
height:auto;
z-index:1;
margin:-50px 10% 0 0;
width:90%}

.works-cate_title_right_txt h2::before {
    position: absolute;
    content: "";
    bottom: -5px;
    left: 180px;
    width: 30vw;
    height: 1.2px;
    background: #00699f;
    z-index: 0;
    }
}


/* 施工事例ギャラリー */
.gallery {
	margin:100px auto 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
	gap:30px;
}

.gallery figure {
	flex-grow:1;
	padding:0;
	margin: 0;
	object-fit: cover;
	max-width: calc(33.3333% - 30px);
}

.gallery figure img {
	border-radius:6px;
}

@media only screen and (max-width:820px){
.gallery {
	gap:20px;
}
.gallery figure {
	max-width: calc(50% - 20px);}	
}

@media only screen and (max-width:767px){
.gallery {
	margin:0px auto 0;
	gap:10px;
}
.gallery figure {
	max-width: calc(50% - 10px);}	
}