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

body {
	font-family: '游ゴシック', YuGothic, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3','ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, sans-serif;
font-weight: 500; /*windows対策*/
	text-align: center;
	-webkit-text-size-adjust: 100%;
	color:#231815;
	letter-spacing:0.05em;
}
*{
	margin:0;
	padding:0;
-moz-box-sizing: border-box;
  box-sizing: border-box;
}
img{
	vertical-align: bottom;
}
a img {
	border:none;
}
a {
	color:#231815;
	transition:1s;
}
a:hover{
	text-decoration:underline;
	color:#666;
	opacity:.6;
}

.clearfix:after {  
    visibility: hidden;  
    display: block;  
    font-size: 0;  
    content: " ";  
    clear: both;  
    height: 0;  
    }  
* html .clearfix             { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */  
li {
	list-style:none;
}
i {
	padding:0 5px;
}
.pc {
	
}
.sp {
	display:none;
}
img{
max-width: 100%;
height:auto;

}
section:after,article:after,dl:after {  
    visibility: hidden;  
    display: block;  
    font-size: 0;  
    content: " ";  
    clear: both;  
    height: 0;  
    }  
* html section   ,* html article,* html dl          { zoom: 1; } /* IE6 */  
*:first-child+html section,*:first-child+html article,*:first-child+html dl { zoom: 1; } /* IE7 */  

@media only screen and (max-width:480px){
img{
	border: 0;
max-width: 100%;
    height: auto;
    width /***/:auto;　/*IE8のみ適用*/
}
 

.pc {
	display:none;
}
.sp {
	display:block;
}
}
/*PC改行加える*/
.br-pc{
	display:inherit;
}
 /*PC改行無効*/
.br_sp{
	display:none;
}
.br_ssp{
	display:none;
}
@media only screen and (max-width:920px){
	/*SP改行無効*/
.br-pc{
	display:none;
}
/*SP改行加える*/
.br_sp { display:block; }
.br_ssp{
	display:none; 
}

.sp {
	display:block;
}
}
@media only screen and (max-width:480px){
	/*SP改行無効*/
.br-pc{
	display:none;
}
/*SP改行加える*/
.br_sp { display:block; }
.br_ssp{
	display:block; 
}
}

/************************************

margin-bottom

************************************/
.b5{
margin-bottom:5px !important;
}

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

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

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

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

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

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

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

.b70{
margin-bottom:70px !important;
}

.b80{
margin-bottom:80px !important;
}

.b90{
margin-bottom:90px !important;
}

.b100{
margin-bottom:b100px !important;
}
/************************************

scroll animation

************************************/


/*ズームイン表示*/
.list-mv01{
	transform: scale(0, 0);
	-webkit-transform: scale(0, 0);
	transition: .8s;
}
.mv01{
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
}

/*フェードイン表示*/
.list-mv02{
	opacity: 0;
	transition: .8s;
}
.list-mv02:not(:target) {
opacity: 1\9; /*IE9対策*/
}
.mv02{
	opacity: 1.0;
}





/*移動＋フェードイン表示*/
.list-mv07{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
	transition: .8s;
}
.list-mv07:not(:target) {
opacity: 1\9; /*IE9対策*/
}
.mv07{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/************************************

wrapper

************************************/
.wrapper {
	width:90%;
	max-width:900px;
	margin:auto;
}
.wrapper:after {  
    visibility: hidden;  
    display: block;  
    font-size: 0;  
    content: " ";  
    clear: both;  
    height: 0;  
    }    

@media only screen and (max-width:480px){
	.wrapper {
	width:84%;
	max-width:84%;
	margin:auto;
}
}

/************************************

header

************************************/
header {
	position:fixed;
	width:235px;
	height:100vh;
	background:#fff;
	border-right:1px solid #ccc;
	text-align:center;
	z-index:10;
}
header h1 a {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-decoration: none;
	background-image:url(../images/logo.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size:contain;
	display: block;
	height: 200px;
	width: 140px;
	margin:50px auto;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
header h1 a {
    background-image:url(../images/logo@2x.png);
  }
}
header nav li {
	letter-spacing:.2em;
	font-size:14px;
	line-height:300%;
}
header nav li a {
	text-decoration:none;
	transition:.5s;
}
header nav li a:hover{
	text-decoration:none;
	font-weight:bold;
	opacity:1;
}
@media only screen and (max-width:1100px){
	header {
	width:180px;
	}
}
@media only screen and (max-width:920px){
	header {
	position:relative;
	width:100%;
	height:auto;
	border-right:none;
	}
	
	header nav{
		display:none;
	}
	header h1 a {
	background-image:url(../images/logo_sp@2x.png);
	height: 65px;
	width: 150px;
	margin:0px 6%;
}
}
/************************************

#main

************************************/
#main {
	margin:0 0 0 235px;
}
@media only screen and (max-width:1100px){
	#main {
	margin:0 0 0 180px;

	}
}
@media only screen and (max-width:920px){
	#main {
	margin:0 ;

	}
}
/************************************

aside

************************************/
#main aside {
	padding:15px;
	text-align:left;
	background:#fff;
}
#main aside a{
	text-decoration:none;
}
#main aside:after,
#aside_news:after {  
    visibility: hidden;  
    display: block;  
    font-size: 0;  
    content: " ";  
    clear: both;  
    height: 0;  
} 
@media only screen and (max-width:920px){
	#main aside {
		border-top:1px solid #ccc;
		border-bottom:1px solid #ccc;
		padding:8px 8%;
	}
}
/***** news ****/
#aside_news {
	float:left;
	width:45%;
}
#aside_news {
	float:left;
	width:50%;
}
#aside_news h3 {
	font-size:80%;
	font-weight:normal;
	float:left;
	margin:0 0 0 0;
	width:50px;
}
#aside_news ul {
	font-size:80%;
	font-weight:normal;
	
	margin:0 0 0 50px;
	width:85%;
}
@media only screen and (max-width:920px){
	#aside_news {
	float:none;
	width:100%;
}
#aside_news h3 {
	font-size:75%;
}
#aside_news ul {
	font-size:75%;
}
}
/***** aside_menu ****/
aside nav{
	float:right;
	width:50%;
	text-align:right;
}
aside nav li {
	display:inline-block;
	position:relative;
}
aside nav .menu {
	margin-right:60px;
}
aside nav .menu li{
	font-size:80%;
	padding:0 7px 0 4px;
}
aside nav .menu li:after{
  position: absolute;
top: 0;
  right: 0px;
  content: "|";
  width:3px;
  text-align:center;
}
aside nav .sns {
	float:right;
	width:60px;
}
@media only screen and (max-width:920px){
	aside nav{
		display:none;
	}
}

