.works_tit{
  font-size: 30px;
}

.works_tit span.fzS{
  width: auto;
  text-align: left;
    font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Times New Roman", "HG明朝E", "メイリオ", "Meiryo", serif;  
  font-size: 70%;
  font-weight: bold;
}

.works_tit span.fzS::after {
    display:inline-block;
    border-bottom: none;
}

.dTxt .detail {
    width: 48%;
}
.dTxt .descrp {
    width: 48%;
}

.dTxt .detail .fbox{
	display: flex;
	justify-content: space-between;
}

.dTxt .detail dl{
	width: 48%;
}

.dTxt .detail dt {
    width: 125px;
 
}

.dTxt .detail dd {
    margin-left: 125px;
  
}

.dTxt .descrp .crt {
  width: 45%;
  float: right;
  padding: 15px;
  background-color: #F2F2F2;
  margin-top: -50px;
}

.dTxt .descrp .crt img{
  width: 40%;
  float: left;
  margin-right: 15px;
}

.dTxt .descrp .crt p{
  padding-top: 45px;
  font-size: 90%;
}


.planWp{
  background-color: #fff;
  padding: 40px;
	text-align: center;
}

.planBox{
width: 80%;
	margin: 20px 10% 40px;
}

.planBox:last-child{
  margin-bottom: 0;
}

.planBox .box1,
.planBox .box2{
  text-align: center;  
  width: 48%;
}
.planBox .box3{ width: 48.5%;  }
.planBox .box4{ width: 48.5%;  }


.planBox .box6 li{
  margin-left: 1em; 
text-indent: -1em; 
  line-height: 1.6;
  margin-bottom: 0.5em;
}

#works22 #sec01_02 .arrow{
  width: 38px;
display: inline-block;
  margin: 300px 35px 0;
}


.boxPth{
     padding: 20px;
    border: #B3B3B3 1px solid; 
}

h3:after {
	content: ""; 
	display: block; 
	clear: both;
}

h4{
  font-weight: bold;
  font-size: 140%;
}
h3 .num{
	background-color: #333;
	color: #fff;
	display: inline-block;
	float: none;
	vertical-align: 5px;
	margin-right: 0.3em;
line-height: 1;
	font-size: 0.5em;
	text-align: center;
    padding: 0.2em 0.4em;
}

@media screen and (max-width:767px){
	
.works_tit{
  font-size: 24px;
}	
	
.dTxt .detail .fbox {
    display: block;
}	
.dTxt .detail {
    width: 100%;
}
.dTxt .descrp {
    width: 100%;
}	
	
.dTxt .detail dl {
    width: 100%;
}	
 
.dTxt .descrp .txl {
    width: 100%;
    float: none;  
} 
  
.dTxt .descrp .crt {
    width: 100%;
    float: none;
  margin-bottom: 20px;
  margin-top: 0;
}  
  
.dTxt .descrp .crt:after {
	content: ""; 
	display: block; 
	clear: both;
}
 
.planWp {
    padding: 20px 10px;
}
  
.planBox{
width: 100%;
    margin: 10px auto 20px;
}
  
.planBox .box1{
  width:90%;
  margin: 0 5%;
}
.planBox .box2,
.planBox .box3,
.planBox .box4,
.planBox .box5,
.planBox .box6{ width: 100%;margin-top: 15px;  }
  
  
#works22 #sec02 .boxL{
	width: 100%;
}  
  
  
}

/*-------*/

.constbox{
  border: #B3B3B3 1px solid;
  padding: 15px;
  position: relative;
}

.constbox .ssTt{
  position: absolute;
    top: 0;
    right: 0;
    background-color: #000;
    color: #ffffff;
    padding: 0 1em;
}


#works22 #sec02 .boxL{
	width:71.5%;
	text-align: left;
  margin-bottom: 40px;
}

#works22 #sec02 .boxR{
width: 25%;
text-align: left;
margin-bottom: 40px;
}

#works22 #sec02 .boxR img {
margin-top: 20px;
}	

#works22 #sec02 .boxL2{
width:29%;
float: left;
margin-bottom: 40px;

}

#works22 #sec02 .boxR2{
	width:67%;
float: right;
}

