@charset "utf-8";
.warp {
	width: 950px;
	margin: 0 auto;
}
.pcNone {
	display: none;
}

/* header
-------------------------------------------------- */
header{
	width: 100%;
	height: 100px;
	padding-top: 30px;
	background-color: #fff;
/*
	transform: translate3d(0,-120px,0);
	-webkit-transform: translate3d(0,-120px,0);
	transition: transform .5s ease;
	-webkit-transition: transform .5s ease;
*/
}
header .warp {
	width: 100%;
	min-width: 950px;
	max-width: 1100px;
}
header h1 {
	float: left;
	line-height: 1;
}
#mobileHead {
	background: #fff;
	width: 100%;
	z-index: 999;
	position: relative;
}

/* Fixed reset */
.fixed {
	position: fixed;
	top: 0;
	z-index: 1;
	/*box-shadow: 0px 1px 5px rgba(0,0,0,0.4);*/
}

/* nav
-------------------------------------------------- */
#globalNav {
	float: right;
	width: 600px;
}
#globalNav ul {
	float: right;
	height: 30px;
	font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}
#globalNav ul li {
	float: left;
  margin: 0 0.5em;
  padding: 0;
}
#globalNav ul li:first-child {
	margin-left: 0;
}
#globalNav ul li:last-child {
	margin-right: 0;
}
#globalNav ul a {
	display: block;
  padding: 0.5em 1em;
  position: relative;
  letter-spacing: 0;
  text-decoration: none;
}
#globalNav ul a:before,
#globalNav ul a:after {
  position: absolute;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
#globalNav ul a:before {
  bottom: 0;
	left: 0;
  display: block;
  height: 3px;
  width: 0%;
  content: "";
  background-color: #006934;
}
#globalNav ul a:after {
  left: 0;
  top: 0;
  padding: 0.5em;
  position: absolute;
  content: attr(data-hover);
  color: #ffffff;
  white-space: nowrap;
  max-width: 0%;
  overflow: hidden;
}
#globalNav ul a:hover:before,
#globalNav ul .on a:before {
  opacity: 1;
  width: 90%;
	margin: 0 5%;
}
#globalNav ul a:hover:after,
#globalNav ul .on a:after {
  max-width: 100%;
}
/* Toggle Button */
#navToggle {
	display: none;
	position: absolute;
	right: 3%;
	top: 17px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	z-index: 101;
}
#navToggle div {
	position: relative;
}
#navToggle span {
	display: block;
	position: absolute;
	height: 4px;
	width: 100%;
	background: #333;
	left: 0;
	transition: .35s ease-in-out;
}
#navToggle span:nth-child(1) {
	top: 0;
}
#navToggle span:nth-child(2) {
	top: 10px;
}
#navToggle span:nth-child(3) {
	top: 20px;
}
#topVisual {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 700px;
	padding-top: 10%;
	background-image: url(../../top/images/top_main.jpg);
	background-position:center center;
	background-size:cover;
	text-align: center;
}	
#topVisual.exceed {
	margin-top: 100px;
}	
#topVisual div {
	position: relative;
	background-color: rgba(255, 255, 255, 0.8);
	margin: 0 auto;
	width: 325px;
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
}
#topVisual p {
	width: 100%;
	line-height: 1;
	text-align: center;
}	
#topVisual p#ani01 {
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
	padding-top: 10%;
}	
#topVisual p#ani02 {
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
	padding-top: 14%;
	padding-left: 28px;
}	
#topVisual p#ani03 {
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
	padding-top: 13%;
	padding-bottom: 30px;
}	
#topVisual p#ani04 {
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
	position: absolute;
	bottom: 14%;
}	



/* #pagetop
-------------------------------------------------- */
#pagetop {
	position: fixed;
	z-index: 998;
	right: 87px;
	bottom: 100px;
}
#pagetop a {
	display: none;
	position: relative;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#pagetop a::before,
#pagetop a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}	
#pagetop a::before {
	width: 69px;
	height: 69px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-color: #fff;
	border: #22AC38 solid 2px;
}
#pagetop a::after {
	top: 9px;
	left: 26px;
	width: 16px;
	height: 16px;
	border-top: 1px solid #22AC38;
	border-right: 1px solid #22AC38;
	transform: rotate(-45deg);
}
#pagetop a:hover::before {
	background-color: #22AC38;
	border: #fff solid 2px;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#pagetop a:hover::after {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}

