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

/* ----------------------------------- */
/* Body */
body {
	font-family: YuMincho, 'Yu Mincho', 'Hiragino Mincho ProN', 'serif';
    margin:0 auto;
	padding:0;
	text-align:center;
	width:100%;
	background-color:#fff;
}
/* ----------------------------------- */

/* Header(PC)*/
header {
	margin:0;
	padding:0;
	width: 100%;
	min-width:1200px;
	height: 100px;
	border-top:#001970 8px solid;
}


/* logo and tel\fax area(PC)*/
header .lg_and_tf{
    width: 1200px;
	height: 100px;
	margin:0 auto; 
	text-align:center;
}

/* logo image(PC)*/
.logo {
	float:left;
	margin:28px 0 0 20px;
	padding:0;
	width:310px;
	height:auto;
	text-align:left;
    }

.logo a:hover img{
    opacity: .5;
    }


/* Tel and Fax image (PC)*/
.tel_fax{
	float:right;
	margin:0;
	padding: 46px 20px 0px 0px;
	width: 378px;
	height:34px;
    }

/* パソコンで見たときは"pc"のclassがついた画像が表示される 
.pc { display: block !important; }
.sp { display: none !important; }*/
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される 
@media only screen and (max-width: 767px) {
 .pc { display: none !important; }
 .sp { display: block !important; }
}*/



/* ----------------------------------- */
/* Navigation(PC)*/
nav {
	margin:0 auto;
	padding:0;
	width: 100%;
	height:60px;
	text-align: center;
    font-family: ten-mincho-text, serif;

}

/* Menu PC*/
nav ul {
	list-style: none;
	margin:0 auto;
	padding:0;
	width:1200px;
	height:60px;
	background-color:#001970;
}

nav ul li {
	float:left;
	margin:0;
	padding:0;
	width:149px;
	height:60px;
	display:inline-block;
	color: #fff;
	font-size: 20px;
	line-height: 60px;
	text-align: center;
	font-weight: bold;
	border-right:1px solid #fff;
}

/* side space*/
.rl_sp{
	width:150px;
	border:none;
	}

/* widthout border*/	
.b_none{
	border:none;
}


nav ul li a {
	display:block;
	color: #fff;
	text-decoration: none;
	background-color:#001970;
}


nav ul li:hover a {
	display:block;
	color: #fff;
	background-color:#415496;
}

.here {
	background-color:#415496;
}

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


/* Container PC*/
.container {
    width: 1200px;
	height: 100%;
	min-height: 1500px;
	margin:0 auto;
	padding:0 0 40px 0;
	text-align:center;
	background:#fff;
}

/* Container map PC*/
.container_mp {
    width: 1240px;
	height: auto;
	margin:0 auto;
	padding:0;
	padding-bottom:40px;
	text-align:center;

}

/* Container sub pages PC*/
.container_sub {
    width: 1200px;
	height: auto;
	margin:0 auto;
	padding:0;
	padding-bottom:60px;
	text-align:center;

}

.top_ph{
	float:left;
	margin:0 0 0 0;
	padding:0;
	width:1200px;
	height:500px;
	text-align: left;
	background:rgba(236,236,236,1.00);
}

/* Top image*/
.image {
  position: absolute;
  width: 1200px;
  height:500px;
  opacity: 0;
  animation: change-img-anim 30s infinite;
}
.image:nth-of-type(1) {
  animation: change-img-anim-first 30s infinite;
  animation-delay: 0s;
}
.image:nth-of-type(2) {
  animation-delay: 10s;
}
.image:nth-of-type(3) {
  animation-delay: 20s;
}
@keyframes change-img-anim-first {
  0%{ opacity: １;}
  30%{ opacity: 1;}
  36%{ opacity: 1;}
  45%{ opacity: 0;}
  100%{ opacity: 0;}
}
@keyframes change-img-anim {
  0%{ opacity: 0;}
  30%{ opacity: 1;}
  36%{ opacity: 1;}
  45%{ opacity: 0;}
  100%{ opacity: 0;}
}

/* h1-h5 titles*/

/* method only*/
h1{ 
	float:left;
	clear:both;
	width:1200px;
	height:100px;
	margin:0 0 0 0;
	padding:0;
	font-size:28px;
	line-height:1.8em;
	color:#d0d0d0;
	text-align: center;	
	background-color:#747474;
}
.bg_service{
	background-image: url("../images/bg_service.png");
	background-repeat:no-repeat;
}

.bg_location{
	background-image: url("../images/bg_location.png");
	background-repeat:no-repeat;
}

.bg_drill{
	background-image: url("../images/bg_drill.png");
	background-repeat:no-repeat;
}

.bg_water{
	background-image: url("../images/bg_water.png");
	background-repeat:no-repeat;
}
.bg_painting{
	background-image: url("../images/bg_painting.png");
	background-repeat:no-repeat;
}
.bg_products{
	background-image: url("../images/bg_products.png");
	background-repeat:no-repeat;
}
/* copy */
h2{ 
	clear:both;
	width:1200px;
	height:100px;
	margin:0 0 0 0;
	padding:0;
	font-size:26px;
	line-height:1.9em;
	color:#d0d0d0;
	text-align: center;	
	background-color:#001970;
}