@media screen and (max-width:767px){
  
.constbox{
  padding: 10px;
}  
  
#works22 #sec02 .boxL{
	width: 100%;
	margin-bottom: 20px;
}  
  
  #works22 #sec02 .boxR{
width:100%;
margin: 0 0;
  }    
	
#works22 #sec02 .boxR img {
width: 55%;
float: left;
	margin-top: 15px;
}	

#works22 #sec02 .boxL2 {
width: 40%;
  margin:0 0 20px;
	float: right;	
}
	
#works22 #sec02 .boxL2 img {
  margin:15px 0 0;

}
	
#works22 #sec02 .boxR2{
	width: 100%;
  margin: 0 0 0;
} 
	
	#works22 #sec02 .boxR2 p{
		margin-bottom: 0;
	}	
   
}


/*----------*/

#works22 #sec03 .secbox01 {
  overflow: visible;
}

#works22 #sec03 .boxL{
width:57%;
margin-bottom: 20px;
margin-top:15px;
}


#works22 #sec03 .boxR{
width:39%;
text-align: left;
margin-left: 0;
margin-bottom: 40px;
margin-top:15px;  

}

#works22 #sec03 .boxR .phoBx{
margin-top: 25px;
}


@media screen and (max-width:767px){
  
#works22 #sec03 .boxR {
    width:100%;
	margin-bottom: 0;
}    
 
#works22 #sec03 .boxL{
width: 100%;
margin-bottom: 10px;
margin-top: 10px;
}	

#works22 #sec03 .boxL2{
	width:100%;
margin-top: 0;	
}


#works22 #sec03 .boxR2{
	width:100%;

}
  
 
}

/*----------------*/
	
#works22 #sec04 .boxL{
	width: 42%;
}

#works22 #sec04 .boxR{
width:54%;
float: right;
text-align: left;
}

#works22 #sec04 .boxR .inbox{
	margin-top: 20px;
}

#works22 #sec04 .boxR .boxPth{
position: relative;
margin-top: 40px;
width: 70%;
	display: flex;
	margin-left: 30%;
	align-items: center;
}

#works22 #sec04 .boxR .boxPth img{
	width: 40%;
	margin-left: 15px;
}

#works22 #sec04 .boxR .boxPth:before{
bottom: 100%;
    left: 75%;
    border-width: 60px 15px 60px 15px ;
    border-color: transparent transparent #B3B3B3 transparent ;
    border-style: solid;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

#works22 #sec04 .boxR .boxPth:after{
bottom: 99%;
    left: 75%;
    border-width: 60px 15px 60px 15px ;
    border-color: transparent transparent #fff transparent ;
    border-style: solid;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}  



@media screen and (max-width:767px){
 
#works22 #sec04 .boxL{
		width: 100%;
margin-bottom: 20px;     
	}

#works22 #sec04 .boxR{
    width: 100%;
  padding-top: 0;
}	

#works22 #sec04 .boxR .boxPth {
    width: 100%;
	margin-left: 0;
    margin-top: 20px;	
}
	#works22 #sec04 .boxR .boxPth img{
		width: 30%;
	}	
	
}


/*----------------*/

#sec05{
}

#sec05 .secbox01{
    padding: 10px 0 0;
}
	
#works22 #sec05 .boxL{
	width:43%;
	position: relative;
}

#works22 #sec05 .boxR{
	width:53.4%;
  text-align: left;
	position: relative;
}

#works22 #sec05 .boxR .inbox{
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}

#works22 #sec05 .boxR .inbox img{
	width: 48%;
}

@media screen and (max-width:767px){
  
#works22 #sec05 .secbox01{
    padding: 10px 0 0;
}

#works22 #sec05 .boxL{
		width: 100%;
    margin-bottom: 20px;  
      
	}
 

#works22 #sec05 .boxR {
    width:100%;
  margin: 0;
}	
  
 #works22 #sec05 .boxR .inbox {
    margin-top: 20px;
}
	
}
/*----------------*/

	
#works22 #sec06 .boxL{
	width:49.5%;

}

#works22 #sec06 .boxR{
	width:46.5%;
	text-align: left;

}

