@charset "UTF-8";


/***************************************************

	トップページ

***************************************************/

header {
	height: 66px;
	padding-top: 0;
}

header .header_wrapper{
	/*width: 1300px;*/
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 10;
}

.header_wrapper h1{
	position: absolute;
	top: 40px;
	left: 32px;
}

main{
	margin-top: -66px;
}

.kv_area{
	width: 100%;
	height: 856px;
	margin: -37px auto 110px;
	position: relative;
	overflow: hidden;
}

.background{
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;	
}

.background img{
	width: 100%;
	height: auto;
}

.kv_text{
	position: absolute;
	top: 300px;
	left: 0;
	right: 0;
	text-align: center;
	line-height: 1;
	color: #fff;
}

.kv_text .catch{
	font-size: 42px;
	font-weight: 500;
	letter-spacing: 0.15em;
	margin-bottom: 48px;
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.75);
}

.kv_text .main{
	width: 682px;
	margin: 0 auto 53px;
}

.kv_text .main img{
	filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.75));
}

.kv_text .caption{
	font-size: 35px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.4;
	margin-bottom: 30px;
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.75);
}

.kv_text .sub_caption{
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.75);
}

.news_area{
	width: 1125px;
	position: absolute;
	bottom: 20px;
	left: 0;
	right: 0;
	margin: auto;
	padding: 14px 36px;
	background: #fff;
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    line-height: 1.2;
}

.news_area .title{
	width: 220px;
	font-size: 22px;
	color: var(--color1);
	font-weight: 500;
	letter-spacing: 0.1em;
}

.news_area .news_cont{
	width: calc(100% - 220px - 90px);
	font-size: 15px;
	font-weight: 500;
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.news_area .news_cont ul li{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 0.8em;
}

.news_area .news_cont ul li:last-child{
    margin-bottom: 0;
}

.news_area .news_cont .date {
    width: 106px;
    color: var(--color1);
    border-right: 1px solid #000;
}

.news_area .news_cont .text_data{
	width: calc(100% - 106px);
	padding: 0 30px;
	box-sizing: border-box;
}

.news_area .news_cont .text_data a{
	color: var(--text);
}

.news_area .link_data{
	width: 90px;
}

.news_area .link_data a{
	text-decoration: none;
    position: absolute;
    bottom: 14px;
    right: 36px;
}

.top_conlink{
	margin-bottom: 110px;
}

.top_conlink ul{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
}

.top_conlink ul li{
	width: 327px;
	border-left: 1px solid #808080;
	border-top: 1px solid #808080;
	border-bottom: 1px solid #808080;
}

.top_conlink ul li:last-child{
	border-right: 1px solid #808080;
}

.top_conlink ul li a{
	display: block;
	color: #000;
	text-decoration: none;
	text-align: center;
	line-height: 1;
}

.top_conlink ul li a .text_box{
	padding: 45px 0 35px;
}

.top_conlink ul li a .text_box .main{
	font-size: 30px;
	color: var(--color1);
	font-weight: 500;
	margin-bottom: 20px;
}

.top_conlink ul li a .text_box .sub{
	font-size: 15px;
	font-weight: 500;
}

.top_conlink ul li a .image_box{
	width: 327px;
	height: 392px;
	position: relative;
	overflow: hidden;
}

.top_conlink ul li a .image_box img{
	width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1.0);
    transition: all 0.2s linear;
}

.top_conlink ul li a:hover .image_box img{
    transform: translate(-50%, -50%) scale(1.1);
}


.works_area{
	padding: 94px 0 100px;
	margin-bottom: 90px;
	background-color: #cce0f7;
    margin-top: 180px;
    position: relative;
    overflow: hidden;
}

.works_area .works_title{
	font-size: 30px;
	color: var(--color1);
	font-weight: 500;
	line-height: 1;
	text-align: center;
	margin-bottom: 50px;
	position: relative;
    z-index: 2;
}

