@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'Boku2-Regular';
  src: url('Boku2-Regular.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('Boku2-Regular.otf') format('opentype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

* {
	font-family: Boku2-Regular;
	font-style: normal;
	margin: 0px;
	padding: 0px;
}

html {
	width: 100%;
	height: 100%;
}

body {
	width: 100%;
	height: 100%;
	overflow-x : hidden;
	color: #fff;/* 基本の文字色 */
	line-height: 1.6;
	background: #000 ;
}

header,footer,nav,section,article,figure,aside {
  display:block;/* html5以降のタグをブロック要素に指定 */
}


/* link style
---------------------------------------------------------*/
a {
	outline: none;/* リンクした要素をクリックした際の枠線を表示しない */
}

a:link {
	color: #55acee;/* 青 */
	text-decoration: none;
}
a:visited {
	color: #CC9900;/* オレンジ　訪問済みリンク色 */
	text-decoration: none;
}
a:hover {
	color: #FF0000;/* 赤　マウスオーバー時リンク色 */
	text-decoration: none;
}
a:active {
	color: #FF0000;/* 赤　クリック時リンク色 */
	text-decoration: none;
}
a img {
	border-style: none;/* 画像にリンクを貼った際のボーダーの削除 */
}

a.overwhite{
    background-color:#ffffff;
    display:block;
}

a.overwhite:hover img{
    cursor:pointer;
    filter: alpha(opacity=60);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=60)";  /* ie 8 */
    -moz-opacity:0.6;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.6;              /* Safari 1.x */
    opacity:0.6;
    zoom:1;
}

/* clearfix
---------------------------------------------------------*/

.clearfix:after {
  content: "."; 
  display: block; 
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}


.rs_img {/* 画像レスポンシブ対応*/
	max-width :100%;
	height :auto;
}

@media screen and (max-width: 1000px) {
.rs_img {
	max-width :40%;
}
}

@media screen and (max-width: 500px) {
.rs_img {
	max-width :100%;
}
}

.rs_img_50 {/* 画像レスポンシブ対応50%*/
	max-width :50%;
	height :auto;
}

.red {
  color:#CC0000;
}

.black {
  color: #333333;
}

.center {
  text-align: center;
}

.floatL {
	float :left;
}

.floatR {
	float :right;
}

.floatC {
	clear :both;
}

/* 水平線デザインここから ▽▽
---------------------------------------------- */

hr {
	margin :0.5em 0 0.5em 0;
}

.hr01 {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
}

.hr02 {
    border: 0;
    border-bottom: 1px dashed #ccc;
    background: #999;
}

/* 水平線デザインここまで △△
---------------------------------------------- */

.text_list {/* ulの位置調整 */
	padding-left :2em;
}

.form_list dt,.form_list dd {
	padding :0.5em 0.5em 0.5em 1em;
}
.form_list dt{
	background :#ccc;
}

.form_list dd{
	background :#fafad2;
}

/* インプット要素のレスポンシブ対応クラス */
.input_s,.input_m,.input_l {
	display :block;
}

.input_s {
	width :50%;
}

.input_m {
	width :80%;
}

.input_l {
	width :95%;
}

label {
	white-space :nowrap;
}


h1 {
  width: 100%;
  background: #42210B;
  color: #FFFFFF;
  font-size: 50%;
  text-align: center;
}

@media screen and (max-width: 800px) {
h1 {
  display :none;
}
}

nav {
	width: 230px;
}

nav ul {
	width: 230px;
}

nav ul li {
	list-style: none;
}

@media screen and (min-width: 800px) {
	nav h2,.navBtn {
		display:none;
	}
.menu {
	height :auto !important;
}
}