/************************************

footer

************************************/
footer {
	padding:0 0 50px 0;
	background:#fff;
}
footer h1 a {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-decoration: none;
	background-image:url(../images/logo.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size:contain;
	display: block;
	height: 150px;
	width: 100px;
	margin:0px auto 10px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
footer h1 a {
    background-image:url(../images/logo@2x.png);
  }
}

footer .sns {
	margin:0 0 40px;
}
footer .sns li {
	display:inline-block;
}
footer p {
	font-size:90%;
}
footer h4 {
	font-size:120%;
	letter-spacing:0.1em;
	font-weight:normal;
	margin:10px 0 20px;
}
footer h4 a {
	text-decoration:none;
}
footer .copyright {
	font-size:75%;
}
footer .tobi {
	font-size:8px;
}
footer .tobi-img {
	width:13px !important;
	vertical-align:middle;
}

/************************************

pageup

************************************/
#pageup {
	position:fixed;
	z-index:10;
	right:5px;
	bottom:-130px;
	transition:.3s;
	transition: .5s;

}
#pageup:hover{
	bottom:0;
}
#pageup a {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-decoration: none;
	background-image:url(../images/pagetop.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size:contain;
	display: block;
	height: 125px;
	width: 25px;
	
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
#pageup a {
   background-image:url(../images/pagetop@2x.png);
  }
}

/************************************

SP_MENU

************************************/
/*!------------------------------------*\
    Right
\*!------------------------------------*/
.drawer--right .drawer-nav {
  right: -16.25rem;
  -webkit-transition: right 1.2s cubic-bezier(0.190, 1.000, 0.220, 1.000);
  transition: right 1.2s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}

.drawer--right.drawer-open .drawer-nav,
.drawer--right .drawer-hamburger,
.drawer--right.drawer-open .drawer-navbar .drawer-hamburger {
  right: 0;
}

