@charset "utf-8";
/* ------------------------------------------------------------ common */
body { color: #000; font-size: 16px; font-family: "游ゴシック体", "Yu Gothic", "YuGothic", "Meiryo","メイリオ","Osaka","ＭＳ Ｐゴシック","MS P Gothic","Arial",sans-serif;}
a:link 		{ color: #000; text-decoration: none; }
a:visited 	{ color: #000; text-decoration: none; }
a:hover,
a:hover img,
input[type="submit"]:hover { color: #111; text-decoration: none; 
	filter:alpha(opacity=80);
    -moz-opacity: 1;
    opacity: 1; }
    
input[type="text"],
select,
textaera	{ border: 1px solid #b5b5b5; }

input[type="submit"] { -webkit-appearance: button; cursor: pointer; padding: 0; border: none; }

.inner 	{ width: 1000px; margin: 0 auto; }
.btn 	{ text-align: center; }
.btn a 	{ display: inline-block; *display: inline; *zoom: 1; color: #fff; font-size: 18px;
	border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; }
	
.SP { display: none;}

#pager 				{ text-align: center; padding: 50px 0 0; font-size: 14px; }
#pager ul span,
#pager ul .number a { display: inline-block; *display: inline; *zoom: 1; width: 40px; padding: 0; margin: 0 2px; line-height: 40px; }
#pager ul span 		{ background: #000; color: #fff; }
#pager ul .number a { background: #fff; color: #000; border: 1px solid #000; }

/* ------------------------------------------------------------ add */

p#pan{
	font-size: 14px;
}

p#pan a{
	color:#000;
	text-decoration: none;
}

p#pan a:hover{
	color:#000;
	text-decoration: underline;
}

#upper-btn{
	margin-top: 135px;
	margin-bottom: 30px;
}

#upper-btn a{
	display: block;
	font-size: 20px;
	line-height: 20px;
	color:#fff;
	text-align: center;
	padding: 15px 0px;
	background-color: #414141;
}

#upper-btn a:hover{
}

ul#icon{
	text-align: center;
	padding-bottom: 30px;
}

ul#icon li{
	margin: 0px 12px;
	display: inline-block;
}

p#ft-nav{
	text-align: center;
	font-size: 16px;
	padding-bottom: 20px;
}

p#ft-nav a{
	color:#000;
	text-decoration: none;
}

#ft-logo{
	text-align: center;
}

address{
	text-align: center;
	font-size: 10px;
	font-style: inherit;
	padding: 15px 0px 20px;
	letter-spacing: 0.1em;
}

#inner-wrapper{
	width: 1000px;
	margin: 0 auto;
	padding: 30px 0 0;
	overflow: hidden;
}

.ttl{
	text-align: center;
	padding-bottom: 20px;
	width: 600px;
	margin: 0px auto;
	padding-top: 35px;
}

.ttl img,
.top-wrapper #headline img,
.loc img,
#top-img1 #headline img,
#headlines img,
#headline-si img{
	margin: 0px;
	padding: 0px;
	vertical-align: bottom;
}

.ttl p,
.top-wrapper h2 p,
h2.loc p{
	border-top: 1px solid #000;
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
	letter-spacing: 0.2em;
	padding-top: 20px;
}

#headline-si p{
	border-top: 1px solid #fff;
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
	letter-spacing: 0.2em;
	padding-top: 20px;
	overflow-y: hidden;
}

.ttl p,
.top-wrapper #headline p,
.loc p,
#headlines p{
	border-top: 1px solid #000;
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
	letter-spacing: 0.2em;
	padding-top: 20px;
	overflow: hidden;
}

h2.ttl-sub{
	padding-bottom: 0px;
}

h2.ttl-sub p{
	padding-top: 10px;
}

ul#navigation li span{
	display: block;
	font-size: 12px;
	color:#fff;
	text-decoration: none;
	text-align: center;
}

/* :::::: toggle button (right):::::: */
 
#navTgl {
  display: none;
}
#bread { padding: 16px 0;}
#bread ol li { list-style-type: none; display: inline-block; *display: inline; *zoom: 1; padding: 0 0 0 5px;}
#bread ol li:first-child { padding: 0;}
#bread ol li a { background: url(../image/article/bread.gif) right center no-repeat; padding: 0 20px 0 0;}

label.open,
label.close {
  cursor: pointer;
  position: fixed;
  top: 25px;
  right: 25px;
}
 
.open {
  background-image: url(../image/common/menu.png);
  z-index: 10;
  width: 31px;
  height: 31px;
  background-repeat: no-repeat;
  color: black;
  font-size: 3em;
  text-align: center;
  -webkit-transition: background-color .6s, -webkit-transform .6s;
  transition: background-color .6s, transform .6s;
}
 
#navTgl:checked + .open {
  -webkit-transform: translateX(-250px);
  transform: translateX(-250px);
    background-image: url(../image/common/peke.png);
  z-index: 12;
  width: 31px;
  height: 31px;
}
 