/* ▽▽ハンバーガーメニューここから▽▽ */
@media screen and (max-width: 800px) {
nav {
	/* メニューを開いた時に
	オーバーレイの上に来るように絶対指定 */
	position:fixed; 
	top:0;
	left:0;
	width:100%;
	height :60px;
	color:#fff;
	text-align:center;
	text-shadow:1px 1px 0 rgba(0,0,0,0.2);
	background:#42210B;
	z-index:9999; /* 最前面に来るように */
}

/**********************************
	メニュー
**********************************/
.menu {
	overflow-y:auto; /* 縦方向のみスクロール */
	position: absolute;
	top:60px !important;
	left:0;
	width: 30%;
	max-width:230px; /* 横に広がり過ぎないように */
	min-width:230px;
	color: #333;
	font-size:110%;
	background: url(../img/nav_bg01.png) repeat-y ;/* side背景 */
	text-align:left;
	z-index:9999;
	/* アニメーション */
	-webkit-transition:0.2s ease-in-out;
	-moz-transition:0.2s ease-in-out;
	transition:0.2s ease-in-out;
}

.menu ul {
	width :100%;
	height :100%;
}

.menu ul li {
	color:#555;
	font-weight:300;
	text-shadow:none;
	text-decoration:none;
}
.menu ul li a:hover {
	color:#fff;
}

/* メニューON/OFF */
.menuOff {
	-webkit-transform:translate3d(-100%, 0, 0);
	-moz-transform:translate3d(-100%, 0, 0);
	transform:translate3d(-100%, 0, 0);
	z-index:9999; /* 最前面に来るように */
}
.menuOn {
	box-shadow: 8px 8px 20px 0 rgba(0, 0, 0, 0.2);
	-webkit-transform:translate3d(0, 0, 0);
	-moz-transform:translate3d(0, 0, 0);
	transform:translate3d(0, 0, 0);
}
.ie .menuOff {
	left:-100%; /* IE向け */
} 
.ie .menuOn {
	left: 0; /* IE向け */
} 

/* ナビゲーション以外固定 */
.fixed {
	position:fixed;
	top:0;
	left:0;
	width:100%;
}

/* オーバーレイ */
.overlay {
	position:fixed;
	top:0;
	left:0;
	display:none;
	width:100%;
	height:100%;
	background:#42210B;
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter:"alpha(opacity=70)";
	z-index:999;
}

/**********************************
	ナビゲーションアイコン
**********************************/
.navBtn {
	position:absolute;
	top:0;
	left:1em;
}
/* IE8以下はアイコン位置調整 */
#ie8 .navBtn,
#ie7 .navBtn,
#ie6 .navBtn {
	top:30px;
}
.navBtn button {
	display: block;
	border: none;
	background: none;
	outline: 0;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	−moz−tap-highlight-color:rgba(0,0,0,0);
	tap-highlight-color:rgba(0,0,0,0);
}
.navIcon {
	padding: 2rem 1rem;
	cursor: pointer;
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	transform: scale(0.8);
}

/* アイコンレイヤー */
.iconLayer {
	position: relative;
	display: block;
	width: 50px;
	height: 7px;
	background:#fff;
	-webkit-animation-duration: 300ms;
	-moz-animation-duration: 300ms;
	animation-duration: 300ms;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}
.iconLayer:before, .iconLayer:after {
	content: '';
	position: absolute;
	left: 0;
	display: block;
	width: inherit;
	height: 7px;
	background: inherit;
	-webkit-animation-duration: 300ms;
	-moz-animation-duration: 300ms;
	animation-duration: 300ms;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}
.iconLayer:before {
	bottom: 200%;
}
.iconLayer:after {
	top: 200%;
}

/**********************************
	ナビアイコン：矢印
**********************************/
.arrow {
	-webkit-animation-name: navIconSlide;
	-moz-animation-name: navIconSlide;
	animation-name: navIconSlide;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes navIconSlide {
	0% {
	}
	100% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
	}
}
@-moz-keyframes navIconSlide {
	0% {
	}
	100% {
		-moz-transform: rotate(180deg);
		transform: rotate(180deg);
	}
}
@keyframes navIconSlide {
	0% {
	}
	100% {
		transform: rotate(180deg);
	}
}

