@charset "UTF-8";

@import url(import.css);


/*---------------------------------------------- top */

#top{
	clear: both;
	width: 980px;
	margin: 0 auto;
}




/*------------------------------------------------- live */

.live{
	margin-bottom: 5px;
}

.live h2{
	background-color: #FF3366;
	color: #FFFFFF;
	text-align: center;
	padding: 3px;
	font-weight: bold;
}


/*------------------------------------------------- top */

/*#flashArea{
	clear: both;
	text-align: center;
	margin-bottom: 5px;
}*/

#topSlider{
	margin-bottom: 10px;
}


ul.slideArea{
	text-align: center;
	background-color:#F6F4EA;
	width: 100%;
/*	position: relative;
    margin: 0px auto 455px;
*/	}



ul.slideArea li{
	 z-index: 1;
 position: relative;
/*	position: absolute;
	margin: 0px auto 0px -825px;
	left: 50%;
*/	}

ul.slideArea li a:link{
	text-decoration:none!important;
	}

ul .slideArea li img{

	}
.kuruppa{
/*	margin: 155px auto 0px -825px;
*/    position: absolute;
    /*top:155px;*/
    bottom:-1px;
	right: 0;
/*    z-index: 1000;
*/    text-align: center;
	}
 

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.kuruppa{
/*	margin: 155px auto 0px -825px;
*/    position: absolute;
    /*top:155px;*/
    bottom:-1px;
	right: 0;
/*    z-index: 1000;
*/    text-align: center;
	}
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.kuruppa{
/*	margin: 155px auto 0px -825px;
*/    position: absolute;
    /*top:155px;*/
    bottom:-1px;
	right: 0;
/*    z-index: 1000;
*/    text-align: center;
	}
	}

.kuruppa p{
	color: #2299CC;
    font-size: 18px;
    height: 120px;
    position: absolute;
/*    right: 520px;
*/    left: 54%;
    text-align: left;
/*    top: 190px;
*/    top: 45%;
    width: 180px;
	font-size:15px;
	z-index: 1000;
	}



#top{
	width: 980px;
	margin: 0 auto;
}

.left_frame{
	float: left;
	width: 210px;
	margin-right: 25px;
	/*font-size: 12px;*/
}
.center_frame{
	float: left;
	width: 510px;
	margin-right: 25px;
	/*font-size: 12px;*/
}
.right_frame{
	float: left;
	width: 210px;
}

/*------------------------------------------------- left_frame */
ul.InfoList{

	}
ul.InfoList li{
	font-size:0px!important;
	margin-bottom: 3px;

	}
.top_guide ul{

	margin-top: 6px;
}

.top_guide li{
	margin-bottom:2px;
}

.top_guide li img{vertical-align: top;}

