@charset "UTF-8";
/* CSS Document */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html,
button,
input,
select,
textarea {
  color: #222;
}

html {
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */
audio,
canvas,
img,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
ul, li {
  list-style: none;
  margin: 0;
  padding: 0;
}

p {
  margin: 0;
  padding: 0;
}

a {
  outline: none;
  overflow: hidden;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Image replacement
 */
.ir {
  background-color: transparent;
  border: 0;
  overflow: hidden;
  /* IE 6/7 fallback */
  *text-indent: -9999px;
}

.ir:before {
  content: "";
  display: block;
  width: 0;
  height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.hidden {
  display: none !important;
  visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */
.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix {
  *zoom: 1;
}
/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */
@media print {
  * {
    /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  #infoArea{
	  display:none;
	 }
}
/* ==========================================================================
   
   module
   
   ========================================================================== */
/* ---------------------------------------------
	font Style
--------------------------------------------- */
.fBold {
  font-weight: bold;
}

.fItalic {
  font-style: italic;
}

.fnormal {
  font-weight: normal;
}

.f10 {
  font-size: 10px;
}

.f12 {
  font-size: 12px;
}

.f14 {
  font-size: 14px;
}

.f16 {
  font-size: 16px;
}

.f18 {
  font-size: 18px;
}

.red {
  color: #e32e29;
}

/* ---------------------------------------------
	float
--------------------------------------------- */
.f_l {
  float: left;
}

.f_r {
  float: right;
}

/* ---------------------------------------------
	preset margin
--------------------------------------------- */
.mt05 {
  margin-top: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt12 {
  margin-top: 12px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt35 {
  margin-top: 35px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt45 {
  margin-top: 45px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mb01 {
  margin-bottom: 1px !important;
}

.mb03 {
  margin-bottom: 3px !important;
}

.mb05 {
  margin-bottom: 5px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb12 {
  margin-bottom: 12px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb45 {
  margin-bottom: 45px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.mr05 {
  margin-right: 5px !important;
}

.mr10 {
  margin-right: 10px !important;
}

.mr12 {
  margin-right: 12px !important;
}

.mr15 {
  margin-right: 15px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mr25 {
  margin-right: 25px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.mr35 {
  margin-right: 35px !important;
}

.mr40 {
  margin-right: 40px !important;
}

.mr45 {
  margin-right: 45px !important;
}

.mr50 {
  margin-right: 50px !important;
}

.ml05 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.ml12 {
  margin-left: 12px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.ml30 {
  margin-left: 30px !important;
}

.ml35 {
  margin-left: 35px !important;
}

.ml40 {
  margin-left: 40px !important;
}

.ml45 {
  margin-left: 45px !important;
}

.ml50 {
  margin-left: 50px !important;
}

.mlmr05 {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.mlmr10 {
  margin-left: 10px !important;
  margin-right: 10px !important;
}

.mlmr20 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.mcenter {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---------------------------------------------
	preset padding
--------------------------------------------- */
.pt05 {
  padding-top: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt12 {
  padding-top: 12px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pt35 {
  padding-top: 35px !important;
}

.pt40 {
  padding-top: 40px !important;
}

.pt45 {
  padding-top: 45px !important;
}

.pt50 {
  padding-top: 50px !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.pb05 {
  padding-bottom: 5px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pb12 {
  padding-bottom: 12px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.pb35 {
  padding-bottom: 35px !important;
}

.pb40 {
  padding-bottom: 40px !important;
}

.pb45 {
  padding-bottom: 45px !important;
}

.pb50 {
  padding-bottom: 50px !important;
}

.pr05 {
  padding-right: 5px !important;
}

.pr10 {
  padding-right: 10px !important;
}

.pr12 {
  padding-right: 12px !important;
}

.pr15 {
  padding-right: 15px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.pr25 {
  padding-right: 25px !important;
}

.pr30 {
  padding-right: 30px !important;
}

.pr35 {
  padding-right: 35px !important;
}

.pr40 {
  padding-right: 40px !important;
}

.pr45 {
  padding-right: 45px !important;
}

.pr50 {
  padding-right: 50px !important;
}

.pl05 {
  padding-left: 5px !important;
}

.pl10 {
  padding-left: 10px !important;
}

.pl12 {
  padding-left: 12px !important;
}

.pl15 {
  padding-left: 15px !important;
}

.pl20 {
  padding-left: 20px !important;
}

.pl25 {
  padding-left: 25px !important;
}

.pl30 {
  padding-left: 30px !important;
}

.pl35 {
  padding-left: 35px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.pl45 {
  padding-left: 45px !important;
}

.pl50 {
  padding-left: 50px !important;
}

/* ---------------------------------------------
	inline align
--------------------------------------------- */
.t_align_l {
  text-align: left !important;
}

.t_align_c {
  text-align: center !important;
}

.t_align_r {
  text-align: right !important;
}

.pre {
  white-space: pre;
}

/* ==========================================================================
   
   common
   
   ========================================================================== */
* {
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
  text-align: left;
  margin: 0;
}

body {
  margin: 0;
  padding: 0;
  font-family:Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  color: #000;
  background: #ffffff;
  line-height: 1.7;
  font-size: 14px;
  background:url(../img/bg.webp) repeat;
}

a:link, a:visited {
  color: #b6965b;
  text-decoration:underline;
}

a:hover {
  color: #b6965b;
  text-decoration: none;
}

a img {
  vertical-align: top;
}

img.bn_over:hover {
	opacity: 0.6;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
}

#wrapper {
  width: 100%;
  height: auto !important;
  min-width:1000px;
  background:url(../img/bg_side.png) repeat-y left top;
}
body > #side {
	height: auto;
}
/* ==================================================
   side
================================================== */
#side{
	float:left;
	width:200px;
	margin-right: -220px;
	border-top:10px solid #000;
	/*z-index:10000;*/
	position:relative;
	min-height:100% !important;
	height:100% !important;
	z-index:10;
	}
#side .inner{
	position:relative; 
	}
#side h1{
	margin:30px 0 0 40px;
	padding-bottom:20px;
	}
#side nav{
	margin:0 0 38px 19px;
	}
#side nav li{
	float:left;
	margin-left:8px;
	}
#side nav li:first-child{
	margin-left:0;
	}
#side .bnnerArea{
	margin-left:10px;
	}
#side .bnnerArea p{
	margin-top:10px;
	}
#side .inner .osakana{
	position:absolute;
	bottom:0;
	left:9px;
	}

#side .sNav{
	padding:0 26px 0 0;
	}
#side .sNav li{
	float:right;
	margin-left:8px;
	}
#side nav .sNav li:first-child{
	margin-left:8px;
	}
#side nav .sNav li.last{
	margin-left:0px;
	}
/* ==================================================
   contents
================================================== */
#contents{
	position:relative;
	float:left;
	width:80%;
	padding-left: 200px;
	padding-bottom:100px;
	background:url(../img/side_osakana.png) no-repeat 9px bottom;
	min-height:1100px;
	}
#contents #infoArea{
	position:fixed;
	top:30px;
	right:0;
	z-index:1000000;
	}
#contents #snsArea{
	background:url(../img/sns_bn.png) no-repeat;
	position:relative;
	height:57px;
	}
#contents #snsArea li.twt{
	position:absolute;
	top:10px;
	left:10px;
	}
#contents #snsArea li.fb{
	position:absolute;
	top:10px;
	left:46px;
	}
#contents #slider{
	position:absolute;
	top:0;
	left:0;
	}
	
#contents .inner{
	margin:-374px auto 0 auto;
	width:760px;
	text-align:left;
	z-index:100000;
	position:relative;
	}
#contents .sub_inner{
	margin:25px auto 0 auto;
	width:760px;
	text-align:left;
	position:relative;
	}
	