/* top page index titles */


/* titles */
h3{ 
	clear:both;
	width:530px;
	height:50px;
	margin:0px 335px 0 335px;
	font-size:28px;
	line-height:14px;
	background-image:url("../images/bg_ribbon.png");
	background-repeat:no-repeat;
	padding:20px 0 20px 0;
	}

/* intro */
h4{ 
	clear:both;
	width:1200px;
    height:auto;
	margin:0 0 20px 0;
	padding:0;
	font-size:20px;
	font-weight:lighter;

}

/* company only */
h5{
	clear:both;
	width:auto;
	height:26px;
	font-size:26px;
	margin:0 0 18px 0;
	padding:0;
}

/* title for each page */
h6{
	clear:both;
	width:530px;
	height:auto;
	margin:40px 335px 20px 335px;
	font-size:30px;
	line-height:14px;
	letter-spacing: 0.2em;
	padding:20px 0 20px 0;
	text-shadow: 1px 1px 2px #666; 
}
/* ----------------------------------- */


/* ----------------------------------- */
/* About service */
.about_service {
	width:1200px;
	height:auto;
	margin:0 0 20px 0;
	padding:0 0 10px 0;
	background-image: url("../images/bg_slash.png");
	background-repeat: repeat-x;
	list-style:none;

}

/* ----------------------------------- */
/* Service categries */
.about_service li {
	display:inline-block;
	text-align:center;
    align-items: center;
	margin:5px 10px 20px 10px;
	padding:0;
	width:240px;
	height:240px;
	background:#fff;
}

.sv_method {
	display:inline;
	text-align:center;
    align-items: center;
	margin:5px 10px 20px 10px;
	width:240px;
	height:240px;
}



.about_service li a:hover img{
    opacity: 0.6
}
/* About office */
.about_of {
	width:1200px;
	height:auto;
	margin:0 0 20px 0;
	padding:0 0 30px 0;
	background:url("../images/bg_slash.png") repeat-x;
}

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

/* ----------------------------------- */
/* Navigation buttons */

.btn_area{
    clear:both;
    width:1200px;
	height:100px;
	margin:20px 0px 40px 0px;
    display:flex;
    justify-content: center;
    align-items: center;
	font-size:20px;
	line-height:60px;
}


.box{
    display:block;
    width: 240px;
    height:60px;
    margin:0 20px 0 20px;
	background-image:url("../images/bg_arrow.png");
	background-repeat:no-repeat;
    color: #fff;
	box-shadow: 4px 4px #ddd;

}


.box a{
    display:block;
    width: 240px;
    height:60px;
	background-image:url("../images/bg_arrow.png");
	background-repeat:no-repeat;
    color: #fff;
    text-decoration: none;
}

.box a:hover{
    display:block;
    width: 240px;
    height:60px;
	background-image:url("../images/bg_arrow2.png");
	background-repeat:no-repeat;
    text-decoration: none;
}


.map{
	clear:both;
	width:1200px;
	height:auto;
	margin:20px 0 20px 0;
	padding:0;
	text-align: center;
	background-image:url("../images/bg_slash.png") repeat-x;
}

/* ----------------------------------- */
/* Footer */
footer {
	float:left;
	margin:0 auto;
	padding:20px 0 0 0;
	width: 100%;
	min-width:1200px;
	height: 70px;
	text-align: center;
    font-family: ten-mincho-text, serif;
	background-color:#001970;
}


footer ul {
	list-style: none;
	width:100%;
	height: 70px;
	min-hegiht:70px;
	margin:0;
	padding:0;
}


footer ul li{
	display:inline-block;
	height:30px;
	margin:0 1em 0 1em;
}

footer ul li a{
	color:#fff;	
	text-decoration: none;
}

footer ul li a:hover{
	color:#a9cffe ;	
	text-decoration: none;
}

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

.hidden {
	display: none;
}
/* ----------------------------------- */

/* ----------------------------------- */
/* Go to top */

.btn_top{
	width:60px;
	height:60px;
}

.scroll-top {
  position: fixed;
  right: 25px;
  bottom: 25px;
  z-index: 100;
  background-color: #ddd;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: #fff;
  line-height: 50px;
  text-align: center;
}

.scroll-top:hover {
  cursor: pointer;
  opacity: 0.7;
}
/* ----------------------------------- */

/* ----------------------------------- */
/* Copyright */
.copyright {
	float:left;
	width: 100%;
	height:50px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color:#001970;
	color: #FFFFFF;
	text-transform: none;
	font-weight: lighter;
	letter-spacing: 2px;
}
/* ----------------------------------- */

/* ----------------------------------- */
/* font */
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
.wf-kosugi { font-family: "kosugi"; }