﻿@charset "utf-8";

/* =======================================

	CommonElements

======================================= */
html
{
	height:100% !important;
	overflow-x:hidden;
}
body {
	height:100% !important;
	line-height: 160%;
	font-family: 'Comfortaa', cursive,"メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	text-align: center;
	font-size:16px;
}

a:link {
	text-decoration:none;
	color:#005697;}
a:visited {
	text-decoration:none;
	color:#005697;}
a:active {
	text-decoration:none;
	color:#005697;}
a:hover {
	text-decoration:none;
	color:#005697;}



#gnav
{
	position:fixed;
	top:50%;
	margin-top:-5%;
	right:10px;
	z-index:100;
}
#gnav li
{
	margin-bottom:10px;
}
#gnav a
{
	background-image:url(../img/nav.png);
	background-position:0 0;
	background-repeat:no-repeat;
	background-size:cover;
	
	width:12px;
	height:12px;
	text-indent:-9999px;
	display:block;
}
#gnav a:hover,
#gnav a.current
{
	background-image:url(../img/nav_on.png);
}

@media screen and (max-width : 580px){
#gnav
{
	display:none;
}
#outline div dd
{
	font-size:95%;
}

.pcTel {
	display:none;
}

#company .read {
font-size:130%!important;
text-align:center!important;
}

}

#mainVis {
/*background:linear-gradient( to top, rgba(231,236,240,0), rgba(231,236,240,0.8), rgba(231,236,240,1) ),url(../img/main_smt.jpg) no-repeat center bottom;*/
background-size:cover;
background-image:url(../img/main_smt.jpg);
background-repeat:no-repeat;
background-position:center bottom;
}

#head
{
	padding:10px 0 0;
}
#head .Inner
{
	display:block;
	position:relative;
}
#head .Inner h1 {
	background:url(../img/logo.png) no-repeat 0 0;
	background-size:contain;
	width:180px;
	height:45px;
	text-indent:-9999px;
	padding-bottom:10px;
	margin-left:10px;
}

#head .spNav
{
	position:absolute;
	right:10px;
	top:5px;
	font-size:40px;
	display:block;
}
#head .Inner ul#menu
{
	display:none;
	border-top:1px solid #999;
	z-index:50;
	position:relative;
}
#head .Inner ul#menu li
{
	border-bottom:1px solid #999;
	padding:10px;
}
#head .Inner ul#menu li a
{
	display:block;
}
#head .Inner ul li:last-child
{
	border-bottom:0;
}

#mainBox
{
	color:#005697;
	width:90%;
	max-width:1024px;
	margin:50px auto 90px;
	padding-bottom:100px;
}

#mainBox h2
{	
	font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","HG明朝G","ＭＳ Ｐ明朝", "MS PMincho",  serif;
	font-size:240%;
	margin-bottom:20px;
}

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


#mainVis {
background:url(../img/main.jpg) no-repeat center bottom;
background-size:cover;
}

#mainBox
{
	text-align:left;
	margin:90px auto 0;

}
	
#mainBox p
{
	width:45%!important;
	margin-left:0px!important;
	margin-right:0px!important;
}
}


@media screen and (min-width : 770px){
#head .spNav
{
	display:none;
}
#head .Inner
{
	width:100%;
	max-width:1024px;
	height:52px;
	margin:0 auto;
}
#head .Inner h1 {
	position:absolute;
	left:0;
}
#head .Inner ul#menu
{
	position:absolute;
	right:0;
	top:10px;
	display:table !important;
	width:35%;
	padding-left:5px;
	border-spacing:0 5px;
	text-align:right;
	border:0;
	background:rgba(255,255,255,0.6);
	border-radius:5px;
}

#head .Inner ul#menu li
{
	display:table-cell;
	padding:0;
	border:0;
	font-size:90%;
	text-align:center;
}
	
}

@media screen and (min-width : 736px){	
.fullScreen
{
	height: 100% !important;
	width:100%;
}
.smtBr,
.smtTel {
	display:none;
}
}


#service
{
	width:90%;
	max-width:1200px;
	margin:100px auto;
	text-align:center;
}
#service dl
{
	margin-bottom: 50px;
}
#service dl i
{
	display:block;
	font-size:120px;
	color:#999999;
	margin-bottom:10px;
}
#service dl dt
{
	text-align:center;
	color:#F9BD00;
	font-size:170%;
	margin-bottom:10px;
}

#service dl dd
{
	text-align:left;
}
@media screen and (min-width : 730px){	

#service dl i
{
	margin-bottom:30px;
}
#service dl dt
{
	margin-bottom:30px;
}
#service dl
{
	width: 25%;
	display: inline-block;
	margin: 20px;
	vertical-align:top;
}
}


#works
{
	background:#005697;
	padding:100px 0;
	color:#fff;
}
#works h2
{
	font-size:250%;
	margin-bottom:20px;
}
#works p
{
	font-size:100%;
	margin-bottom:20px;
}
#works .fa-angle-double-down
{
	color:#fff;
	font-size:30px;
	display:block;
	margin-bottom:40px;
}

#works a
{
	border:solid 1px #ccc;
	border-radius:10px;
	color:#fff;
	padding:15px 40px;
}

#works a i
{
	color:#fff;
	font-size:20px;
	margin-right:10px;
}

#works a:hover
{
	background:#0578A2;

-webkit-transition: background 0.3s ease-out;
-moz-transition: background 0.3s ease-out;
-ms-transition: background 0.3s ease-out;
transition: background 0.3s ease-out;
}



#company
{
	width:90%;
	max-width:1024px;
	margin:100px auto;
	text-align:center;
}