#contents #top.inner #news{
	margin-bottom:20px;
	}	
#contents #top.inner #news .newsTitle{
	background:url(../img/top/title01.jpg) no-repeat;
	height:34px;
	position:relative;
	}	
#contents #top.inner #news .newsTitle img{
	position:absolute;
	right:7px;
	top:3px;
	}
#contents #top.inner #news .newsList{
	background:url(../img/cont_bg_black.png) repeat;
	}

#contents #top.inner #news .newsList dl{
	overflow:hidden;
	zoom:1;
	border-bottom:1px dotted #666666;
	padding:5px 10px 5px;
	width:740px;
	color:#FFF;
	margin:0;
	}
#contents #top.inner #news .newsList dl:hover{
	cursor:pointer;
	background:url(../img/top/bg_news.png) left top;
	}
#contents #top.inner #news .newsList dl dd a{ text-decoration: none !important; color:#FFF;}
#contents #top.inner #news .newsList dl dd a:hover{ text-decoration: none !important; color:#FFF;}
#contents #top.inner #news .newsList dl dt{
	width:210px;
	float:left;
	font-size:12px;
	line-height:31px;
	}
#contents #top.inner #news .newsList dl dt img{
	margin-right:8px;
	}
#contents #top.inner #news .newsList dl dd{
	padding:4px 0 0 0;
	margin-left:210px;
	}