/* ナビアイコン：矢印:before */
.arrow:before {
	-webkit-animation-name: navIconSlideBefore;
	-moz-animation-name: navIconSlideBefore;
	animation-name: navIconSlideBefore;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes navIconSlideBefore {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@-moz-keyframes navIconSlideBefore {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@keyframes navIconSlideBefore {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		transform: rotate(45deg);
	}
}

/* ナビアイコン：矢印:after */
.arrow:after {
	-webkit-animation-name: navIconSlideAfter;
	-moz-animation-name: navIconSlideAfter;
	animation-name: navIconSlideAfter;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes navIconSlideAfter {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
}
@-moz-keyframes navIconSlideAfter {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
}
@keyframes navIconSlideAfter {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		transform: rotate(-45deg);
	}
}

/**********************************
	ナビアイコン：ハンバーガー
**********************************/
.hamburger {
	-webkit-animation-name: navIconSlideFrom;
	-moz-animation-name: navIconSlideFrom;
	animation-name: navIconSlideFrom;
}
@-webkit-keyframes navIconSlideFrom {
	0% {
		-webkit-transform: rotate(-180deg);
		transform: rotate(-180deg);
	}
	100% {
	}
}
@-moz-keyframes navIconSlideFrom {
	0% {
		-moz-transform: rotate(-180deg);
		transform: rotate(-180deg);
	}
	100% {
	}
}
@keyframes navIconSlideFrom {
	0% {
		transform: rotate(-180deg);
	}
	100% {
	}
}

/* ナビアイコン：ハンバーガー:before */
.hamburger:before {
	-webkit-animation-name: navIconSlideBeforeFrom;
	-moz-animation-name: navIconSlideBeforeFrom;
	animation-name: navIconSlideBeforeFrom;
}
@-webkit-keyframes navIconSlideBeforeFrom {
	0% {
		margin: 3% 37%;
		width: 50%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	100% {
	}
}
@-moz-keyframes navIconSlideBeforeFrom {
	0% {
		margin: 3% 37%;
		width: 50%;
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	100% {
	}
}
@keyframes navIconSlideBeforeFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		transform: rotate(45deg);
	}
	100% {
	}
}

/* ナビアイコン：ハンバーガー:after */
.hamburger:after {
	-webkit-animation-name: navIconSlideAfterFrom;
	-moz-animation-name: navIconSlideAfterFrom;
	animation-name: navIconSlideAfterFrom;
}
@-webkit-keyframes navIconSlideAfterFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	100% {
	}
}
@-moz-keyframes navIconSlideAfterFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	100% {
	}
}
@keyframes navIconSlideAfterFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		transform: rotate(-45deg);
	}
	100% {
	}
}

/**********************************
	レスポンシブ
**********************************/

@media screen and (max-width: 799px) {
	nav h2 {
		font-size:14px;
		text-align:left;
		padding-left : 1.5rem;
	}
}

@media screen and (max-width: 480px) {
	nav h2 {
		font-size:5px;
		text-align:left;
		padding :2rem 1rem;
	}
	nav .navBtn {
		top:-0.7em;
		left:0;
		-webkit-transform: scale(0.5);
		-moz-transform: scale(0.5);
		transform: scale(0.5);
	}
	nav .menu {
		width:70%;
	}
}
}

/* △△ハンバーガーメニューここまで△△ */

#wrapper {
	width: 100%;
	max-width: 1430px;
	margin: 0 auto 0 auto;
	background: url(../img/nav_bg01.gif) repeat-y ;/* side背景 */
}

/* ▽▽wrapper左右の影▽▽ */
#wrapper
{
    position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
#wrapper:before, #wrapper:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
#wrapper:after
{
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}
/* △△wrapper左右の影△△ */

@media screen and (max-width: 800px) {
#wrapper {
	width: 100%;
	margin: 10px auto 0 auto;
	padding: 3em 0 0 0;
	background-image: none ;
}
}

#logo {
	width: 35%;
	min-width: 200px;
	float: left;
}

#tool ul {
	display: table;
	width :20%;
	max-width: 100px;
	max-height: 50px;
	float: right;
}

#tool li {
	display: table-cell;
	list-style: none;
}

/* トップスライド(ここから)
---------------------------------------------------------*/

.top_gallery {
	width :100%;
	max-width :1200px;
	margin :0 auto 0 auto;
	clear :both;
}
.flexslider ul {list-style:none;}
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides > li a {list-style: none;}
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { margin: 0 0 60px; border: 0; position: relative;  zoom: 1; }
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Font-face Icons */
@font-face {
font-family: 'flexslider-icon';
src:url('flexslider-icon.eot');
src:url('flexslider-icon.eot?#iefix') format('embedded-opentype'),
url('flexslider-icon.woff') format('woff'),
url('flexslider-icon.ttf') format('truetype'),
url('flexslider-icon.svg#flexslider-icon') format('svg');
}
/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a  { text-decoration:none; display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; }
.flex-direction-nav .flex-prev { left: -50px; }
.flex-direction-nav .flex-next { right: -50px; text-align: right; }
.flexslider:hover .flex-prev { opacity: 0.7; left: 10px; }
.flexslider:hover .flex-next { opacity: 0.7; right: 10px; }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1; }
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }
.flex-direction-nav a:before  { font-family: "flexslider-icon"; font-size: 40px; line-height:1; display: inline-block; content: '\f001'; }
.flex-direction-nav a.flex-next:before  { content: '\f002'; }

