@charset "UTF-8";
/* CSS Document */

/*---------------共通構成-----------------*/

a img:hover{
	opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
.wrap {
	clear:both;
	
}

.leftbox {
	width: 100%;
	height:380px;
	float: none;
	display: block;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

#ship .leftbox {
	background-image: url(../works_img/ship_image.jpg);
	border-top: 15px solid #325D7B;
	}
	
#gus .leftbox {
	background-image: url(../works_img/gus_image.jpg);
	border-top: 15px solid #2D6059;
	}
	
#gift .leftbox {
	background-image: url(../works_img/gift_image.jpg);
	border-top: 15px solid #713A59;
	}
	


.rightbox {
	padding: 30px 5%;
	margin-left: 0px;
	display: block;
	color: #FFFFFF;
	line-height:2.2em;
	font-size:108%;
	float:none;
}

.rightbox h2 {
	text-align:center;
	font-size:130%;
	margin-bottom:20px;
}

.rightbox p.goto{
	text-align: center;
	padding-top:15px;
}
.rightbox p.goto img{
	max-width:100%;
}

.inbox {
	padding: 0 5% 70px 5%;
}

.inbox h3 {
	text-align:center;
	margin-bottom:20px;
}

.inbox ul {
	width:100%;
	margin:30px 0;
	padding:0;
}

.inbox li {
	width:30%;
	margin-left:5%;
	float:left;
}

.inbox li:first-child {
	margin-left:0%;
}

.inbox li img {
	width:100%;
	height:auto;
}

.voice  {
	clear:both;
}

.voice .vo1 {
	width: 100%;
	float: none;
	display: block;
	padding-bottom: 15px;
}

.voice .vo2 {
	width:100%;
	float: none;
	margin-bottom:15px;
	text-align: center;
	display:block;
}
.voice .vo2 img {
	height: auto;
	max-width: 100%;
	margin: 0 auto;
}

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

.inbox {
	max-width:1100px;
	margin:0 auto;
}

.wrap {
	width:100%;
	height: 398px;	
}

.leftbox {
	width: 345px;
	height: 398px;
	float: left;
	text-align: right;
	overflow: hidden;
}

#ship .leftbox {
	border-top: 0px none;
	}
	
#gus .leftbox {
	border-top: 0px none;
	}
	
#gift .leftbox {
	border-top: 0px none;
	}

.rightbox {
	height: 398px;
	padding: 10%;
	margin-left: 352px;
	display: table-cell;
	vertical-align: middle;
	color: #FFFFFF;
	line-height:2.2em;
	font-size:108%;
}

.rightbox h2 {
	text-align:center;
	font-size:130%;
	margin-bottom:20px;
}



.inbox h3 {
	text-align:center;
	margin-bottom:20px;
}

.inbox ul {
	width:100%;
	margin:30px 0;
	padding:0;
}

.inbox li {
	width:30%;
	margin-left:5%;
	float:left;
}

.inbox li:first-child {
	margin-left:0%;
}

.inbox li img {
	width:100%;
	height:auto;
}

.voice  {
	clear:both;
}

.voice .vo1 {
	float: left;
	width: 60%;
}

.voice .vo2 {
	float: right;
	width:35%;
	margin-bottom:15px;
	text-align: center;
}

.voice .vo2 img {
	height: auto;
	max-width: 100%;
	margin: 0 auto;
}

}

/*-------ship desing  船舶建造修理工事-----------*/


#ship .wrap {
	background-color: #325D7B;
}



/*-------gus desing  ガス配管工事-----------*/


#gus .wrap {
	background-color: #2D6059;
}


/*-------gift desing  ギフト事業-----------*/


#gift .wrap {
	background-color: #713A59;
}

#gift .wrap p a {
	color: #FFFCE2;
}
#gift .wrap p a:hover {
	color: #FFF6AA;
}