@charset "UTF-8";

h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: normal;
}


body, div, ul, li, h1, h2, h3, h4, h5, p, blockquote{
margin: 0;	
padding: 0;
}



/*------------ fontStyle------------*/
body {
	color:#000;
	font-size:14px;
	line-height:1;
	background-color:#fff;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}



/*------------------------------------------------------------------------------------line------------*/
.line{width:100%; height:10px; background:#29150d;}
/*-----------------------------------------------------------------------------------visual----------*/

.titleph{width:100%;}


/*-----------------------------------------------------------------------------------------------------------clearfix-----------------*/

.clearfix{ /zoom:1; }
.clearfix:after{ content : ''; display : block; clear : both; height:0; }
/* .clearfix{ overflow:hidden; } */


/*----------------------------------------------------------------------------------page_tit----------*/


@media screen and (min-width: 980px) {

  
#title p{ margin:-40px 0 0 30px; }
.uratitle{display:none;}

#footer .main_5 h2{
  font-size:37.5px;
}

}
@media screen and (max-width: 979px) {
 .titleph{display:none;}
 .uraph{background: url( ../images/titlebar.png ) no-repeat center top;
        height:200px;
         background-size:100%;}

  #title h2{
  background: url( ../images/monegai.png ) no-repeat center top;
  height:60px;}
}


.boshu_jiin li{
  list-style-type:circle;
  margin-left:30px;
}

/*----------------------------------------------------------------------------------page_tit----------*/

#title{
width:960px;
margin:0 auto;
}


/*----------------------------------------------------------------------------------content----------*/

#content{
width:960px;
margin:0 auto;
}

/*--intro------------------------------------------------------------------------*/
#topphoto{text-align:center;}

.yohaku{width:100px;}

.intro-td{
  position: relative;
  /*float: left;*/
  margin-right: 40px;
  width: 500px;
  height: 350px;
  text-align: justify;
  text-justify:inter-ideogragh;
  margin-bottom: 5px;
  line-height: 2.2;
  color:#333;
  letter-spacing: 1px;
  vertical-align: middle;
  display: table-cell;}

----bosyu--------------------------------------------------------------------

.point li{ margin-top:60px; }

.point li{
float:left;
width:300px;
margin-left:30px;
}

.point li:first-child{ margin-left:0px; }

.point h3, .point h4{ text-align:center; }

.point h4{
font-weight:bold;
color:#29150c;
margin-top:12px;
letter-spacing:2px;
}

.point p{
line-height:1.8;
margin-top:4px;
}

img, {
border: 0;
vertical-align: bottom;
}

li {list-style-type: none;}

--flow-------------------------------------------------------
.works{ 
  margin-bottom:80px;
  margin-top:80px; 
}

.flow{
	padding-top:70px;
padding-bottom:70px;
}

.flow h3{ margin-bottom:30px;}

.fw_box .text{
background-color:#e3eec6;
padding:20px 20px;
width:526px;
height:170px;
border-top:1px dotted #ccc;
border-bottom:1px dotted #ccc;
float:right;
line-height: 1.8;
}

.fw_box .text span{
font-size:12px;
font-weight:bold;
}

.fw_box .text h5{
  background-color:#fcc;
  font-size:14px;
  font-weight:bold;
  border:3px solid #934200;
  text-align:center;
}
.fw_box .text h4{
color:#29150c;
font-size:18px;
font-weight:bold;
letter-spacing:2px;
line-height:1.6;
margin-top:5px;
}

.fw_box .text p{ margin-top:5px; }

.fw_box .photo{
border:1px solid #ddd;
padding:5px;
width:350px;
}

.flow .next{
text-align:center;
margin:12px 0;
}



@media screen and (max-width: 979px) {
 
 .intro{ width:50%;
  margin:60px auto 0;}


  .tree{display:none;}
  .yohaku{display:none;}
  .heya{ background: url( ../images/tera2.JPG) no-repeat center top;
         background-size:contain; height:200px;}

   .intro-td{
    max-width:100%;
    height:auto;
    margin-left: 80px;
  }
  .naiyo{
    margin-left:30px;     
}

  .point li{
  float:none;
  width:300px;
  margin:30px auto 0 !important;
  }

  .works{
  width:70%;
  margin:30px auto 0;
  }

.flow{
  width:70%;
  margin:60px auto 0;
  }

  .fw_box{ position:relative; }

  .fw_box .text{
  padding:14px 20px 20px 250px;
  width:auto;
  height:auto;

  float:none;
  }

.fw_box .photo{
border:none;

}
 .fw_box .photo img{
  position:absolute;
  left:20px;
  top:10%;
  width:150px;
height:100px;
 
}

  .dai h2{
    height:60px;
  background: url( ../images/bosyu.png ) no-repeat center top;
  }
  .dai h3 img{ display: none; }
  
  .dai2 h2{
    height:60px;
  background: url( ../images/flow.png ) no-repeat center top;
  }
  .dai2 h3 img{ display: none; }

@media screen and (max-width: 740px) {

  .point li{
  width:80%;
  max-width:300px;
  }

  #list_carousel li{
  width:200px;
  height:108px;
  }

 .works,
  .flow{
  width:90%;
  
  }

  .fw_box .text{
  width:auto;
  padding:20px;
  height:auto;
  border:none;
  float:none;
  margin:0;
  }

  .fw_box .photo{
  display:none;
  }

}


@media screen and (max-width: 768px) {

  #title{
    width:100%;
  }
  #content{
    width:100%;
  }
  .intro{
    width:100%;
    margin:60px auto;
  }

    .intro-td{
    float:none;
    max-width:100%;
    height:auto;
    margin-left: 80px;
    padding-right: 40px;
    padding-left:40px; 
  }

  .tree{display:none;}

  .works{
    width:80%;
  }
  .naiyo{
    margin-left:0;
  }
  #footer{
    width:100%;
    
  }

  #footer .main_5 h2{
    font-size:15px;
  }
  #content{
    overflow:hidden;
  }
  #to_top{
    top:70%;
  }


 .uraph{
        height:120px;
}

@media screen and (max-width: 300px) {

	 #to_top{
    display:none;
  }

   #title h2{
  background: url( ../images/monegai.png ) no-repeat center top;
  height:60px; width:100%;
  background-size:contain;}

  #title p{line-height: 1.8em;
           text-align:justify;}
}
.point img{width:100%;}

.text{text-align:justify;}

}