/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); }
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
  .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}

/* トップスライド(ここまで)
---------------------------------------------------------*/

/*▽▽ 新着情報 ▽▽*/

ul#newsList{
	margin:0 0 15px;
	padding:0;
}
ul#newsList li{
	margin:0;
	padding:5px 0;
	margin-bottom:3px;
	border-bottom:1px dotted #ccc;
	line-height:120%;
	list-style-type:none;
}
a{color:#36F;text-decoration:underline;}
a:hover{color:#039;text-decoration:none;}

.catName{
	display:inline-block;
	padding:1px 8px 3px 8px;
	color :#666;
	background :#ccc;
	border:1px solid #ccc;
	border-radius:6px;
	font-size:11px;
	line-height:100%;
	margin:0 2px;
}
.newMark{
	display:inline-block;
	border:1px solid #F00;
	padding:1px 4px;
	font-size:11px;
	line-height:100%;
	background:#F00;
	color:#fff;
	box-shadow:1px 1px 1px #999;
	border-radius:8px;
	font-style:italic;
}
.comment{
	font-size:90%;
	line-height:150%;
	display:block;
	padding:3px 0;
	overflow:hidden;
}

.thumbNailWrap{
	display:block;
	width:110px;
	float:left;
	height:80px;
	overflow:hidden;
}

@media screen and (max-width: 556px) {
.comment{
	width :100%;
}
.thumbNailWrap{
	display:none;
}
}

/* Pager style（外部化可） */
.pager{
	text-align:right;
	padding:10px;
	clear:both;
}
/*ページャーボタン*/
.pager a{
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #333;
    font-size: 12px;
    padding: 3px 7px 2px;
    text-decoration: none;
	margin:0 1px;
}

/*現在のページのボタン*/
.pager a.current{
    background: #999;
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #fff;
    font-size: 12px;
    padding: 3px 7px 2px;
	margin:0 1px;
    text-decoration: none;
}

.pager a:hover{
    background:#999;
    color: #fff;
}

.overPagerPattern{
	padding:0 2px ;	
}

/* /Pager style */

#up_ymd{
	text-align:right;
	font-size:13px;
	margin:5px 10px;
}

#detail ul {
	padding-left:1.5em;
}

.detailUpfile{
	margin:5px 0 35px;
	text-align:center;
}
.backORcloseBtn{
	text-align:center;
	line-height:100%;
	margin-top:15px;
}
.backORcloseBtn a{
	display:inline-block;
	padding:4px 15px;
	border:1px solid #aaa;
	color:#999;
	border-radius:6px;
	text-decoration:none;
	font-size:12px;
}
.detailUpfile img{
	max-width:100%;
	height:auto;
}
.pNav{
	font-size:11px;	
}

/*△△ 新着情報 △△*/


#content {
	width: 100%;
	min-height :100%;
	margin-right: -230px;
	float: right;
}

@media screen and (max-width: 800px) {
#content {
	margin: 0;
	float: none;
}
}


#main {
	margin-right: 230px;
	padding-left: 1em;
}

@media screen and (max-width: 800px) {
#main {
	width: 96%;
	margin:1em 0 0 0;
	padding: 0 2% 1em 2%;
}
}

#main h2 {
	position: relative;
	text-align: center;
	color :#a00000;
}
#main h2 span {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 4em;
	padding: 0 1em;
	background-color: #000;
	text-align: left;
}
#main h2::before {
	position: absolute;
	top: 50%;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background: #ccc;
	background: -webkit-linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
	background: linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
}