.works_area .works_title small{
	display: block;
	font-size: 15px;
	color: #000;
	font-weight: 500;
	margin-top: 14px;
}

.works_area ul{
	width: 985px;
	margin: 0 auto;
    position: relative;
    z-index: 2;
}

.works_area ul::before{
	content: '';
	display: inline-block;
	width: 414px;
	height: 414px;
	background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/common/footer_bgicon.png);
    position: absolute;
    top: -236px;
    left: -127px;
    z-index: -1;
}

.works_area ul li{
	margin-bottom: 20px;
}

.works_area ul li:last-child{
	margin-bottom: 0;
}

.works_area ul li a{
	display: block;
	height: 377px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: cover;
	color: #000;
	text-decoration: none;
	line-height: 1;
}

.works_area ul li.civil a{
	background-image: url('../images/top/works_cont01.jpg');
}

.works_area ul li.architecture a{
	background-image: url('../images/top/works_cont02.jpg');
}

.works_area ul li a:hover{
	opacity: 0.8;
}

.works_area ul li a .cont_box{
	width: 318px;
	height: 350px;
	background: #fff;
    position: absolute;
    top: 50%;
    left: 14px;
    transform: translate(0, -50%);
}

.works_area ul li:nth-child(even) a .cont_box{
    left: unset;
	right: 14px;
}

.works_area ul li a .cont_box .text_box{
    position: absolute;
    top: 50%;
    left: 45px;
    transform: translate(0, -50%);
}

.works_area ul li a .cont_box .text_box .title{
	font-size: 33px;
	margin-bottom: 15px;
}

.works_area ul li a .cont_box .text_box .sub_title{
	font-size: 15px;
	margin-bottom: 35px;
}

.works_area ul li a .cont_box .text_box .caption{
	font-size: 15px;
	line-height: 1.75;
	margin-bottom: 35px;
}

.works_area ul li a .cont_box .text_box .link{
	font-size: 15px;
	color: var(--color1);
}


.other_link{
	
}

