/*

Editor	: C.I.
Version	: 1.0
Since	: 2019-12-25

 */
 /* top
-------------------------------------*/

.home h2 span:before{
content:"-";
margin-right:5px;
}
.home h2 span:after{
content:"-";
margin-left:5px;
}
.home h2 span{
font-size:70%;
margin-left:1em;
}

.ttlKeyWrap{
background:url("/asset/img/top_about_bg.png") 0 0 no-repeat;
padding:0 1em 1em 20em;
}
.inTtlKeyWrap{
padding:0 2em 2em 2em;
background-color:#fff;
}
@media only screen and (max-width: 767px){
    .ttlKeyWrap{
    padding:20em 1em 1em 1em;
    }
    .inTtlKeyWrap{
    padding:0;
    }
}

.indexNewsWrap{margin-top:2em;}

.indexNewsWrap .indexNewsTtl{
float:left;
width:15%;
}

.indexNewsWrap .indexNewsList{
float:right;
width:83%;
}

.indexNewsWrap .indexNewsList{
border-left:solid 1px #707070;
}
.indexNewsWrap .indexNewsTtl h3{margin-top:0;}
.indexNewsWrap .indexNewsList .newsLists{margin-top:0;margin-left:1em;}
.indexNewsWrap .indexNewsList .newsLists li{border-bottom:none;padding:5px 0;}
.indexNewsWrap .indexNewsList .newsLists {border:none;}
.indexNewsWrap:after{
content:'';
visibility: hidden;
display: block;
height:0;
line-height:1;
clear:both;
}
@media only screen and (max-width: 767px){
    .indexNewsWrap .indexNewsTtl,
    .indexNewsWrap .indexNewsList{
    float:none;
    width:auto;
    }
    .indexNewsWrap .indexNewsList{border-left:none;}
    .indexNewsWrap .indexNewsList .newsLists{margin-left:0;}
    .indexNewsWrap .indexNewsList .newsLists li time{margin-left:0;}
    .indexNewsWrap{border-top:solid 1px #707070;padding-top:1em;}
    .indexNewsWrap .indexNewsTtl h3{float:left; margin-right:1em;}
    .indexNewsWrap .indexNewsTtl ul{float:left;font-size:0.8em;margin-top:5px;}
    .indexNewsWrap .indexNewsTtl{padding-bottom:1em;}
}
.indexWorks .tumList4 li:nth-child(4n+1){clear:none;}
.indexWorks .tumList4 li{margin-left:15px;}
.indexNewsWrap .indexNewsTtl:after{
content:'';
visibility: hidden;
display: block;
height:0;
line-height:1;
clear:both;
}
 /* careers
-------------------------------------*/
.careersSet .pic{float:right;width:31%;margin-right: 2%;}
.careersSet h2,
.careersSet h3,
.careersSet ul,
.careersSet p,
.careersSet table{float:left;width:64%;}


.careersSet:after{
content:'';
visibility: hidden;
display: block;
height:0;
line-height:1;
clear:both;
}
@media only screen and (max-width: 767px){
.careersSet .pic,
.careersSet h2,
.careersSet ul,
.careersSet table{float:none;width:auto;margin-right: 0;}
}

  /* access
-------------------------------------*/
 .mapWrap .columG3{margin-top:3em;}
 
 /* workflow
-------------------------------------*/
.flowWrap{position:relative;}
.flowWrap .flowTtl{
position:absolute;
top:0;
left:0;
bottom:0;
width:30%;
border:solid 1px #707070;
text-align:center;

}
.flowWrap .flowCon{
float:right;
width:66%;
}
.flowWrap .flowTtl h3{font-size:1.8em;}

#workflowDesign.flowWrap .flowTtl:after{
content:" ";
display:block;
width:100%;
height:100px;
background:url("/asset/img/flow_arrow_bottom.png") 50% 100% no-repeat;
background-size: 100% auto;
margin-bottom:-80px;
position:absolute;
bottom:0;
}
#workflowDesign.flowWrap{margin-bottom:100px;}

