@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@200;400&display=swap');
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
/******reset*******/

/* CSS Document */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html {
  margin: 0;
  padding: 0;
  overflow-y: scroll;
  height: 100%;
  font-size: 62.5%;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-family: 'Noto Sans Japanese', sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  font-size: 1.4rem;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a{ text-decoration: none; color: #2F2F2F;  }



/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
.flexlist { display: flex;}
#page .pc {
	margin-top: 100px;
}
#page .sp {
	margin-top: 70px;
}
.mvSlider {
  position: relative;
  z-index: 0;
}
/*header*/


.head h1{
  z-index: 20;
}

.bg{
  width: 100%;
  opacity: 0.8;
  position: absolute;
  top: 0;
  z-index: 10;
}

.bg img{height: 100px;}

.headrnav{
  position: absolute;
  right: 200px;
  top: 30px;
  font-weight: 400;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 0.2rem;
  z-index: 10;
}


.headrnav li {
  padding: 15px 12px;
  position: relative;
}
.headrnav li a:hover {
  color: #5E5E5E;  
}
@media screen and (min-width:768px){
  .headrnav li:hover:before {
  content: "";
  width: 20px;
  height: 1px;
  background-color: #111;
  position: absolute;
  bottom: 0px;
  left: 50%;
  margin-left: -10px;
  }
}

.header.fixed {
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 9999;
  width: 100%;
  background-color: #FFFFFF;
}
.head.fixed {
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 9999;
  width: 100%;
  background-color: #FFFFFF;
}
h1{position: absolute;
	z-index: 3;
	top:20px;
    left:200px;}



/*header*/



h2{ color: #595757;
	margin: 10% 0 10% 0;
   text-align:center;
	letter-spacing: 5px;
   font-size: 2em;
	font-weight: bold;
}


h3{ color: #595757;
	margin: 15% 0 10% 0;
   text-align:center;
	letter-spacing: 5px;
   font-size: 2em;
	font-weight: bold;
	}




/*services*/
.services{margin: 50px 0 50px 0;
		text-align: center;}

.services h2{
	margin: 5% 0 5% 0;
}
.services li {background-color: #efefef;
			padding: 40px 15px 40px 0;
			margin-right: 50px; flex:1;}

.services ul{padding-left:50px;}

.servicestext{margin: 20px 0 35px 0;
			 letter-spacing:5px;
             line-height:1.2;}
.square a {
	padding: 6px 45px;
	background-color: #666666;
	border-radius: 4px;
	color: #FFF;
}

.square a:hover {
  color: #666666;
  background-color: #AAAAAA;
}

h2 small{
	font-size: 1.2rem;
	display: block;
	color: #00427a;
	padding-top: 5px; 
}

h3 small{
	font-size: 1.2rem;
	display: block;
	color: #00427a;
	padding-top: 5px;
}
/*works*/

.works{ text-align: center;
	    margin: 50px 0 50px 0;
		padding:20px 0 60px 0;
        background-color: #00427a;}


.works h2{
  color: #FFF;
	margin: 3% 0 3% 0;
}

.link a{
	border-radius: 5px;
	padding: 10px 45px;
	background-color: #FFFFFF;
}

.slider_box{padding: 20px 0 70px 0;}


.aboutus{margin: 0 auto;
		width: 1000px;}




/* external css: flickity.css */

#main-gallery{
  margin-bottom:30px;
}
 
#main-gallery .gallery-cell {
  width: 66%;
  height: 200px;
  margin-right: 10px;
  counter-increment: gallery-cell;
}








/*company_profile*/

.company_profile table{width: 800px;
						margin: 0 auto;}