#works22 #sec06 .boxR .inbox{
width: 100%;
	display: flex;
	align-items:flex-start;
	justify-content: space-between;	
}

#works22 #sec06 .boxR .inbox > div{
	width: 47%;
}

#works22 #sec06 .boxR .inbox img{
	margin-bottom: 40px;
}

@media screen and (max-width:767px){
#works22 #sec06 .boxL {
width: 100%;
margin-top: 0;
margin-bottom: 20px;        
}
	
#works22 #sec06 .boxR .inbox img {
    margin-bottom: 20px;
}	

#works22 #sec06 .boxR{
width: 100%;

}

}

/*-------sec07---------*/
	
#works22 #sec07 .boxL{
	width:100%;
    margin: 0 0 30px;  
}

#works22 #sec07 .boxR{
	width:29.5%;
    margin: 0 0 30px;
	text-align: left;
}

#works22 #sec07 .boxR img{
	margin-bottom: 15px;
}

#works22 #sec07 .boxL2{
width: 30%;
	float: left;
	margin-right: 4%;
}

#works22 #sec07 .boxL2 img{

}

#works22 #sec07 .boxL2 p{

}

#works22 #sec07 .boxC2{
width: 28.8%;
	float: left;
	margin-right: 4%;

}

#works22 #sec07 .boxC2 .inbox p{
	padding: 0;
	margin: 0 0 10px;

}

#works22 #sec07 .boxC2 .inbox div{
position: relative;
	margin-bottom: 20px;
}

#works22 #sec07 .boxC2 .inbox div .ssbx{
    position: absolute;
    top: 0;
    left: 0;
    background-color: #fff;
    display: inline-block;
    padding: 0 1em;
    border: #ddd solid 1px;
}

#works22 #sec07 .boxR2{
width: 33%;
	float: right;
}


@media screen and (max-width:767px){
#works22 #sec07 .boxL {
width: 100%;    
}

#works22 #sec07 .boxR{
width:70%;
margin: 0 15%;      
}

#works22 #sec07 .boxL2 {
    width:100%;
    margin-right:0;
	margin-bottom: 15px;	
}
	
	#works22 #sec07 .boxL2 img{
		width: 70%;
		margin: 0 15%;
	}	
	
#works22 #sec07 .boxC2 {
    width:100%;
    margin-right:0;
	margin-bottom: 15px;
}
	
	#works22 #sec07 .boxC2 .inbox{
		display: flex;
		justify-content: space-between;
		
	}	
	
	#works22 #sec07 .boxC2 .inbox div{
		width: 48%;
	}	
	
#works22 #sec07 .boxR2 {
    width:100%;
    margin-right:0;
}	
	
	#works22 #sec07 .boxR2 img{
		width: 70%;
		margin: 0 15%;
	}		
  
}

/*----------------*/


#works22 #sec08 .boxL{
    width: 64%;
    margin-bottom: 30px;
}

#works22 #sec08 .boxR{
	width:32%;
	text-align: left;
}

#works22 #sec08 .boxL2{
	width:48.5%;
float: left;
}

#works22 #sec08 .boxR2{
	width:48.5%;
	float: right;

}


@media screen and (max-width:767px){
#works22 #sec08 .boxL{
width: 100%;
margin-bottom: 30px;
}
	
#works22 #sec08 .boxR {
    width: 70%;
margin: 0 15%;
	text-align: center;
}	

#works22 #sec08 .boxL2,
#works22 #sec08 .boxR2{
width: 100%;
	margin-top: 15px;
}

}

#works22 #sec09 .boxL{
    width: 50.5%;
}

#works22 #sec09 .boxR{
    width: 45.7%;
	text-align: left;
}

@media screen and (max-width:767px){
#works22 #sec09 .boxL{
    width: 100%;
    margin-bottom: 30px;
}

#works22 #sec09 .boxR{
    width: 100%;
}
	
	#works22 #sec09 .boxR img{
		float: left;
		margin-right: 15px;
		width: 50%;
	}	
	
	#works22 #sec09 .boxR > div{
		width: 45%;	
		float: right;
	}	

}

#works22 #secEnd .sectit03{
	width: 100%;
    padding-top: 10px;	
}


.inlineBlk {
    display: inline-block;
}