.t_ranking{}
.t_ranking ul{margin: 5px 0;}
.t_ranking li{margin-bottom: 3px;}
.t_ranking li a{color: #333333;}
.t_ranking li a:hover{color: #CC0000;}
.t_ranking span{color: #4F7D1B;}

.t_ranking .rank1{
	background: url(../img/top/common/rank01.gif) no-repeat left center;
	padding-left: 30px;
	margin-top: 5px;
}
.t_ranking .rank2{
	background: url(../img/top/common/rank02.gif) no-repeat left center;
	padding-left: 30px;
}
.t_ranking .rank3{
	background: url(../img/top/common/rank03.gif) no-repeat left center;
	padding-left: 30px;
}
.t_ranking .rank4{
	background: url(../img/top/common/rank04.gif) no-repeat left center;
	padding-left: 30px;
}
.t_ranking .rank5{
	background: url(../img/top/common/rank05.gif) no-repeat left center;
	padding-left: 30px;
}

.top_staffblog{margin: 5px 0 10px 0;}

/*------------------------------------------------- center_frame */

.top_more{
	text-align: right;
	margin: -32px 10px 15px 0px;
}

.osusume{
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #CCCCCC;
    border-radius: 2px 2px 2px 2px;
	/*height: 248px;*/
	height: 232px;
	width: 246px;
	padding:2px;
	float: left;
	margin-bottom: 5px;
	-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1);
	-moz-box-shadow: 1px 1px 1px rgba(0,0,0,.1);
	box-shadow: 1px 1px 1px rgba(0,0,0,.1);
  	background: white;
	margin-right:6px;
}

.osusume div{
	width: 246px;
	text-align:center;
	/*height:160px;*/
}
.osusume p.title{
	margin:2px 0;
	padding:2px;
}


.leftEv{
	float:left;
	width:250px;
	margin-right:5px;
	}

.eventWaku{
	width: 248px;
	float: left;
	margin-bottom: 5px;
	margin-right:6px;
}

.eventWaku div{
	width: 246px;
	text-align:center;
	/*height:160px;*/
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #CCCCCC;
	padding:2px;


}
.eventWaku p{
	margin:2px 0;
	padding:2px;
}

.eventWaku p img{
	vertical-align: middle;
	margin-right: 0px;
}

.evday{
	color: #4F7D1B;
	display: block;
	margin-top: 1px;
	font-size:0.9em;
}
.Yearevent{
	}
.Yearevent span{
	float:right;
	color:#C93B42;
	}


ul.eventList{
	margin-top:10px;

	}

.eventList li{
	background:url(../img/common/line.jpg) repeat-x top center;
	padding-top:10px;
	padding-bottom:10px;
	display:block;
	clear:both;

	}

.evPh{
	float:left;
	width: 110px;
	height:110px;
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #CCCCCC;
	padding:2px;
	text-align:center;
	}

.evR{
	width:380px;
	float:right;
	margin-left:5px;
	display:block;
	}

/*------------------------------------------------- right_frame */

.top_feature{margin-bottom: 5px;}
.top_rightbanner li{margin-bottom: 3px;}
.top_rightbanner li img{vertical-align: top;}

.list_type2 span{}


/*-------------------------------------------------20101101追加　ブログ right_frame */

.top_blog{
    width: 210px;
	/*height:320px;*/
	margin-bottom:10px;
	background: none repeat scroll 0 0 #FFFFFF;
	border:#E3DFCD solid 1px;
    border-radius: 2px 2px 2px 2px;
	-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1);
	-moz-box-shadow: 1px 1px 1px rgba(0,0,0,.1);
	box-shadow: 1px 1px 1px rgba(0,0,0,.1);

	display:block;
}
.top_blog h3{
	margin-top:5px;
	margin-bottom:5px;
}
.top_blog h4{
	margin:4px;
}
.top_blog ul li{
	float:left;
	display:block;
	}
.top_blog ul li{
	float:left;
	display:block;
	margin-left:5px;
	}

.blogPh{
	margin: 4px;
	width: 202px;
	text-align:center;
}
.blogThum{
	border:1px solid #D6D6D6;
	width:43px;
	height:43px;
	text-align:center;
	background-color:#FFF;
	margin-bottom:3px;
	}
.toukouname{
	font-weight:bold;
	color:#432C24;
	}
.Btx{
	width:155px;
	}
.Btx p{
	line-height:1em;
	}

/*-------------------------------------------------20110624追加　久留米物語バナー追加 */

.storybanner {
	margin-bottom: 10px;
}


/*-------------------------------------------------20130705追加　バナー追加 */


.Topbanner {
	margin-top: 10px;
}



.TTL{
	background:url(../img/top/jp/ttl_BG.jpg) no-repeat bottom;
	width:490px;
	height:18px;
	padding:10px;
	clear:both;
	}


/*------------------------------------------- calendar */


#calender{
	width: 246px;
	margin-bottom: 5px;
	margin-right:2px;
	padding:2px;
	background:#CFC5AD;
}

.skipBtn {
    padding: 5px;
    position: absolute;
    width: 210px;
	margin-top:5px;
}
.skipBtn a {
	text-decoration: none!important;
}
.skipBtn .next {
    margin-left: 20px;
	text-align:right;

}
.skipBtn .prev {
    margin-right:150px;
	text-align:left;
}

.c_month{
	height:20px;
	padding-top:5px;
	color: #432C24;
	background:#CFC5AD;
	font-size: 1.7em;
	text-align: center;
	font-weight:bold;
}