.company_profile td{  	padding: 15px 60px 15px 40px;
						border-bottom: 1px solid #333;
						letter-spacing: 2px;
						line-height: 1.3;
						color: #4C4C4C;}




/*企業理念　Corporate philosophy*/



.box{background-color: #f5fbfe;
	margin: 5% 0 10% 0;
	padding: 0 0 0 13%;}


.title{	font-size: 2.5em;
		padding:10% 0 5% 6%;
		font-weight: bold;
		color: #475d96;}


.corporate_philosophy_text {line-height: 3;
							padding: 0 0 5% 10%;}



/*業務内容　Business content*/


.business_content_text{ border: 1px solid #8d8d8d;
						margin: 30px 0 30px;
                        padding:30px;}

.business_content_text dt{font-size: 1.2em;
							font-weight: 500;
						 margin-bottom: 20px;}
.business_content_text dd{line-height: 1.5;}


/*業務の流れ　Process*/

.arrow{text-align: center;}

.process_text{background-color: #f5fbfe;
						margin: 20px 0 20px;
                        padding:30px;}

.process_text dt{font-size: 1.2em;
				font-weight: bold;
				margin-bottom: 20px;
 				letter-spacing:5px;}

.process_text dd{line-height: 1.5;
				letter-spacing:5px;}

/*業務の流れ　Process*/




/*アクセス*/

.map{padding: 50px 0 0 0;}
.map p{font-size: 1.5em;
		font-weight: bold;
		padding: 0 0 30px 0}



.google_map{
	position:relative;
	 width:100%;
	height:0;
	 padding-top:26%;}

.google_map iframe{
		 position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
}



/*footer*/
footer{border-top:5px solid #00427a;
padding-top: 30px;}
.footerlogo {
	text-align: center;
	
}
.footerlogo img:first-child {
  margin-bottom: 15px;
}
.footercoler{ padding: 20px; background-color: #00427a;}
.copyright{
  color: #FFF;
  font-size: 1.2rem;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 0.1rem;
  text-align: center;
}
.address{color: #34495e;
	line-height: 1.5;
	letter-spacing: 3px;
	padding: 20px;}

/*footer*/



.privacy {
  padding-bottom: 20px;
  padding-top: 30px;
  font-size: 1.3rem;
}
@media screen and (max-width: 1280px){

  h1{
  left:20px;
  }
  .headrnav {
    right: 20px;
  }
}
/*SP*/

@media screen and (max-width: 769px){
	
.pc { display: none!important; }
.sp {
	display: block!important;
	margin-top: 60px;
}

	h1 img{width: 170px;}

	.bg img{height: 60px;}
	
.flexlist{display: block;}
	
.headrnav{ justify-content:space-between;
	       position:relative;
			right:0px;
			top:0px;
			font-weight: bold;}


.headrnav li{padding: 10px 7px 20px 7px;;
			font-size: 10px;}
	



/*　ハンバーガーボタン　*/
.hamburger {
  display : block;
  position: fixed;
  z-index : 20;
  right: 10px;
  top: 10px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  text-align: center;
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 30px;
  height  : 2px ;
  left    : 6px;
  background : #555;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition   : 0.3s ease-in-out;
  transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}

/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top : 16px;
  left: 6px;
  background :#fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 16px;
  background :#fff;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}
  nav.globalMenuSp {
    display: none;
  }
nav.globalMenuSp.active {
  display: block;
  position: fixed;
  top  : 0;
  left : 0;
  color: #fff;
  background: rgba(0,0,0,0.7);
  text-align: center;
  width: 100%;
  opacity: 0;
  transition: opacity .6s ease, visibility .6s ease;
  z-index: 11;
}

nav.globalMenuSp ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
 
}

nav.globalMenuSp ul li {
	list-style-type: none;
	padding: 0;
	width: 100%;
	transition: .4s all;
	font-size: 1.8rem;
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
}
nav.globalMenuSp ul li:hover{
  background :#ddd;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #fff;
  padding: 2em 0;
  text-decoration :none;
}

/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
  opacity: 100;

}

h1{position: absolute;
	top:0;
  left:10px;
  }	
.toptitle{position:absolute;
			right: 10%;
	        top:25%;}	
	
.toptitle img{width: 140px;}	
	
.services {
  margin: 0px 0 50px 0;
}
.services h2 {
  margin: 0 0 5% 0;
}
.aboutus{margin: 0 auto;
		width: 95%;}
	
.company_profile table{width: 100%;
						margin: 0 auto;}
	
.company_profile td{ font-size: 10px; padding: 10px 0px 10px 10px;
	border-bottom: 1px solid #333;}



	

h2{ padding: 30px 0 20px 0;
	font-size: 1.2em;}	
	
h3{font-size: 1.2em;
	background:linear-gradient(transparent 80%, #e6e6e6 70%);}	
	
	
.title{font-size: 1.2em;}
	
.box{margin: 0;
		padding: 0;}
	
.corporate_philosophy_text{padding:5%;
	line-height:2;}
	
	
.services ul{display: block;
		padding: 0}
	

.services li{margin: 10px;}
	

	
.map p{font-size: 1em;}
  .google_map {
    padding-top: 50%;
  }
  .footerlogo img:first-child {
  width: 60px;
  margin-bottom: 5px;
}
.footerlogo img{width: 150px;}
	footer p{font-size: 12px;}	
	
.address{padding: 5px;}
	
.footercoler{ padding: 10px;}
.copyright{
  font-size: 1rem;
}




	
}