.drawer--right.drawer-open .drawer-hamburger {
  right: 16.25rem;
}
/*!------------------------------------*\
    Hamburger
\*!------------------------------------*/
.drawer-hamburger {
  position: fixed;
  z-index: 104;
  top: 0;
  display: block;
  box-sizing: content-box;
  width: 2rem;
  color:#000;
  padding: 0;
  padding-top: 20px;
  padding-right: .75rem;
  padding-bottom: 20px;
  padding-left: .75rem;
  -webkit-transition: all 1.2s cubic-bezier(0.190, 1.000, 0.220, 1.000);
  transition: all 1.2s cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  border: 0;
  outline: 0;
  background-color: #fff;
}

.drawer-hamburger:hover {
  cursor: pointer;
  background-color: transparent;
   background-color: #fff;
}

/**3本線→２本線**/
.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
  width: 100%;
  height: 1px;
  -webkit-transition: all 1.2s cubic-bezier(0.190, 1.000, 0.220, 1.000);
  transition: all 1.2s cubic-bezier(0.190, 1.000, 0.220, 1.000);
  background-color: #000;
}

.drawer-hamburger-icon:before
.drawer-hamburger-icon:after {
  position: absolute;
  top: 20px;
  left: 0;
  content: ' ';
}

.drawer-hamburger-icon:after {
  top: 0px;
}
.drawer-nav {
	text-align:left;
}
.drawer-nav a {
	text-decoration:none;
	color:#000;
	font-size:90%;
}
.drawer-nav ul {
	padding:4% 8% ;
	border-bottom:1px solid #000;
}

.drawer-nav ul li {
	padding:5px 0 5px 20px;
	position:relative;
}

.drawer-nav ul.mainmenu li:before{
  position: absolute;
top: 50%;
  -webkit-transform: translateY(-50%); /* Safari用 */
  transform: translateY(-50%);
  left: 0px;
  color: #595757;
  font: 14px 'FontAwesome';
  content: "\f105";
}
.drawer-nav ul.submenu{
	font-size:90%;
}
.drawer-nav ul.submenu li {
	padding:2px 0 2px 20px;
}
.drawer-nav ul.submenu li:before{
  position: absolute;
top: 50%;
  -webkit-transform: translateY(-50%); /* Safari用 */
  transform: translateY(-50%);
  left: 0px;
  color: #595757;
  font: 10px 'FontAwesome';
  content: "\f105";
}
.drawer-nav ul.sns{
	font-size:150%;
}
.drawer-nav ul.sns li {
	display:inline-block;
	padding:2px 15px 2px 0;
}


/************************************

bt

************************************/
.bt a{
	font-size:90%;
	line-height:100%;
	font-weight:bold;
	text-decoration:none;
	display:inline-block;
	border:1px solid #1d1d1b;
	padding:10px 50px;
	position:relative;
	/*全体角丸*/
border-radius: 2em; /* CSS3草案 */ 
-webkit-border-radius: 2em; /* Safari,Google Chrome用 */ 
-moz-border-radius: 2em; /* Firefox用 */ 
}
.bt a:before{
  position: absolute;
top: 50%;
  -webkit-transform: translateY(-50%); /* Safari用 */
  transform: translateY(-50%);
  right: 15px;
  color: #1d1d1b;
  font: 14px 'FontAwesome';
  content: "\f105";
}
.bt a:hover {
	opacity:.5;
}


/************************************

mainimage(second)

************************************/
.second #mainimage{
	
	width:100%;
	height:400px;
	transition:3s;
}

@media only screen and (max-width:920px){
	.second  #mainimage{
	height:350px;
}
}
@media only screen and (max-width:480px){
	.second #mainimage{
	height:280px;
}
}

/************************************

pagetitle(second)

************************************/
.second .pagetitle {
	display:inline-block;
	background:url(../images/kako1.png) no-repeat left top;
	margin:70px 0;
}
.second .pagetitle h1 {
	padding:20px 60px;
	display:inline-block;
	font-size:180%;
	background:url(../images/kakko2.png) no-repeat right bottom;
	line-height:120%;
}
.second .pagetitle h1 small {
	font-size:11px;
	display:block;
	line-height:150%;
}
@media only screen and (max-width:920px){
	.second .pagetitle {
	margin:50px 0;
}
	.second .pagetitle h1 {
	padding:20px 40px;
	font-size:150%;
}
}
/************************************

section(second)

************************************/
#main.second  section {
	margin:0 0 70px 0;
	text-align:left;
	transition:1.5s;
}