#calenderBox{
	clear: both;
	padding:8px;
	border:1px solid #FFF;

}

#calenderBox table{
	margin-bottom: 0;
	margin-top:5px;
}

#calenderBox table th{
	text-align: center;
	padding: 5px;
}

#calenderBox table td{
	width:30px;
	height:20px;
	padding:3px;
	text-align: center;
	background-color: #FFFFFF;
	border-right:1px solid #F0EEC5;
	border-top:1px solid #F0EEC5;
	color:#000!important;
}
#calenderBox table td:nth-child(1) {  /* 末尾から1番目のみ */
     border-left:1px solid #F0EEC5;
}
#calenderBox table tr:nth-last-child(1) {  /* 末尾から1番目のみ */
     border-bottom:1px solid #F0EEC5;
}

#calenderBox table td span{
	display:block;
	font-weight:normal;
	/*color:#000!important;*/
}

#calenderBox table .mWeek{
	font-weight:bold;
	color:#000!important;
}


#calenderBox table .Sat{
	font-weight:bold;
	color: #3868C0;

}
#calenderBox table .Sun{
	font-weight:bold;
	color:#CA3365;
}

#calenderBox table .cEve{
	background:#F8B9B4;

}

#calenderBox table .cEve a{
	font-weight:bold;

}


/*-------------------------------------------------201509追加　賛助会員からのお知らせ right_frame */

.top_member_news{
	/*height:320px;*/
	margin-top:10px;
	background: none repeat scroll 0 0 #FFFFFF;
	border:#2F5597 solid 2px;
}
.top_member_news h3{
	background: #2F5597;
}

.top_member_news ul{
	padding: 5px 8px 0 8px;
}

.top_member_news li{
	border-bottom:1px dotted #A4B4D1;
	padding-bottom: 5px;
	margin-bottom: 5px;
	word-break: break-all;
}
.top_member_news h4{
	margin:4px;
	background: url(../img/top/jp/arrow_ksq.gif) left 5px no-repeat;
	padding-left: 10px;
}

.top_member_news li img{
	vertical-align: middle;
	float: right;
}

.top_member_news .genre{
	color: #336699;
	font-size: 80%;
	text-align: right;
	clear: both;
}


.moreBtn_sq a{
	display: block;
	color: #FFF;
	background: #C23B41;
	text-align: center;
	margin: 10px;
	padding: 5px;
	text-decoration: none;
}

.moreBtn_sq a::before {
	content: url(../img/common/arrow_more.png);
	font-family: 'icomoon';
	margin-right: 5px;
	font-weight: normal;
}

.moreBtn_sq a:hover{
	opacity: 0.7;
}


.top_member_news .member{
	font-size: 90%;
	float: right;
	color: #FFF;
	background: #2F5597;
	display: inline;
	clear: both;
	padding: 2px;
	margin-top: 5px;
}

.top_member_news .member a{
	color: #FFF;
}



.top_member_news p{
	clear: both;
}

.new-kuruppa{
	background: url(../img/common/nami.png) left bottom no-repeat;
	background-size: 100%;
	position: absolute;
	bottom: -1px;
	width: 100%;
	height: 100%;
	z-index: 1;
}


.new-kuruppa::after {
    content:" ";
    display:inline-block;
    width:100%;
    height:30px;
	background: url(../img/common/nami.png) left bottom no-repeat;
	background-size: 100%;
	right: 0;
	bottom: 0;
	z-index: 1;
	position: absolute;
	}
	

.new-kuruppa::before {
	margin:0 10px 0 0;
    content:" ";
    display:block;
    width:200px;
    height:170px;
    background:url(../img/common/kappa.png);    
    background-size:contain;
	right: 60px;
	bottom: 20px;
	position: absolute;
	z-index: -1;

	}
	.sp-selected .new-kuruppa::before {
		-webkit-animation: toujou 1.5s linear 1 forwards;
		animation: toujou 1.5s linear 1 forwards;
	}
