@charset "utf-8";

#mv{
width:100%;
height: 100hv;
background:url(../img/mv1.jpg);
background-position: center center;
background-size: cover;

}

@media only screen and (min-width: 768px) {/*pc*/
#mv,
.mvmask{
min-height:525px;
}
}


@media only screen and (max-width: 767px) {/*sp*/
#mv,
.mvmask{
min-height:350px;
}

}



.mvmask{
background:url(img/mask.png) 0 0 repeat-x;
border-top:1px solid #333;
}




/**  works **/




#works{
background:#fff;
border:4px solid #ddd;
margin:2em auto;
padding-bottom:2em;
}

@media only screen and (min-width: 1170px) { /*pc*/
#works{
max-width:1150px;
}

#works:after{
content:"";
}


}

@media only screen and (max-width: 1169px) {/*sp*/
#works{
margin:2em auto;
width:96%;

}

}

@media only screen and (max-width: 767px) {/*sp*/
#works{
margin:2em 10px;
max-width:auto;
}

}

#works h2{
background:url(img/title_mask.png) 0 0 repeat-x,#327998;
color:#fff;
text-align:center;
height:83px;
margin-bottom:1em;
padding-top:0.7em;
font-size:180%;
letter-spacing:0.2em;
}


#works a{
text-decoration:none;
color:#333;

}

.flex-workcontainer{
display:-webkit-box;
display:flex;
-webkit-flex-wrap:wrap;
flex-wrap: wrap;
flex-direction:row ;

}




.flex-work h3{
letter-spacing:0.1em;
margin:1em;
padding:0.5em;
border-bottom:1px solid #0F8BA6;
font-size:140%;
-moz-transition: 0.5s ease;
-webkit-transition:  0.5s ease;
-o-transition:  0.5s ease;
-ms-transition:  0.5s ease;
transition: 0.5s ease;
line-height:120%;
}

.flex-work a:hover h3{
/*color: #0C7287;*/
color:#C00;

}

@media only screen and (min-width: 768px) {/*pc*/
.flex-work a:hover h3{
/*	letter-spacing:0.2em;*/
}
.flex-work h3{
height:3.5em;
font-size:120%;
}
}


@media only screen and (max-width: 767px) {/*sp*/
.flex-work h3{
margin:1em 0;
padding:0.5em;
height:2.5em;
text-align:center;
}

}


.flex-work p{
margin:0 2em 1em;
text-align:left;
}

@media only screen and (max-width: 767px) {/*sp*/
.flex-work p{
margin:0 0.5em 1em;
}

}

.flex-work figure{
width:100%;
text-align:center;
overflow:hidden;

}

.flex-work figure img{
max-width:80%;
height:auto;
margin:1em auto;

}

.flex-work {
-moz-transition: 0.5s ease;
-webkit-transition:  0.5s ease;
-o-transition:  0.5s ease;
-ms-transition:  0.5s ease;
transition: 0.5s ease;
background:#fff;
border-radius:0;
margin-top:1em;
}
.flex-work:hover{
background:#DBEDF2;
border-radius:40px;
}

@media only screen and (max-width: 1169px) { /*pc*/
.flex-work:hover{
border-radius:30px;

}

}

@media only screen and (max-width: 767px) {/*sp*/

.flex-work:hover{
border-radius:20px;

}
}



#main #works figure img{
-moz-transition: -moz-transform 0.3s ease;
-webkit-transition: -webkit-transform 0.3s ease;
-o-transition: -o-transform 0.3s ease;
-ms-transition: -ms-transform 0.3s ease;
transition: transform 0.3s ease;
}
#main #works figure img:hover{

-webkit-transform: scale(0.95);
-moz-transform: scale(0.95);
-o-transform: scale(0.95);
-ms-transform: scale(0.95);
transform: scale(0.95);
}






@media only screen and (min-width: 768px) {/*pc*/


.flex-work {
flex: 0 1 33%;
border-right:1px solid #ccc;
}

.flex-work:nth-child(3n){
border-right:none;
}



}


@media only screen and (max-width: 767px) {/*sp*/

.flex-work {
flex-basis:100%;
}

.flex-work{
border-bottom:1px solid #ccc;

}
}







@media only screen and (min-width: 768px) {/*sp*/

.flex-container{
display: flex;
display: -webkit-flex;
flex-flow: row;
align-content: space-between;
}

.flex-item {
flex: 1 0 30%;
padding:10px 15px;

display: flex; 
align-items:stretch;

text-align:center;
}

.flex-item2 {
display: flex; 
flex-flow: column;
flex-direction: column;

text-align:center;
height:100%;

}

.flex-item2 p.come1:after{
content:"　　　　　　　　　　";
}

.flex-item2 figure{
margin:auto 0 0;
}

}



#news{
margin:5em 4em 0;
position:relative;
}



#news:before{
position: absolute;
top:0;
right: 0;
content:'';
width: 33px;
height: 33px;
border: 1px solid;
border-color: rgba(187, 187, 187, 1) rgba(187, 187, 187, 1) transparent transparent ;
}


#news:after{
display:inline-block; 
position: absolute;
left:0;
bottom: 0;
left: 0;
content:'';
width: 33px;
height: 33px;
border: 1px solid;
border-color: transparent transparent rgba(187, 187, 187, 1) rgba(187, 187, 187, 1) ;
}



#news h2{
font-size:150%;
font-weight:400!important;
padding:0.5em;
text-align:center;
margin-bottom:1em;
}