.close {
  pointer-events: none;
  z-index: 11;
  width: 100%;
  height: 100%;
  transition: background-color .6s;
}
 
#navTgl:checked ~ .close {
  pointer-events: auto;
  /*background-color: rgba(0,0,0,.3);*/
  height: 31px;
}
 
/* :::::: drawer menu :::::: */
 
.menu {
  z-index: 10;
  position: fixed;
  top: 0;
  right: 0;
  width: 250px;
  height: 100%;
  background-color: #fff;
  display: none;
}

.menu h1{
	padding: 15px;
	font-size: 14px;
	text-align: left;
	line-height: 1.6em;
}
 
.menu p,
.menu li a {
}
 
.menu ul.menu-nav {
  padding: 0;
  list-style-type:none;
  border-top: 1px solid #babcbd;
  margin-bottom: 25px;
  overflow: hidden;
}

.menu .menu-nav li {
	
	box-sizing: border-box;
}

.menu .menu-nav li span{
	display: block;
	text-align: center;
	font-size: 14px;
	padding-top: 5px;
	padding-bottom: 15px;
}
.menu .menu-nav li:nth-child(odd){
	float: left;
	width: 124px;
	border-bottom: 1px solid #babcbd;
	border-right: 1px solid #babcbd;
}

.menu .menu-nav li:nth-child(even){
	float: right;
	width: 124px;
	border-bottom: 1px solid #babcbd;
}

.menu .menu-nav li img{
	width: 100%;
	margin: 0px;
	padding-top: 7px;
	padding-bottom: 3px;
	vertical-align: bottom;
}

.menu .close_wrap {
	position: absolute;
	top: 10px;
	left: -40px;
}

.menu .close_wrap img {
	cursor: pointer;
}

#globalheader{
	background: rgba(0,0,0,0.5);
	padding: 15px 25px;
	position: fixed;
	width: 100%;
	box-sizing: border-box;
	z-index: 5;
	overflow: hidden;
}

#globalheader #logo{
	float: left;
	margin-top: 3px;
}

#globalheader ul{
	float: right;
	padding-right: 245px;
	overflow: hidden;
}

#globalheader ul li{
	float: left;
	margin-left: 20px;
}

@media
only screen and (max-width : 767px){

p#pan{
	display: none;
}

#inner-wrapper,
#inner-wrappers{
	width: 94%;
	padding-left: 3%;
	padding-right: 3%;
}

p#ft-nav{
	font-size: 10px;
}

.ttl{
	width: 100%;
}

.ttl img{
	width: 100%;
}

img{
	height: auto;
}

.ttl p, .top-wrapper #headline p, .loc p, #headlines p{
	font-size: 14px;
	padding-top: 10px;
}

#outer{
	height: 55px;
}

}

@media (max-width: 1200px) and (min-width: 768px) {

#inner-wrapper{
	padding-left: 3%;
	padding-right: 3%;
	width: 94%;
}

}

@media (max-width: 1200px) and (min-width: 850px) {

#globalheader{
	padding: 15px 10px;
}

#globalheader ul li{
	width: 18%;
	margin-left: 2%;
	text-align: center;
}

#globalheader ul{
	width: 75%;
	padding-right: 30px;
}

#globalheader ul li img{
	width: auto;
	height: auto;
}

}


@media (max-width: 850px) and (min-width: 768px) {

#globalheader{
	padding: 15px 10px;
}

#globalheader ul li{
	width: 22%;
	margin-left: 2%;
	text-align: center;
	display: none;
}

#globalheader ul{
	width: 75%;
	padding-right: 30px;
	display: none;
}

#globalheader ul li img{
	width: auto;
	height: auto;
}



}

@media
only screen and (max-width : 767px){

#globalheader ul{
	display: none;
}

#globalheader{
	padding: 0px 3%;
	height: 55px;
	background: #000; 
}

#globalheader #logo{
	width: 110px;
	margin-top: 10px;
}

#globalheader #logo img{
	width: 100%;
}

label.open, label.close{
	top: 12px;
	right: 15px;
}

#inner-wrapper{
}

#upper-btn{
	margin-top: 75px;
}

.menu{
	width: 180px;
}

.menu .menu-nav li:nth-child(2n+1){
	width: 90px;
}

.menu .menu-nav li:nth-child(2n){
	width: 89px;
}

ul#icon li img{
	width: 100%;
}

ul#icon li{
	width: 10%;
	margin: 0px 3%;
}

#navTgl:checked + .open{
	transform: translateX(-180px);
}

.menu .menu-nav li span{
	font-size: 12px;
}

.menu h1{
	font-size: 13px;
}

input{ font-size:16px; }



}

/* ------------------------------------------------------------ header */