#company h2
{
	font-size:120%;
	margin-bottom:50px;
}
#company h2 .fa-building-o
{
	display:block;
	font-size:120px;
	color:#999999;
	margin-bottom:10px;
}

#company .read
{
	font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","HG明朝G","ＭＳ Ｐ明朝", "MS PMincho",  serif;
	font-size:200%;
	margin-bottom:20px;
	line-height:180%;
	text-align:left;
	display:inline-block;
}

@media screen and (min-width : 850px){
#company h2
{
	display:inline-block;
	margin-right:50px;
}

#company .read
{
	display:inline-block;
  vertical-align: text-bottom;
}
}


#outline
{
	background:url(../img/outline_back.jpg) repeat;
	padding:80px 0 0;
}
#outline div.table
{
	width:90%;
	max-width:1024px;
	margin:0 auto;
}
#outline div dl
{
	text-align:left;
	border-bottom:dotted 1px #B5D7E8;
	width:100%;
	margin-bottom:15px;
	padding-bottom:15px;
}
#outline div dt
{
	font-weight:bold;
}

#outline div dl a.map
{
	/* font-size:85%; */
	margin-left:0px;
}

.fa-compass
{
	font-size:12px;
	color:#005697;
	margin-right:5px;
	
}
#map_custmomize
{
	width:100%;
	height:250px;
	margin-top:80px;
}


@media screen and (min-width : 580px){
#outline div dl
{
	display:table;
}
#outline div dt
{
	display:table-cell;
	width:100px;
	padding-left:60px;
	font-weight:normal;
}
#outline div dd
{
	display:table-cell;
	padding-left:30px;
}

#outline div dl a.map
{
	/*font-size:85%;*/
	margin-left:10px;
}
#mainBox p
{
	width:430px;
	margin-left:auto;
	margin-right:auto;
}


}

@media screen and (min-width : 736px){
#map_custmomize
{
	height:450px;
}
}

#contact
{
	background:url(../img/contact_back.jpg) no-repeat center 0;
	background-size:cover;
	padding-top:80px;
	padding-bottom:80px;
	font-size:90%;
}
#contact h2
{
	font-size:250%;
	margin-bottom:40px;
	color:#fff;
}

#contact p.catContact
{
	font-size:110%;
	margin-bottom:20px;
	color:#fff;
}
#contact p.catContact a
{
	color:#FC0;
}
#contact p.catContact a:hover
{
	color:#ff0;
}

#contact .Inner
{
	background:rgba(255,255,255,0.89);
	padding:50px 0;
	border-radius:20px;
	box-sizing:border-box;
	max-width:960px;
	width:90%;
	margin:0 auto;
}

#contact .Inner input[type="text"],
#contact .Inner textarea
{
	width:100%;
	box-sizing:border-box;
	resize: vertical;
}
#contact dl
{
	text-align:left;
	margin:0 auto;
	width:90%;
}

#contact dl dt span
{
	color:#F7B45C;
	font-size:80%;
	margin-left:10px;
}
#contact .Inner dl label small
{
	font-size:80%;
}
#contact .Inner dl label input,
#contact .Inner dl label small
{
	display	:inline-block;
	vertical-align:top;
}
#contact .Inner input[type="submit"]
{
  -webkit-appearance: none;
	background:#FFC95C;
	border:0;
	border-radius:20px;
	width:70%;
	max-width:300px;
	box-sizing:border-box;
	margin:20px auto 0;
	padding:10px 0;
	color:#fff;
	font-size:140%;
	cursor:pointer;
}
#contact .Inner input[type="submit"]:hover
{
	background:#FFB43A;
	-webkit-transition: background 0.3s ease-out;
-moz-transition: background 0.3s ease-out;
-ms-transition: background 0.3s ease-out;
transition: background 0.3s ease-out;
}
#contact dl dd
{
	padding-bottom:15px;
}
#contact .tel
{
	background:rgba(255,255,255,0.4);
	padding:20px 0;
	border-radius:20px;
	box-sizing:border-box;
	max-width:960px;
	width:90%;
	margin:30px auto;
	color:#fff;
	font-size:200%;
}
#contact .tel i
{
	margin-right:15px;
}

#contact .tel a
{
	color:#fff !important;
}
@media screen and (min-width : 680px){
#contact
{	
	padding-top:200px;
}
#contact .Inner dl
{
	display:table;
	width:580px;
	margin:0 auto;
	text-align:left;
}
#contact .Inner dl dt
{
	display:table-cell;
	width:200px;
	font-weight:normal;
}
#contact .Inner dl dd
{
	display:table-cell;
	border-left:solid 1px #ccc;
	padding-left:30px;
	vertical-align:top;
}
}

#footer
{
	background:#474747;
	padding:20px 0 20px;
	text-align:center;
	color:#fff;
}
#footer .fa-arrow-circle-up
{
	font-size:45px;
}
#footer a
{
	color:#fff;
	margin-bottom:20px;
	display:block;
}
#footer .copyright
{
	font-size:90%;
}

.sns
{
	text-align:center;
	display:table;
	border-spacing:10px 0;
	margin:15px auto 0;
}
.sns li
{
	display:table-cell;
	vertical-align:top;
}

.sns li.tw
{padding-top: 5px;
}


#foochan
{
	background:#FF7C66;
	margin-top:2px;
	text-align:center;
	padding:20px 0;
}
#foochan i.foochan
{
	background:url(../img/cat.png) no-repeat 0 0;
	background-size:contain;
	width:40px;
	height:40px;
	display:inline-block;
	vertical-align:baseline;
	margin-right:10px;
}
#foochan a
{
	color:#fff;
	display:inline-block;
	vertical-align:text-bottom;
	padding-bottom:5px;
}