#news h2:after{
content:"";
display:block;
height:2px;
background: linear-gradient(to right, rgba(255,64,0,0.2) 20%,rgba(255,64,0,1) 48%,rgba(255,64,0,0.2) 100%);
margin-top:5px;
}


#news .entry{
display:block;
margin:0 1em;
padding:1em;

}


.newsbox{
position:relative;
}

.newsbox:after {content:"";}

#news .entry:after {content:"";}


.newsbox:before{
position: absolute;
top:0;
left: 0;
right: 0;
content:'';
width: 33px;
height: 33px;
border: 1px solid;
border-color: rgba(187, 187, 187, 1) transparent transparent rgba(187, 187, 187, 1);
}




.newsbox:after{
display:inline-block; 
position: absolute;
right:0;
bottom: 0;
right: 0;
content:'';
width: 33px;
height: 33px;
border: 1px solid;
border-color: transparent rgba(187, 187, 187, 1) rgba(187, 187, 187, 1) transparent ;
}



#news h3{
margin-bottom:2em;
}

#news h3:after {content:"";}


#news h3 a{
font-size:120%;
font-weight:400!important;


}

#news .entry h3 a{
display:block;
color:#0085B2;
text-decoration:none;
padding-left:20px;
text-decoration:underline;
}


#news .entry h3 a:hover{
color:#cc0000;
text-decoration:underline;
}


#news p{
color:#666;
margin-bottom:2em;
margin-left:0.5em;
}

#news p.date{
margin:0.6em;
font-size:90%;
float:left;
padding:0 20px 0 0;
background:url(img/ic_01.png) right center no-repeat;
}



#news figure{
width:100%;
height:auto;
position:relative;
}

#news figure img{
width:100%;
height:auto;
}


@media only screen and (min-width: 768px) {/*pc*/
#news figure{
width:304px;
/*height:203px;*/
margin-left:20px;
/*overflow:hidden;*/
float:right;
margin-right:0.5em;
}

#news figure img{
max-width:100%;
/*	max-height:100%;*/
height:auto;
/*position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
					transform: translate(-50%, -50%);
}
*/
padding:5px;
border:1px solid #ccc;
}

}


#news .linkbtn{
clear:both;
padding-top:1em;
text-align:center;
}



#news .bumon{
celar:both;
display:inline-block;
border:1px solid #79796A;
color:#444;
background:#fff;
padding:10px 20px 10px 40px;
border-radius: 10px; 
-webkit-border-radius: 10px;  
-moz-border-radius: 10px;
margin-bottom:0em;
margin-right: 10px;
background:url(img/ic_01.png) 15px center no-repeat;
text-decoration:none;
}

#news a.bumon{
-moz-transition: 0.3s ease;
-webkit-transition:  0.3s ease;
-o-transition:  0.3s ease;
-ms-transition:  0.3s ease;
transition: 0.3s ease;
}

#news a.bumon:hover{
padding:10px 40px 10px 20px;
background: url(img/ic_01w.png) 92% center no-repeat #3D8FA7;
color:#fff;
}




/**/



@media only screen and (max-width: 767px) {/*sp*/
#news{
margin:1em;
}

#news .entry{
margin:0 10px;
padding:0 0 1em;

}

#news p.date{
display:block;
float:none;
background:none;
}

#news p{
margin-left:0em;
}


#news h3{
padding-left:15px;
background:url(img/ic_01.png) 10px 0.8em no-repeat;
margin-bottom:1em;

}
#news a.bumon{
background:url(img/ic_01w.png) 15px center no-repeat #3D8FA7;
color:#fff;
}



}




#okudaadd{
margin:6em auto 5em;
background:#3C3C3C;
color:#fff;
background:url(img/kaisya_bg.png) 0 0 no-repeat #3C3C3C;
position:relative;
height:260px;
display:table;
width:100%;
}

#okudaadd address{
display:block;
width:40%;
height:260px;
text-align:center;
font-style:normal;
display:table-cell;
}

#okudaadd address h2{
padding:1.5em 0 1em;
}


#okudaadd a{
color:#fff;

}

#okudaadd .bumon{
celar:both;
display:inline-block;
border:1px solid #79796A;
color:#fff;
background:#fff;
padding:10px 20px 10px 40px;
border-radius: 10px; 
-webkit-border-radius: 10px;  
-moz-border-radius: 10px;
margin-bottom:0em;
margin-right: 10px;
background:url(img/ic_01.png) 15px center no-repeat;
text-decoration:none;
}

#okudaadd a.bumon{
-moz-transition: 0.3s ease;
-webkit-transition:  0.3s ease;
-o-transition:  0.3s ease;
-ms-transition:  0.3s ease;
transition: 0.3s ease;
}

#okudaadd a.bumon:hover{
padding:10px 40px 10px 20px;

background: url(img/ic_01w.png) 92% center no-repeat #3D8FA7;
color:#fff;
}



#okudaadd .map{
width:60%;
}
#okudaadd iframe{
width:60%;
position:absolute;
top:0;
right:0;
}


@media only screen and (max-width: 1169px) {/*sp*/
#okudaadd{
margin:3em auto;
width:96%;

}

}

@media only screen and (max-width: 767px) {/*sp*/

#okudaadd{
margin:3em auto;
width:100%;
height:520px;

}


#okudaadd address{
width:100%;
}
#okudaadd iframe{
width:100%;
position:absolute;
top:260px;
right:0;
}

#okudaadd a.bumon{
background:url(img/ic_01w.png) 15px center no-repeat #3D8FA7;
color:#fff;
}

}