@charset "utf-8";
/* ===================================================================
 style info : ヘッダーやフッターなどサイト内共通
=================================================================== */

.pc_parts{
	display: none;
}

.sp_parts,
.navi-logo{
	display: block;
}

/* ===================================================================
 header and navigation
=================================================================== */

#panel-btn{
	display: inline-block;
	position: absolute;
	width: 20px;
	height: 20px;
	right: 18px;
	top: 18px;
	z-index: 999
}

header.open #panel-btn{
	position: fixed;
}

#panel-btn-icon{
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 20px;
  height: 2px;
  margin: -1px 0 0 0;
  background: #000;
  transition: .2s;
}

#panel-btn-icon:before,
#panel-btn-icon:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 20px;
  height: 2px;
  background: #000;
  transition: .3s;
}

#panel-btn-icon:before{
  margin-top: -6px;
}

#panel-btn-icon:after{
  margin-top: 4px;
}

#panel-btn .close{
  background: transparent;
}

.close#panel-btn-icon:before,
.close#panel-btn-icon:after{
	background: #fff
}

#panel-btn .close:before,
#panel-btn .close:after{
  margin-top: 0;
}

#panel-btn .close:before{
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

#panel-btn .close:after{
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

header{
	transition: .2s;
	position: fixed;
}

.inner,
.box{
	width: 100%;
}

header,
.navi-logo{
	height: 55px;
}

#g-navi{
	height: 55px;
}

#g-navi h1{
	position: relative;
	width: 98px;
	margin: 16px auto 0;
	left: auto;
}

#g-navi h1 img,
.navi-logo img{
	width: 98px;
}

#g-navi ul{
	overflow: hidden;
	display: none;
	padding: 0 0 20px;
	background: #000
}

#g-navi ul#navi{
	float: none;
	text-align: center;
	font-weight: 900;
	position: fixed;
	width: 100%;
	top: 0
}

#g-navi ul li{
	float: none;
}

#g-navi ul#navi li.navi-logo{
	padding: 16px 0 0
}

#g-navi ul#navi li{
	margin-right: 0;
	font-size: 12px;
	padding: 0 10px;
	line-height: 1;
}

#g-navi ul#navi li a{
	color: #fff;
	display: block;
	height: 40px;
	line-height: 40px;
}

#g-navi ul#navi li.navi-logo a{
	display: inline-block;
	height: auto;
	line-height: 1
}

/* ===================================================================
 btn base
=================================================================== */

.ghost-btn{
	width: 150px;
	height: 30px;
	line-height: 26px;
	font-size: 10px;
}

/* ===================================================================
 seconde parallax & contents
=================================================================== */

.seconde #slide,
.third #slide{
	height: 135px;
	top: 55px;
	background-size: cover !important;
}

.seconde #contents,
.third #contents{
	margin-top: 190px;
	padding-top: 68px;
	padding-bottom: 60px
}

.seconde #contents:before,
.third #contents:before {
	width: 15px;
	height: 8px;
    margin-left: -8px;
    margin-top: -76px;
}

.seconde #contents h1,
.third #contents h1,
.seconde #contents h2,
.third #contents h2,
.seconde #contents h3,
.third #contents h3,
.seconde #contents h4,
.third #contents h4 {
	text-align: center;
	font-weight: 900
}

.seconde #contents h1,
.third #contents h1{
	font-size: 24px;
	margin-bottom: 50px
}

/* ===================================================================
 Blead crumb
=================================================================== */

#bc{
	width: 90%;
	left: 0;
	margin: 0 5%;
	top: 16px;
	font-size: 8px
}

#bc li{
	color: #000;
	line-height: 14px;
}

#bc li a{
	color: #000;
}

/* ===================================================================
 Table style
=================================================================== */

#contents table{
	border: 1px solid #E6E6E6;
	width: 96%;
	margin: 0 auto
}

#contents table tr{
	border-bottom: 1px solid #E6E6E6;
}

#contents table th{
	background: #f7f7f7;
	width: 60px
}

#contents table th,
#contents table td{
	padding: 4px 10px;
	text-align: left;
	line-height: 20px;
	font-size: 12px
}

/* ===================================================================
 List UI
=================================================================== */

.scroll-box{
	overflow-y:auto;
	-webkit-overflow-scrolling: touch;
	margin-bottom: 30px;
	margin-top: -20px;
	height: 36px;
}

#menu-list{
	margin-bottom: 0px;
	width: 870px;
	letter-spacing: -0.4px;
	padding: 0 20px
}

#menu-list li a,
#menu-list li span{
	padding: 0 10px;
}

/* ===================================================================
 map
=================================================================== */

#map{
	margin-bottom: 60px;
}

#map #map-canvas{
	width: 100%;
	height: 240px
}

#map a{
	font-size: 10px;
}

/* ===================================================================
 footer and navigation
=================================================================== */

footer {
	padding-top: 44px;
	padding-bottom: 0;
}

footer h1{
	margin-bottom: 26px
}

footer h1 a img{
	width: 129px;
}

footer li a span{
	font-size: 80%
}

footer #footnavi a{
	display: block;
}

footer #footnavi{
	border-bottom: 1px solid #ddd;
}

footer #footnavi li{
	border-top: 1px solid #ddd;
	margin: 0;
	width: 50%;
	box-sizing:border-box;
	padding: 10px 0;
	font-size: 12px
}

footer #footnavi li:nth-child(odd){
	border-right: 1px solid #ddd;
}

footer #footnavi li.sp_parts{
	display: inline-block;
}

footer .inner{
	height: auto;
	padding-top: 0;
	padding-bottom: 100px;
	position: relative;
	line-height: 14px;
	margin-top: 24px;
}

footer .inner div{
	float: none;
	width: 100%;
}

#copyright{
	text-align: center;
	position: absolute;
	bottom: 0;
	padding: 0;
	line-height: 30px;
	background: #F6F6F6;
}

footer #footlink{
	border: none;
	position: absolute;
	width: 100%;
	bottom: 44px;
	padding-top: 14px;
	border-top: 1px solid #ddd;
}

footer #footlink li{
	font-size: 10px;
}


footer ul.sns{
	margin-top: 0;
	width: 100%
}

footer ul.sns #follow,
footer ul.sns li{
	line-height: 20px;
	margin: 0 10px;
}

footer ul.sns #follow{
	width: 100%;
	clear: both;
	margin: 0 0 14px;
	text-align: center;
}