/* section
-------------------------------------------------- */
section {
	padding: 120px 0;
}
section:after {
	display: block;
	clear: both;
	content: "";
}

/* .title .sentence .linkBtn
-------------------------------------------------- */
.title {
	margin-bottom: 80px;
}
.linkBtn a {
	padding: 5px 32px;
	color: #22AC38;
	border: #22AC38 solid 1px;
	border-radius: 3px;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
	box-shadow: 2px 2px 0px #ccc;
}
.linkBtn a:hover {
	color: #fff;
	border-color: #22AC38;
	background-color: #22AC38;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
	box-shadow: 0px 0px 0px #ccc;
}
a.hover {
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}
a.hover:hover {
	opacity: 0.7;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}


/* #section01
-------------------------------------------------- */
#section01 {
	padding-top: 130px;
	margin-bottom: 65px;
	background: url(../../top/images/about_back.svg) no-repeat center top;
}
#section01 h3 {
	font-size: 3.2rem;
	margin-bottom: 60px;
}
#section01 h3 sup {
	font-size: 3.0rem;
	top: -0.2em;
}
#section01 h3 strong {
	margin: auto -0.5em;
}
#section01 figure {
	text-align: right;
}
#section01 figure figcaption {
	float: left;
	width: 380px;
	text-align: left;
	line-height: 1.8;
}
#section01 figure div {
	float: left;
	clear: both;
	width: 380px;
	text-align: left;
	margin-top: 3.4em;
}

/* #section02
-------------------------------------------------- */
#section02 {
	padding-bottom: 140px;
	background: url(../../top/images/work_back.svg) no-repeat center 100px;
}
#section02 .copy {
	font-size: 2.4rem;
	margin-bottom: 48px;
}
#section02 .sentence {
	line-height: 1.8;
	margin-bottom: 40px;
}
#section02 .linkBtn {
	text-align: center;
}
#section02 #workBlog {
	float: left;
	width: 100%;
	margin-bottom: 50px;
}
#section02 #workBlog a {
}
#section02 #workBlog .summary {
	float: left;
	width: 300px;
	margin: 0 25px 35px 0;
}
#section02 #workBlog .summary:nth-child(3n) {
	margin-right: 0;
}
#section02 #workBlog .summary .photo {
	height: 120px;
	display: block;
	overflow: hidden;
	margin-bottom: 6px;
}
#section02 #workBlog .summary .photo img {
	width: 100%;
	margin-top: -10%;
}
#section02 #workBlog .summary .ttl {
	color: #06C;
	font-weight: bold;
	line-height: 1.4;
	border-bottom: #000 dotted 1px;
	padding-bottom: 3px;
	margin-bottom: 3px;
}
#section02 #workBlog .summary .text {
	font-size: 1.2rem;
	line-height: 1.4;
}
#section02 #workBlog .summary .text strong {
	color: #06C;
	font-weight: normal;
	padding-right: 3px;
}
#section02 #workBlog a:hover > .ttl,
#section02 #workBlog a:hover > .text strong {
	text-decoration: underline;
}
#section02 #workBlog a:hover > .photo img {
	opacity: 0.7;
}



 /* #section03
-------------------------------------------------- */
#section03 {
	background: rgba(201, 188, 156, 0.3) url(../../top/images/project_back.svg) no-repeat center 100px;
}
#section03 h2 {
	margin-bottom: 110px;
}
#section03 figure {
	height: 366px;
	width: 100%;
	margin-bottom: 60px;
	background: #fff url(../../top/images/project01_link.svg) no-repeat 99% 97%;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#section03 figure:nth-child(3) {
	background-image: url(../../top/images/project02_link.svg);
}
#section03 figure:nth-child(4) {
	background-image: url(../../top/images/project03_link.svg);
}
#section03 figure img {
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#section03 figure figcaption {
	float: right;
	width: 410px;
	padding-top: 40px;
	text-align: center;
}
#section03 a:hover > figure {
	background-color: #faffeb;
}
#section03 a:hover > figure > img {
	opacity: 0.7;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}

 /* #section04
-------------------------------------------------- */
#section04 {
	background-color: rgba(34, 112, 168, 0.2);
	padding-bottom: 60px;
}
#section04 table {
	float: left;
	width: 650px;
}
#section04 table th {
	font-weight: normal;
	text-align: left;
	vertical-align: top;
	width: 20%;
	border-right: #231815 solid 1px;
}
#section04 table td {
	width: 80%;
	padding: 0 0 10px 2em;
}
#section04 table tr:last-child td {
	padding-bottom: 0;
}
#section04 .linkBtn {
	float: right;
	text-align: center;
	margin-top: 12em;
}
#section04 .linkBtn a {
	padding: 10px 46px;
	margin: 35px auto 0;
	background-color: #fff;
	white-space: nowrap;
}
#section04 .linkBtn a:hover {
	background-color: #006934;
	border-color: #006934;
}
#section04 .linkBtn a img {
	vertical-align: sub;
	margin-right: 8px;
}
#section04 p {
	float: right;
  clear: both;
	margin-top: 10px;
}

 /* #map
-------------------------------------------------- */
#map {
	width: 100%;
	height: 480px;
}
#map iframe {
	width: 100%;
	height: 100%;
}

 /* #section05
-------------------------------------------------- */
#section05 {
}
#section05 li {
	position: relative;
	float: left;
	margin: 0 29.5px 29.5px 0
}
#section05 li:nth-child(3n) {
	margin-right: 0;
}
#section05 li a {
	display: block;
	border: #999 solid 1px;
	-webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#section05 li a:hover {
	background-color: #22ac38;
}
#section05 li a:hover img {
	opacity: 0.7;
}


 /* footer
-------------------------------------------------- */
footer {
	padding: 60px 0;
	text-align: center;
	line-height: 1;
}
footer p {
	margin: 0 auto 10px;
}
footer small {
	font-size: 1.0rem;
	letter-spacing: normal;
}