#fv #header h1 { float: left; padding: 0 20px 0 19px; }
#fv #header h1 a { line-height: 100%; }
#fv #header ul { float: left; }
#fv #header ul li { float: left; }
#fv #header ul.nav li { width: 155px; box-sizing: border-box; border-right: 1px solid #fff; }
#fv #header ul.nav li:first-chiuld { border-left: 1px solid #fff; }
#fv #header ul.nav img { padding: 10px 0; }
#fv #header { width: 1000px; margin: 0 auto; }
#fv #header p { float: left; padding: 0 20px; }
#fv #header ul.sns { float: right; }
#fv #header ul.sns li { padding: 0 0 0 13px; }
#fv #header ul.sns li:first-child { padding: 0; }

#menu-btn { position: absolute; top: 15px; right: 3%; display: block; z-index: 999; float: right; }
#menu-btn img { width: 31px; height: auto; display: inline !important; cursor: pointer; }


/* ------------------------------------------------------------ footer */
#page_top img { width: 100%; height: auto; }

#footer { text-align: center; padding: 35px 0 20px; }
#footer ul { width: 168px; margin: 0 auto; }
#footer li { float: left; padding: 0 0 0 29px; }
#footer li:first-child { padding: 0; }
#footer p { padding: 40px 0 0; }

/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){

body { color: #000; font-size: 14px; min-width: inherit; position: relative; }
a:link 		{ color: #000; text-decoration: none; }
a:visited 	{ color: #000; text-decoration: none; }
a:hover,
a:hover img,
input[type="submit"]:hover { color: #111; text-decoration: none; 
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8; }
    
input[type="text"],
select,
textaera	{ border: 1px solid #b5b5b5; }

input[type="submit"] { -webkit-appearance: button; cursor: pointer; padding: 0; border: none; }

.inner 	{ width: 94%; margin: 0 auto; }
.btn 	{ text-align: center; }
.btn a 	{ display: inline-block; *display: inline; *zoom: 1; color: #fff; font-size: 14px;
	border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; }

.PC { display: none;}	
.SP { display: block;}

/* ------------------------------------------------------------ header */

#fv { background: none; padding: 0; }
#fv #header { background: #000; width: 100%; padding: 20px 0; position: fixed; left: 0; top: 0; }
#fv #header h1 { float: none; padding: 0; text-align: center; }
#fv #header h1 a { display: block; }
#fv #header h1 img { width: auto; height: 30px; margin: 0 auto;}
#fv #header ul.sns { float: none; position: absolute; top: 20px; right: 10px; }
#fv #header ul.sns li { padding: 0 0 0 5px; }
#fv #header ul.sns li:first-child { padding: 0; }
#fv h2 img { width: 100%; height: auto; }

/* ------------------------------------------------------------ footer */
#footer ul { width: 140px; margin: 0 auto; }
#footer li img { height: 25px; width: auto; }
#footer p img { height: 50px; width: auto; }

/* ------------------------------------------------------------ menu */
#pager 		{ padding: 0; text-align: center;}

#menu-btn { position: absolute; top: 15px; right: 3%; display: block; z-index: 999; float: right; }
#menu-btn img { width: 30px; height: auto; display: inline !important; }

#open_modal					{ cursor: pointer; display: block;}

.fixed 						{ position: fixed; }
#mask 						{ display: none; height: 100%; width: 100%; height: 100%; min-height: 100%; background: #fff; position: fixed; opacity: 0.7; filter: alpha(opacity=70); -moz-opacity:0.70; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; }

/* #open_modal 				{ cursor: pointer; right: 10px; top: 10px; z-index: 999; position: fixed; } */
#navigation 				{ text-align: center; margin: 0 auto; top: 0; right: 0; left: 0; margin: 0; z-index: 9999; position: absolute; display: none; background: #fff; }
#menu-header				{ padding: 30px 0; background: #fff; position: relative; }
#navigation #menu-header a img { width: 180px; height: auto; padding: 0 0 5px; }
#navigation #menu-header a img.toshin { width: 80px; height: auto; padding: 0 0 0 10px; vertical-align: top;}
#navigation #menu-header a { color: #fff; text-align: center; }
#navigation #menu-header img.close_modal { position: absolute; top: 20px; right: 6%; cursor: pointer; }
#navigation ul#main-menu 			{ font-size: 14px; z-index: 999; width: 100%; background: #919299;}
#navigation ul#main-menu li 	{ width: 100%; font-size: 16px; color: #fff; border-bottom: 1px solid #fff; text-align: left; }
#navigation ul#main-menu li a 	{ color: #fff; text-align: left; padding: 20px 3%; display: inline-block; *display: inline; *zoom: 1; width: 94%; line-height: 100%; }
#navigation ul#main-menu li ul { display: none; }
#navigation ul#main-menu li ul li a { display: block; width: 100%;  color: white; padding: 10px 6%; }
#navigation p#close 		{ background: #2d2d2d; color: #fff; padding: 15px 0; }
#header-close 				{ position: absolute; top:20px; right: 10px;}
 
}

/*
@media only screen and (orientation : portrait) { 
	#navigation 			{ position: absolute; top:0; margin: 0 0 0; right: 0; left: 0; }
}
*/




}