/************************************

common title

************************************/
.second h2 {
	font-weight:normal;
	font-size:160%;
	margin:0 0 20px;
	line-height:180%;
}
.second h3 {
	font-weight:normal;
	font-size:130%;
	margin:0 0 20px;
}
.second h4 {
	font-weight:normal;
	font-size:110%;
	margin:0 0 10px;
}
.second p {
	line-height:200%;
}
@media only screen and (max-width:920px){
	.second h2 {
	font-size:130%;
	margin:0 0 20px;
	line-height:180%;
}
.second h3 {
	font-size:110%;
	margin:0 0 20px;
}
.second h4 {
	font-size:100%;
	margin:0 0 10px;
}
.second p {
	font-size:90%;
	line-height:200%;
}
}
/************************************

.list (flexbox)

************************************/
.list {
	display: block; /* before Android4.3 iOS6:Safari */
	display: -ms-flexbox;/*IE10*/
	display: -webkit-flex; /* Safari */
	display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:  wrap;
}
.list article a{
	text-decoration:none;
	transition:1s;
	position:relative;
	display:block;
}
.list article a:hover{
transform: translate(0,-10px); 
	-webkit-transform: translate(0,-10px); 
	
}
/**** list4 ****/
.list.list4 article {
	text-align:left;
	width:20.5%;
	margin:0 6% 30px 0;
}
.list.list4 article a:hover{
	opacity:1;
}
.list.list4 article:nth-child(4n){
	margin-right:0;
}
.list.list4 article .image img{
	/*transition:.8s;*/
}
.list.list4 article:hover .image img {
/*opacity:1;
	 box-shadow: 1px 1px 10px rgba(0,0,0,0.3);

border-radius: 3px; 
-webkit-border-radius: 3px; 
-moz-border-radius: 3px; */
}
.list.list4 article .day {
	padding:20px 0 5px;
	font-size:14px;
}
.list.list4 article h3 {
	padding:0px ;
	font-size:18px;
	font-weight:normal;
	margin:0 0 3px;
	position: relative;
}
.list article .more {
	font-size:12px;
	text-align:right;
	padding-right:10px;
	position:relative;
}
.list article .more:before{
  position: absolute;
top: 50%;
  -webkit-transform: translateY(-50%); /* Safari用 */
  transform: translateY(-50%);
  right: 0px;
  font: 10px 'FontAwesome';
  content: "\f105";
}
/**** list3 ****/
.list.list3 article {
	text-align:left;
	width:28%;
	margin:0 8% 30px 0;
}
.list.list3 article:nth-child(3n){
	margin-right:0;
}
/*IE8▼*/
.list article {
float: left\9;
}
/*IE9▼*/
.list article:not(:target) {
float:left¥9;
}
/*IE10▼*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.list article  {
	float:left !important;
}
}
.list article .image {
	margin:0 0 10px;
}

@media only screen and (max-width:480px){
	/*** list4 ***/
	.list.list4 article {
	width:47%;
	margin:0 6% 20px 0;
}
.list.list4 article:nth-child(2n){
	margin-right:0;
}
.list.list4 article .day {
	padding:10px 0 5px;
	font-size:80%;
}
.list.list4 article h3 {
	padding:0px ;
	font-size:100%;
	font-weight:normal;
	margin:0 0 10px;
	position: relative;
}
/*** list3 ***/
.list.list3 article {
	width:47%;
	margin:0 6% 20px 0;
}
.list.list3 article:nth-child(3n){
	margin:0 6% 20px 0;
}
.list.list3 article:nth-child(2n){
	margin-right:0;
}
}


/************************************

MaxButtons (snsボタン)

************************************/


.mb-text{
text-shadow:none !important;
}

.maxbutton-3 .share_count{
	margin-right:10px;
}

/*.maxcollection.maxcollection-1{
    display: flex !important;
    justify-content: center !important;
}*/


/************************************

aリンクをクリックした時の青枠を消す

************************************/
*:focus {
outline: none;
}

.grecaptcha-badge{
display: none;
}