#contents #top.inner #topInfo{
	border:3px solid #b6965b;
	background:url(../../common/img/cont_bg_gray.gif) repeat;
	color:#000;
	}
dl.banriopen {
	width:360px;
	padding:5px 10px 6px;
	margin:0 10px;
	background:url(../img/top/banriopen_dotline.gif) bottom repeat-x;
	clear:both;
	text-align:left;
	overflow:hidden;
}
dl.banriopen dt {
	width:100px;
	float:left;
}
dl.banriopen dd {
	width:260px;
	float:right;
	margin:0;
}
 #topInfo div.map{
	float:right;
	margin:0 20px 0 0;
	}

 #topInfo div.map .wrap{
	border:2px solid #000;
	width:291px;
	height:235px;
	}



/* ==================================================
   banner
================================================== */
#banner_wrap {
	width: 180px;
	margin:0 0 40px;
	overflow:hidden;
	text-align:center;
}

#container {
width: 180px;
/*margin-bottom:20px;*/
overflow:hidden;

}
#banner {
	margin:10px 0 6px 0;
}
#banner ul {
	list-style: none;
	position: relative;
	margin-left: 0px;
	overflow: hidden;
	width:180px;
	height: 200px;
}
#banner ul li {
	float: left;
	width: 180px;
	position: absolute;
}
/*#banner ul li img.bn_over:hover {
	opacity: 0.6;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
}*/
div#pagenation {
   position: relative;
   overflow: hidden;
   top: -20px;
   /*margin-bottom:50px;*/
}

div#pagenation ul {
	position:relative;
	left:50%;
	float:left;
	list-style: none;
}
div#pagenation li {
   position:relative;
   left:-50%;
   float:left;
   margin: 0 2px;
   
}
div#pagenation li a {
	width:8px;
	height:8px;
	overflow:hidden;
	display:block;
	background-image: url(../img/button/side_bn_pagenation_d.gif);
	background-position:0 0;
}
div#pagenation li.active a,
div#pagenation li a:hover {
	background-image: url(../img/button/side_bn_pagenation_v.gif);
}
div#pagenation li a img {
	visibility:hidden;
	display: none;
}

div#banner_box p {
	text-align:center;
	margin:0 auto 10px;
	width:180px;
}
div#banner_box p img.bn_over:hover {
	opacity: 0.6;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
}


/* ==================================================
   footer
================================================== */	
footer{
	background: url(../img/footer/footer_bg.png) repeat;
	padding-top:40px;
	min-width:1000px;
	}
footer li a{
	color:#FFF !important;
	text-decoration:none !important;
	}
footer li a:hover{
	color:#FFF !important;
	text-decoration:underline !important;
	}
footer li.foTitle{
	color:#e1bf82;
	padding-bottom:4px;
	}
footer li.foTitle a{
	color:#e1bf82 !important;
	}