.other_link ul{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.other_link ul li{
	width: 560px;
	margin: 0 20px;
}

.other_link ul li a{
	display: block;
	height: 214px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: cover;
	color: #000;
	text-decoration: none;
	line-height: 1;
}

.other_link ul li.recruit a{
	background-image: url('../images/top/other_link01.jpg');
}

.other_link ul li.sdgs a{
	background-image: url('../images/top/other_link02.jpg');
}

.other_link ul li a:hover{
	opacity: 0.8;
}

.other_link ul li a .text{
    position: absolute;
    top: 50%;
    left: 60px;
    transform: translate(0, -50%);
    color: #fff;
    line-height: 1;
}

.other_link ul li a .text .main{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: 20px;
}

.other_link ul li a .text .sub{
	font-size: 15px;
}


.customer{
	text-align: center;
	margin-top: 80px;
}

.customer a{
	display: inline-block;
	height: 52px;
	line-height: 52px;
	background-image: linear-gradient(45deg, #00478b 10%, #2971ad 100%);
	color: #fff;
	text-decoration: none;
	padding: 0 28px;
	border-radius: 6px;
}

.customer a:hover{
	opacity: 0.8;
}

.customer a strong{
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0.1em;
	padding-left: 40px;
	position: relative;
}

.customer a strong::before{
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('/assets/images/top/ico_hand.png');
	position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}



.genba_link{
	width: 1134px;
	margin: 0 auto 40px;
}

.genba_link a{
	display: block;
	height: 210px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	background-image: url('../images/top/genba_link_bg.jpg');
	position: relative;
	color: #fff;
	text-decoration: none;
}

.genba_link a:hover{
	opacity: 0.8;
}

.genba_link a::after{
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(30, 150, 112, 0) 44%, rgba(35, 104, 16, 0.8) 70%, rgba(81, 91, 49, 1) 100%);
	position: absolute;
    top: 0;
    left: 0;
}

.genba_link a p{
	text-align: right;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.04em;
	z-index: 10;
	position: absolute;
	bottom: 16px;
	right: 16px;
}

.genba_link a p small{
	font-size: 0.7em;
	font-weight: 500;
	letter-spacing: 0.04em;
	margin-right: 1em;
}




/********************************************************************************
	リッキド用 CSS
********************************************************************************/

@media(max-width:1300px){


header {
	height: 5.076923vw;
}

header .header_wrapper{
	width: 100%;
}

.header_wrapper h1{
	top: 3.076923vw;
	left: 2.461538vw;
}

main{
	margin-top: -6.153846vw;
}

.kv_area{
	height: 65.846154vw;
	margin: -2.846154vw auto 8.461538vw;
}

.kv_text{
	top: 23.076923vw;
}

.kv_text .catch{
	font-size: 3.230769vw;
	margin-bottom: 3.692308vw;
	text-shadow: 0px 0px 0.615385vw rgba(0, 0, 0, 0.75);
}

.kv_text .main{
	width: 52.461538vw;
	margin: 0 auto 4.076923vw;
}

.kv_text .main img{
	filter: drop-shadow(0px 0px 0.615385vw rgba(0, 0, 0, 0.75));
}

.kv_text .caption{
	font-size: 2.692308vw;
	margin-bottom: 2.307692vw;
	text-shadow: 0px 0px 0.615385vw rgba(0, 0, 0, 0.75);
}

.kv_text .sub_caption{
	font-size: 1.846154vw;
	text-shadow: 0px 0px 0.615385vw rgba(0, 0, 0, 0.75);
}

.news_area{
	width: 86.538462vw;
	bottom: 1.538462vw;
	padding: 1.076923vw 2.769231vw;
}

.news_area .title{
	width: 16.923077vw;
	font-size: 1.692308vw;
}

.news_area .news_cont{
	width: calc(100% - 16.923077vw - 6.923077vw);
	font-size: 1.153846vw;
}

.news_area .news_cont .date {
    width: 8.153846vw;
}

.news_area .news_cont .text_data{
	width: calc(100% - 8.153846vw);
	padding: 0 2.307692vw;
}

.news_area .link_data{
	width: 6.923077vw;
}

.news_area .link_data a{
    bottom: 1.076923vw;
    right: 2.769231vw;
}


.top_conlink{
	margin-bottom: 8.461538vw;
}

.top_conlink ul li{
	width: 25.153846vw;
}

.top_conlink ul li a .text_box{
	padding: 3.461538vw 0 2.692308vw;
}

.top_conlink ul li a .text_box .main{
	font-size: 2.307692vw;
	margin-bottom: 1.538462vw;
}

.top_conlink ul li a .text_box .sub{
	font-size: 1.153846vw;
}

.top_conlink ul li a .image_box{
	width: 25.153846vw;
	height: 30.153846vw;
}

.works_area{
	padding: 7.230769vw 0 7.692308vw;
	margin-bottom: 6.923077vw;
    margin-top: 13.846154vw;
}

.works_area .works_title{
	font-size: 2.307692vw;
	margin-bottom: 3.846154vw;
}

.works_area .works_title small{
	font-size: 1.153846vw;
	margin-top: 1.076923vw;
}

.works_area ul{
	width: 75.769231vw;
}

.works_area ul::before{
	width: 31.846154vw;
	height: 31.846154vw;
    top: -18.153846vw;
    left: -9.769231vw;
}

.works_area ul li{
	margin-bottom: 1.538462vw;
}

.works_area ul li a{
	height: 29vw;
}

.works_area ul li a .cont_box{
	width: 24.461538vw;
	height: 26.923077vw;
    left: 1.076923vw;
}

.works_area ul li:nth-child(even) a .cont_box{
	right: 1.076923vw;
}

.works_area ul li a .cont_box .text_box{
    left: 3.461538vw;
}

.works_area ul li a .cont_box .text_box .title{
	font-size: 2.538462vw;
	margin-bottom: 1.153846vw;
}

.works_area ul li a .cont_box .text_box .sub_title{
	font-size: 1.153846vw;
	margin-bottom: 2.692308vw;
}

.works_area ul li a .cont_box .text_box .caption{
	font-size: 1.153846vw;
	margin-bottom: 2.692308vw;
}

.works_area ul li a .cont_box .text_box .link{
	font-size: 1.153846vw;
}

.other_link ul li{
	width: 43.076923vw;
	margin: 0 1.538462vw;
}

.other_link ul li a{
	height: 16.461538vw;
}

.other_link ul li a .text{
    left: 4.615385vw;
}

.other_link ul li a .text .main{
	font-size: 2.307692vw;
	margin-bottom: 1.538462vw;
}

.other_link ul li a .text .sub{
	font-size: 1.153846vw;
}


.customer{
	margin-top: 6.153846vw;
}

.customer a{
	height: 4vw;
	line-height: 4vw;
	padding: 0 2.153846vw;
	border-radius: 0.461538vw;
}

.customer a strong{
	font-size: 1.538462vw;
	padding-left: 3.076923vw;
}

.customer a strong::before{
	width: 1.846154vw;
	height: 1.846154vw;
}


.genba_link{
	width: 87.230769vw;
	margin: 0 auto 3.076923vw;
}

.genba_link a{
	height: 16.153846vw;
}

.genba_link a p{
	font-size: 1.846154vw;
	bottom: 1.230769vw;
	right: 1.230769vw;
}





}




/********************************************************************************
	スマートフォン用 CSS
********************************************************************************/

@media(max-width:430px){


header {
	height: 5.076923vw;
}

header .header_wrapper{
	width: auto;

	margin: 0 auto;
	position: relative;
}

.header_wrapper h1{
	top: 3.466667vw;
	left: 5.333333vw;
}

main{
	margin-top: 0;
}

.kv_area{
	width: 100%;
	height: auto;
	margin: 0 auto 10.666667vw;
}

.background{
	width: 100%;
	position: static;
}

.kv_text{
	position: absolute;
	top: 13%;
	left: 0;
	right: 0;
}

.kv_text .catch{
	font-size: 3.733333vw;
	margin-bottom: 3.733333vw;
	text-shadow: 0px 0px 2.133333vw rgba(0, 0, 0, 0.75);
}

.kv_text .main{
	width: 60%;
	margin: 0 auto 4.266667vw;
}

.kv_text .main img{
	filter: drop-shadow(0px 0px 2.133333vw rgba(0, 0, 0, 0.75));
}

.kv_text .caption{
	font-size: 3.733333vw;
	margin-bottom: 3.2vw;
	text-shadow: 0px 0px 2.133333vw rgba(0, 0, 0, 0.75);
}

.kv_text .sub_caption{
	font-size: 3.2vw;
	line-height: 1.4;
	text-shadow: 0px 0px 2.133333vw rgba(0, 0, 0, 0.75);
}


.news_area{
	width: auto;
	position: static;
	margin: 4.8vw 5.333333vw 0;
	padding: 0;
	display: block;
}

.news_area .title{
	width: auto;
	font-size: 3.466667vw;
	margin-bottom: 2.133333vw;
}

.news_area .news_cont{
	width: auto;
	font-size: 3.466667vw;
	display: block;
}

.news_area .news_cont .date{
	width: auto;
	border-right: none;
	margin-bottom: 1.066667vw;
}

.news_area .news_cont ul li{
	display: block;
    margin-bottom: 0.8em;
}

.news_area .news_cont .text_data{
	width: auto;
	padding: 0;
	line-height: 1.4;
}

.news_area .link_data{
	width: auto;
	margin-top: 4.8vw;
	text-align: right;
}

.news_area .link_data a{
	text-decoration: none;
	position: static;
}







.top_conlink{
	margin: 0 5.333333vw 8vw;
}

.top_conlink ul{
	flex-wrap: wrap;
	justify-content: space-between;
}

.top_conlink ul li{
	width: 47%;
	margin-bottom: 5.333333vw;
	border: 1px solid #808080;
}

.top_conlink ul li:last-child{
	border: 1px solid #808080;
}

.top_conlink ul li a .text_box{
	padding: 3.733333vw 0;
}

.top_conlink ul li a .text_box .main{
	font-size: 5.866667vw;
	margin-bottom: 3.733333vw;
}

.top_conlink ul li a .text_box .sub{
	font-size: 3.733333vw;
}

.top_conlink ul li a .image_box{
	width: 100%;
	height: 38.666667vw;
}

.top_conlink ul li a:hover .image_box img{
    transform: translate(-50%, -50%) scale(1.0);
}


.works_area{
	padding: 10.666667vw 5.333333vw 13.333333vw;
	margin-bottom: 10.666667vw;
    margin-top: 21.333333vw;
}

.works_area .works_title{
	font-size: 5.333333vw;
	margin-bottom: 8vw;
}

.works_area .works_title small{
	font-size: 3.733333vw;
	margin-top: 3.2vw;
}

.works_area ul{
	width: auto;
	margin: 0 auto;
}

.works_area ul::before{
	width: 53.333333vw;
	height: 53.333333vw;
    top: -46.933333vw;
    left: -25.866667vw;
}

.works_area ul li{
	margin-bottom: 5.333333vw;
}

.works_area ul li a{
	height: auto;
	padding: 3.733333vw;
}

.works_area ul li a:hover{
	opacity: 1;
}

.works_area ul li a .cont_box{
	width: auto;
	height: auto;
	background: rgba(255,255,255,.85);
    position: static;
    transform: translate(0, 0);
}

.works_area ul li:nth-child(even) a .cont_box{
    left: 3.733333vw;
	right: 3.733333vw;
}

.works_area ul li a .cont_box .text_box{
    position: static;
    transform: translate(0, 0);
    padding: 3.733333vw;
}

.works_area ul li a .cont_box .text_box .title{
	font-size: 5.333333vw;
	margin-bottom: 2.666667vw;
}

.works_area ul li a .cont_box .text_box .sub_title{
	font-size: 3.2vw;
	margin-bottom: 3.2vw;
}

.works_area ul li a .cont_box .text_box .caption{
	font-size: 3.2vw;
	line-height: 1.75;
	margin-bottom: 3.733333vw;
}

.works_area ul li a .cont_box .text_box .link{
	font-size: 3.2vw;
}


.other_link{
	
}

.other_link ul{
	display: block;
}

.other_link ul li{
	width: auto;
	margin: 0 5.333333vw 5.333333vw;
}

.other_link ul li:last-child{
	margin-bottom: 0;
}

.other_link ul li a{
	height: 26.666667vw;
}

.other_link ul li a:hover{
	opacity: 1;
}

.other_link ul li a .text{
    left: 5.333333vw;
}

.other_link ul li a .text .main{
	font-size: 4.8vw;
	margin-bottom: 3.2vw;
}

.other_link ul li a .text .sub{
	font-size: 3.2vw;
}


.customer{
	margin-top: 10.666667vw;
}

.customer a{
	height: 12.266667vw;
	line-height: 12.266667vw;
	padding: 0 4.266667vw;
	border-radius: 1.6vw;
}

.customer a:hover{
	opacity: 1;
}

.customer a strong{
	font-size: 4.266667vw;
	padding-left: 8vw;
}

.customer a strong::before{
	width: 5.333333vw;
	height: 5.333333vw;
}



.genba_link{
	width: auto;
	margin: 0 5.333333vw 5.333333vw;
}

.genba_link a{
	height: 40vw;
}

.genba_link a:hover{
	opacity: 1;
}

.genba_link a::after{
	background: linear-gradient(160deg, rgba(30, 150, 112, 0) 44%, rgba(35, 104, 16, 0.8) 70%, rgba(81, 91, 49, 1) 100%);
}

.genba_link a p{
	font-size: 4.266667vw;
	bottom: 2.133333vw;
	right: 1.066667vw;
}



}