#main h3{
	position:relative;
	padding:5px 20px;
	margin-bottom :10px;
	font:bold 28px/1.6 Arial, Helvetica, sans-serif;
	color:#333;
	background:#fff;
	text-shadow:
		1px 1px 0 #fff,
		2px 2px 0 #999;
	border-top:#333 solid 3px;
	border-bottom:#333 solid 3px;
    background-image: -webkit-gradient(linear, left top, right bottom,
			from(			rgba(255, 255, 255, 0.0)), 
			color-stop(0.4, rgba(255, 255, 255, 0.0)), 
			color-stop(0.4, rgba(0, 0, 0, 0.1)), 
			color-stop(0.6, rgba(0, 0, 0, 0.1)), 
			color-stop(0.6, rgba(255, 255, 255, 0.0)),
			to(				rgba(255, 255, 255, 0.0))
			);
	background-image: -webkit-linear-gradient(top -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-image: -moz-linear-gradient(top -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-image: -o-linear-gradient(top -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-image: linear-gradient(to bottom -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-size:4px 4px;
}
#main h3:before{
	content:" ";
	position:absolute;
	top:100%;
	left:24px;
	width:0;
	height:0;
	border-width:12px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#333;
}
#main h3:after{
	content:" ";
	position:absolute;
	top:100%;
	left:28px;
	width:0;
	height:0;
	border-width:8px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#f0f0f0;
	z-index:1;
}

#main p {
	padding :0.5em;
}

#main .main_content {
	width :48%;
	padding :1%;
	float :left;
}

@media screen and (max-width: 800px) {
#main .main_content {
	width :98%;
	padding :1%;
	float :none;
}
}

.parcel {
	padding :0.5em;
	margin-bottom :0.5em;
	border: #044444 solid 1px;
}

/*iframe埋め込みスタイル（リキッド）ここから*/

.rs_frame {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.rs_frame iframe,
.rs_frame object,
.rs_frame embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/*youtube埋め込みスタイル（リキッド）ここから*/

.ytg_player {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.ytg_player iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ytg_thumbnails img {
	cursor : pointer;
}

/*youtube埋め込みスタイル（リキッド）ここまで*/

#news_wrap {
	max-height :500px;
	padding: 0.5em;
	border: #666 solid 1px;
	border-radius: 10px; 
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	overflow : auto;
}

#news_wrap li {
	list-style: none;
}

#side {
	width: 230px;
	margin: 10px 0 0 0;
	padding: 0 0 10px 0;
	float: left;
}

#side .side_content {
	background: #fff;
	padding: 0.5em;
	border: #006BB6 solid 1px;
}

@media screen and (max-width: 800px) {
#side {
	width: 96%;
	margin:1em 0 0 0;
	padding: 0 2% 1em 2%;
}
}

footer {
	background: url(../img/footer01.jpg) center top no-repeat;
	-moz-background-size:100% auto;
	background-size:100% auto;
	clear : both;
    position: relative;
    width: 100%;
    height: auto;
}

footer:before {
    content: "";
    display: block;
    padding-top: 12.5%; /*footer背景の高さと同一になるように比率指定*/
}

#footer_content {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
}

#footer_content p {
	margin :1em 0 0 0;
	text-align :center;
}


address {
	width: 100%;
	padding :1em 0 1em 0;
	background: #42210B;
	text-align: center;
	margin: 0;
	color: #fff;
}

#page_menu {
	position: fixed;
	right: 20px;
	bottom: 0px;
}

/******************************
 ソーシャルエリア全体を囲む要素
 * 他のコンテンツと距離を取りたい場合は[margin]を設定して下さい
******************************/
.social-area {
	width: 97% ;
	min-height: 190px ;
	padding :1%;
	margin :0.5em auto 0.5em auto;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* デスクトップPCでは高さを拡張する */
@media screen and ( min-width:480px )
{
	.social-area
	{
		min-height: 110px ;
	}
}

/******************************
 [ul]要素
******************************/
/* スマホ */
ul.social-button {
	width: 238px ;
	margin: 24px auto ;
	padding: 0 ;
	border: none ;
	list-style-type: none ;
}

/* デスクトップ */
@media screen and ( min-width:480px )
{
ul.social-button{
		width: 410px ;
	}
}

/******************************
 [li]要素
******************************/
ul.social-button li
{
	float: left ;
	text-align: center ;
	height: 71px ;
	margin: 0 8px ;
	padding:0 ;
}

/******************************
 各種ボタン
******************************/
/* [Twitter] */
.sc-tw
{
	width: 71px ;
}

/* [Facebook] */
.sc-fb
{
	z-index: 99 ;
	width: 69px ;
}

/* [LINE] */
.sc-li
{
	width: 50px ;
}

.sc-li-img
{
	border: none ;
	margin: 0 auto ;
	padding:0 ;
	width: 36px ;
	height: 60px ;
}

/* デスクトップPCではLINEボタンを表示しない */
@media screen and ( min-width:480px )
{
	.sc-li
	{
		display: none ;
	}
}