/*	@-webkit-keyframes toujou {
		0% {-webkit-transform:translateY(100%);}
		100% {-webkit-transform:translateY(0);}
	}
	@keyframes toujou {
		0% {transform:translateY(100%);}
		100% {transform:translateY(0);}
	}*/
	
	@-webkit-keyframes toujou {
	  0%   { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%) translateY(100%); }
	  20%  { -webkit-transform: scale(1.0, 1.06) translate(-3%, -4%) skew(4deg, 2deg) translateY(90%); }
	  50%  { -webkit-transform: scale(1.0, 0.94) translate(3%, 4%) skew(-4deg, 5deg) translateY(60%); }
	  65%  { -webkit-transform: scale(1.0, 1.03) translate(2%, -2%) skew(-2deg, 2deg) translateY(30%); }
	  80%  { -webkit-transform: scale(1.0, 0.97) translate(-2%, 2%) skew(2deg, 5deg) translateY(15%); }
	  100% { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%) translateY(0%); }
	}
	
	@keyframes toujou {
	  0%   { transform: scale(1.0, 1.0) translate(0%, 0%) translateY(100%); }
	  20%  { transform: scale(1.0, 1.06) translate(-3%, -4%) skew(4deg, 2deg) translateY(90%); }
	  50%  { transform: scale(1.0, 0.94) translate(3%, 4%) skew(-4deg, 5deg) translateY(60%); }
	  65%  { transform: scale(1.0, 1.03) translate(2%, -2%) skew(-2deg, 2deg) translateY(30%); }
	  80%  { transform: scale(1.0, 0.97) translate(-2%, 2%) skew(2deg, 5deg) translateY(15%); }
	  100% { transform: scale(1.0, 1.0) translate(0%, 0%) translateY(0%); }
	}
	
	

	
	.kuruppa-comment{
	background: url(../img/common/balloon.png) left bottom no-repeat;
	background-size: 300px;
	position: absolute;
	top: 30%;
	right: 220px;
	width: 300px;
	height: 218px;
	z-index: 1000;
	opacity: 0;
	display: table;
}

	.sp-selected .kuruppa-comment {
	animation: poyon 1.1s linear 2s 1 forwards;
	}

	.kuruppa-comment p{
	padding: 30px 40px 60px 40px;
	color: #2299cc;
	font-size: 120%;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	}
	
	@-webkit-keyframes poyon {
	  0%   { -webkit-transform: scale(0.8, 1.4) translate(0%, -100%); opacity:1; }
	  10%  { -webkit-transform: scale(0.8, 1.4) translate(0%, -15%); opacity:1;}
	  20%  { -webkit-transform: scale(1.4, 0.6) translate(0%, 30%); opacity:1;}
	  30%  { -webkit-transform: scale(0.9, 1.1) translate(0%, -10%); opacity:1;}
	  40%  { -webkit-transform: scale(0.95, 1.2) translate(0%, -30%); opacity:1;}
	  50%  { -webkit-transform: scale(0.95, 1.2) translate(0%, -10%); opacity:1;}
	  60%  { -webkit-transform: scale(1.1, 0.9) translate(0%, 5%); opacity:1;}
	  70%  { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); opacity:1;}
	  100% { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); opacity:1;}
	}
 
	@keyframes poyon {
	  0%   { transform: scale(0.8, 1.4) translate(0%, -100%); opacity:1; }
	  10%  { transform: scale(0.8, 1.4) translate(0%, -15%); opacity:1;}
	  20%  { transform: scale(1.4, 0.6) translate(0%, 30%); opacity:1;}
	  30%  { transform: scale(0.9, 1.1) translate(0%, -10%); opacity:1;}
	  40%  { transform: scale(0.95, 1.2) translate(0%, -30%); opacity:1;}
	  50%  { transform: scale(0.95, 1.2) translate(0%, -10%); opacity:1;}
	  60%  { transform: scale(1.1, 0.9) translate(0%, 5%); opacity:1;}
	  70%  { transform: scale(1.0, 1.0) translate(0%, 0%); opacity:1;}
	  100% { transform: scale(1.0, 1.0) translate(0%, 0%); opacity:1;}
	}