#workflowSupervision .flowWrap .flowTtl{
background-color:#EAE8E8;
border:none;
overflow: hidden;
}
#workflowSupervision .flowWrap:first-child .flowTtl:after{content:none;}
#workflowSupervision .flowWrap .flowTtl:after{
position:absolute;
content:"";
width:auto;
height:50px;
left:50%;
right:0;
bottom:0;
margin-left:-60%;
margin-bottom:-50px;
background-color:#fff;
border-right: 200px solid transparent;
border-top: 100px solid #EAE8E8;
border-top-width:50px;
border-left: 200px solid transparent;
}
/*.flowWrap .flowTtl:before{
content:"";
display: block;
width:100%;
height:5em;
border-right: 100px solid transparent;
border-bottom: 86.6025px solid #000;
border-left: 100px solid transparent;
background-color:#000;
}*/
.flowWrap .flowCon dl dt{float:left;width:20%;font-size: 1.6em;}
.flowWrap .flowCon dl dd{float:right;width:78%;}
.flowWrap .flowCon dl:after,
.flowWrap:after{
content:'';
visibility: hidden;
display: block;
height:0;
line-height:1;
clear:both;
}
.dot{border-bottom:dotted 1px #707070;padding-bottom:0.5em;}
#workflowDesign,
#workflowSupervision{margin-top:2em;}
#workflowSupervision{border-top:dotted 1px #707070;padding-top:1em;}
@media only screen and (max-width: 767px){
.flowWrap .flowCon dl dt,
.flowWrap .flowCon dl dd{float:none;width:auto;}
.flowWrap .flowTtl h3,
.flowWrap .flowCon dl dt{font-size:1.2em;margin-top:1em;}
}
/* staff
-------------------------------------*/
.architectWrap .pic{float:right;width:31%;margin-right: 2%;}
.architectWrap h2,
.architectWrap ul,
.architectWrap table{float:left;width:64%;}


.architectWrap:after{
content:'';
visibility: hidden;
display: block;
height:0;
line-height:1;
clear:both;
}
@media only screen and (max-width: 767px){
.architectWrap .pic,
.architectWrap h2,
.architectWrap ul,
.architectWrap table{float:none;width:auto;margin-right: 0;}
}

/* business
-------------------------------------*/
.leadWrap{
border-left:solid 1px #707070;
border-right: solid 1px #707070;
padding-left:8em;
padding-right:8em;
}

.leadWrap h2{margin-top:1.5em;}

@media only screen and (max-width: 1024px){
    .leadWrap{
    padding-left:5em;
    padding-right:5em;
    }
}
@media only screen and (max-width: 767px){
    .leadWrap{
    padding-left:1em;
    padding-right:1em;
    }
}

.conceptImg{
margin-top:5em;
}
.conceptImg h2 span{
font-size:1.5em;
margin-right:0.5em;
}
.conceptImg > h2:first-child{
margin-top:1em;
}
.conceptImg figure.pic{
float:left;
width:48%;
margin-right:2%;
}
.conceptImg h2,
.conceptImg p,
.conceptImg ul.tumList4,
.conceptImg h3{
float:right;
width:48%;
}
.conceptImg ul.tumList4{font-size:88%;}
.conceptImg ul.tumList4 i.badge{padding:0;margin-left:2px;}
.conceptImg ul.tumList4 i.badge:first-child{margin-left:0;}
.conceptImg h3.blogTtl{clear:both;width:auto;float:none;padding-top:2em;}
.conceptImg:after{
content:'';
visibility: hidden;
display: block;
height:0;
line-height:1;
clear:both;
}

.conceptImg:nth-child(2n) figure.pic{
float:right;
margin-left:2%;
margin-right:0;
}
.conceptImg:nth-child(2n) h2,
.conceptImg:nth-child(2n) p,
.conceptImg:nth-child(2n) ul.tumList4,
.conceptImg:nth-child(2n) h3{
float:left;
}
.conceptImg:nth-child(2n) h3.blogTtl{clear:both;width:auto;float:none;}

@media only screen and (max-width: 767px){
    .conceptImg figure.pic,
    .conceptImg h2,
    .conceptImg p,
    .conceptImg ul.tumList4,
    .conceptImg h3{
    float:none;
    width:auto;
    }
}

/* blog
-------------------------------------*/
.tumList4.blogList li{
font-size:90%;
}
.blog img{width:auto;height:auto;}
@media only screen and (max-width: 767px){
    .blog img{width:100%;height:auto;}
}
.blog input[type="text"]{width:80%;}
.blog input[type="submit"]{font-size:90%; font-weight: normal;margin-top:5px;}



/* works
-------------------------------------*/
/*objPicMain*/
.objPicMain{position:relative;}
figure.objPicMain{
overflow:hidden;
height:780px;
}
.objPicMain img{
position:absolute;
top:0;
width:100%;
height:auto;
display:block;
}
.objPicMain img.on{
position:relative;
z-index: 2;
}
@media only screen and (max-width: 1440px){
	figure.objPicMain {
	height:680px;
	}
}
@media only screen and (max-width: 1240px){
	figure.objPicMain {
	height:600px;
	}
}
@media only screen and (max-width: 900px){
	figure.objPicMain {
	height:500px;
	}
}
@media only screen and (max-width: 505px){
	figure.objPicMain {
	height:400px;
	}
}
@media only screen and (max-width: 400px){
	figure.objPicMain {
	height:300px;
	}
}
@media only screen and (max-width: 330px){
	figure.objPicMain {
	height:200px;
	}
}
.tumList8.jsChange li{
text-align:center;
overflow:hidden;
height:90px;
margin-top:10px;
}
.tumList8.jsChange li img{
height:100%;
width:auto;
}
@media only screen and (max-width: 1500px){
	.tumList8.jsChange li{
	height:76px;
	}
}

@media only screen and (max-width: 1400px){
	.tumList8.jsChange li{
	height:72px;
	}
}

@media only screen and (max-width: 1200px){
	.tumList8.jsChange li{
	height:70px;
	}
}
@media only screen and (max-width: 767px){
	.tumList8.jsChange li{
	height:150px;
	}
}
@media only screen and (max-width: 700px){
	.tumList8.jsChange li{
	height:120px;
	}
}
@media only screen and (max-width: 550px){
	.tumList8.jsChange li{
	height:100px;
	}
}
@media only screen and (max-width: 440px){
	.tumList8.jsChange li{
	height:80px;
	}
}
@media only screen and (max-width: 330px){
	.tumList8.jsChange li{
	height:60px;
	}
}