@charset "utf-8";

/* =======================================================
	base.css
	*This document validates as CSS level 3
	
	Author: Mamico Tosa
	Last modified: [ 2013/06/18 ]	
	CSS構成: 基本骨格・共有パーツ（ヘッダー・フッター）	
	
	-----------------------------------------------------
	■基本骨格
	header			 950px
	container		 950px
	footer	
======================================================= */

/***************************************
TOC:
 *   01 : header
 *   02 : nav
 *   03 : container,main
 *   04 : footer
***************************************/


#header div,
#g-nav,
#container,
#footer div,
#footer + div {
	width : 950px ;
	margin : 0 auto ;
}


/* for responsive */
@media screen and (min-width: 768px) {
	.sp-only {display: none !important;}
}
@media screen and (max-width: 767px) {
	.pc-only {display: none !important;}
}




/*  01 : header
---------------------------------------------------------------------- */
#header  { border-top : solid 5px #cc0000 ; }
#header div {
	padding : 15px 0 ;
	overflow : hidden ;
}
#header hgroup {
	float : left ;
	width : 650px ;
}
#header h1 {
	float : left ;
	margin : 0 0 0 6px ;
}
#header h2 {
	font-weight : normal ;
	font-size : 12px ;	font-size : 1.2rem ;
	margin-top : 0.6em ;
}


/*  02 : nav
---------------------------------------------------------------------- */
#g-nav {
	overflow : hidden ;
	background : url(../img/nav-bg.png) no-repeat ;
	margin-bottom : 30px ;
}
#g-nav li { float : left ; }
#g-nav a:hover img { opacity : 0 ; }



/*  03 : container,main
---------------------------------------------------------------------- */
/* h1 */
h1#page-title { margin-bottom : 30px ; }

/* inquiry-box */
#inquiry-box {
	margin : 40px 0 0 ;
	position : relative ;
	clear: both;
}
#inquiry-box address,
#inquiry-box a {
	position : absolute ;
	top : 58px ;
}
#inquiry-box address {
	font-style : normal ;
	left : 20px ;
}
#inquiry-box a { right : 20px ; }

/* 流れボタン */
#flow-bt {
	background : #e9e9e9 ;
	padding : 10px 0 ;
	text-align : center ;
}


/* caption */
.caption {
	font-size : 12px ;	font-size : 1.2rem ;
	margin : 50px 0 20px ;
}




/*  04 : footer
---------------------------------------------------------------------- */
footer {
	overflow : hidden ;
	padding-bottom : 5px ;
	font-size : 12px ;	font-size : 1.2rem ;
}
#footer {
	border-bottom : solid 5px #cc0000 ;
	margin-bottom : 15px ;
}
#footer li {
	display : inline-block ;
	/display : inline ;
	/zoom : 1 ;
	line-height : 1 ;
	padding : 0 4px ;
	border-right : solid 1px #999999 ;
}
#footer li:last-child { border : none ; }
#footer a { text-decoration : none ; }
#footer p { text-align : right ; }

#footer + div p { float : left ; }
footer small { float : right ; }





/*  smartphone
---------------------------------------------------------------------- */
@media screen and (max-width: 768px) {

#header div,
#g-nav,
#container,
#footer div,
#footer + div {width: auto;}


#header {border-top-width: 3px;background: #fff;position: fixed;left: 0;top: 0;z-index: 999;width: 100%;}
#header:after {display: block;content: "";clear: both;}
#header div {padding-top: 5px;padding-bottom: 5px;}
#header h2 {font-size: 1.1rem;margin-top:0.3em;}
#header hgroup {float: left;width: calc(100% - 60px);margin-bottom: 8px;padding-top: 5px;}
#header div.btn {float: right;width: 50px;padding:22px 10px;-webkit-box-sizing: border-box;box-sizing: border-box;position: relative;}
#header div.btn span { display: inline-block; *display: inline; *zoom: 1; position: relative; width: 24px; height: 2px; background: #cc0000; position: absolute; top: 50%; left: 50%; margin-top: -8px; margin-left: -12px; -webkit-transition: 0.3s ease all; transition: 0.3s ease all; }
#header div.btn span:before,
#header div.btn span:after { display: block; content: ""; background: #cc0000; position: absolute; height: 2px; left: 0; -webkit-transition: 0.3s ease all; transition: 0.3s ease all; width: 100%; }
#header div.btn span:before { top: 7px; }
#header div.btn span:after { top: 14px; }
#header div.btn.is-open span { background: transparent; }
#header div.btn.is-open span:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 7px; }
#header div.btn.is-open span:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); top: 7px; }
#header a.bnr {display: block;text-align: center;clear: both;position: fixed;z-index: 999;left: 0;bottom: 0;width: 100%;padding: 10px 8px 7px;padding-top:;-webkit-box-sizing: border-box;box-sizing: border-box;background: #efefef;}

#g-nav {background: #fff;display: none;margin-bottom: 0;position: fixed;width: 100%;left: 0;top: 61px;z-index: 998;}
#g-nav li {float: none;text-align: center;}
#g-nav li a {display: block;padding: 12px 10px;text-decoration: none;border-bottom: 1px solid #cc0000;color: #cc0000;}
#g-nav li:first-child a {border-top: 1px solid #cc0000;}
#g-nav li a.-on {background: #cc0000;color: #fff;}

#container {padding-top: 61px;}

#footer {padding-left: 15px;padding-right: 15px;}
footer {padding-bottom: 60px;}

#inquiry-box {margin-top: 30px;padding-left: 10px;padding-right: 10px;}
#inquiry-box address,
#inquiry-box a {position: static;}
#inquiry-box h1 {margin-bottom: 10px;}

#flow-bt {padding-left: 10px;padding-right: 10px;}
.caption {margin-left: 10px;padding-right: 10px;}


}