/*------------------------------------------------
about.html
-------------------------------------------------- */
#topVisual.about {
	background-image: url(../../about/images/about_main.jpg);
	background-position: right bottom;
}	
#topVisual.about p {
	width: auto;
	color: #fff;
}	
#topVisual.about .logo {
	position: absolute;
	top: 30px;
	left: 40px;
	filter: alpha(opacity=1);
  -moz-opacity:1;
  opacity:1;
}	
#topVisual.about .catch {
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
	font-size: 3.2rem;
	margin-top: 6%;
}
#topVisual.about .catch sup {
	font-size: 3.0rem;
	top: -0.2em;
}
#topVisual.about .catch strong {
	margin: auto -0.5em;
}
#topVisual.about .expo {
	filter: alpha(opacity=0);
  -moz-opacity:0;
  opacity:0;
	margin-top: 4%;
	line-height: 2.5;
}

/* #about
-------------------------------------------------- */
#about {
	padding-bottom: 160px;
}
#about.warp {
	width: 850px;
}
#about article {
	width: 720px;
	margin: 0 auto;
	letter-spacing: normal;
}
#about .title {
	font-size: 3.1rem;
	line-height: 1.3;
}
#about .title img {
	padding-right: 1em;
}
#about .copy {
	font-size: 2.6rem;
	margin-bottom: 72px;
}
#about article p {
	margin-bottom: 30px;
}
#about article p:last-child {
	margin-bottom: 0;
}

/* #profile
-------------------------------------------------- */
#profile {
	padding: 0 0 200px;
	background-color: rgba(201, 188, 156, 0.2);
}
#profile.warp {
	width: 850px;
}
#profile #main {
	width: 100%;
	height: 500px;
	margin-bottom: 80px;
	background-image: url(../../about/images/about_profile.jpg);
	background-position:center center;
	background-size:cover;
	text-align: center;
}
#profile article {
	width: 720px;
	margin: 0 auto;
	letter-spacing: normal;
}
#profile .title {
	font-size: 3.1rem;
	line-height: 1.3;
}
#profile .title img {
	padding-right: 1em;
}
#profile .copy {
	font-size: 2.6rem;
	margin-bottom: 72px;
}
#profile article p {
	margin-bottom: 30px;
}
#profile article p:last-child {
	margin-bottom: 0;
}



@media screen and (min-width: 741px) {
	body {
		min-width: 980px;
		margin: auto;
	}
	header .warp {
		width: 950px;
		min-width: 950px;
		max-width: 950px;
	}	
	
}