footer li.foTitle a:hover{
	color:#e1bf82 !important;
	text-decoration:underline;
	}
footer ul{
	border-left:1px solid #E1BF82;
	margin:0 0 20px 0;
	}
footer ul li{
	padding-left:10px;
	line-height:1.0;
	padding-top:6px;
	font-size:12px;
	}
footer ul.privacy li{
	font-size:10px;
	}
footer ul li:first-child{
	padding-top:0;
	}
footer ul li ul{
	padding-top:6px;
	border-left:none;
	}
footer ul li ul li{
	padding-left:1em;
	}
footer .fo_logo,
footer .fo_nav_list,
footer iframe{
	float:left;
	}
footer .fo_nav_list{
	float:left;
	padding-right:20px;
	}
footer .fo_logo{
	padding-left:50px;
	width:109px;
	}
footer .fo_nav_list .privacy{
	font-size:10px;
	}
footer iframe{
	background-color:#FFF;
	border:1px solid #CCC;
	}
footer p small {
	color:#FFFFFF;
	padding-left:50px;
}

/* ==================================================
   pagetop
================================================== */	
#pagetop{
 position:fixed;
 bottom:50px;
 right:50px;
 padding:0;
 /* IE6 */
 _position:absolute;
 _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-81)+'px');
}

*:first-child+html #pagetop{
 position:fixed;
 bottom:50px;
 right:50px;
 padding:0;
 /* IE6 */
 _position:absolute;
 _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-81)+'px');
}

#pagetop a{
	display:block;
	text-decoration:none;
	height:66px;
	width:71px;
	margin:0;
	}

#pagetop div{
 height:66px;
 width:71px;
 text-align:center;
 margin: 0;
 cursor:pointer;
 text-indent:-9999px;
 background: url(../img/button/pagetop_def.png) no-repeat;
}
#pagetop div:hover{
 height:66px;
 width:71px;
 text-align:center;
 margin: 0;
 cursor:pointer;
 text-indent:-9999px;
 background: url(../img/button/pagetop_ov.png) no-repeat;
}
/* ==================================================
   category title&pankuzu
================================================== */
.title{
	position:relative;
	height:49px;
	}
.title h2{
	position:absolute;
	top:0;
	left:0;
	margin:0;
	}
.title ul{
	position:absolute;
	bottom:11px;
	right:0;
	color:#b6965b;
	overflow:hidden;
	zoom:1;
	}
.title ul li{
	float:left;
	font-size:10px;
	}
.title ul li a{
	color:#b6965b;
	background: url(../img/pankuzu_bullet.png) no-repeat right center;
	padding:0 11px 0 0;
	margin-right:4px;
	text-decoration:none;
	}
.title ul li a:hover{
	color:#b6965b;
	text-decoration:underline;
	}
/* ==================================================
   box
================================================== */
.s_box{
	width:724px;
	border:3px solid #b6965b;
	background:url(../../common/img/cont_bg_gray.gif) repeat;
	color:#000;
	}
.b_box{
	border:3px solid #b6965b;
	background:url(../../common/img/cont_bg_gray.gif) repeat;
	color:#000;
	}
/* ==================================================
   company navi
================================================== */
#contents .sNav{
	background:url(../../../common/img/cont_bg_gold.gif) repeat-x;
	overflow:hidden;
	zoom:1;
	height:43px;
	margin-bottom:12px;
	}
#contents .sNav li{
	float:left;
	}



/* Add 250127 */
#contents #snsArea.new{
  width: 80px;
  height: auto;
  margin-bottom: 10px;
  padding: 10px 10px;
  background: #000;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
}
#contents #snsArea.new li.twt,
#contents #snsArea.new li.fb{ position: static; }
#contents #snsArea.new li{
  margin-bottom: 10px;
  margin-right: 8px;
}
#contents #snsArea.new li:last-child{ margin-bottom: 0; }
#contents #snsArea.new li:nth-child(even){ margin-right: 0; }
#contents #snsArea.new li a{ display: block; }
#contents #snsArea.new li.insta a:hover{ opacity: 0.7; }