@charset "utf-8";

/* ================================================
 base
--------------------------------------------------- */
body {
	font-size:15px; line-height:1.86;
	color:#000;
	font-family: Meiryo, "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:#000 url(../image/bg.png) center top repeat-y;
}
#wrap {
	background:url(../image/wrap.jpg) center top no-repeat;
}
@media only screen and (max-width: 980px) {
	body {
		background:#000;
	}
	#wrap {
		min-width:320px;
		background-image:url(../image/wrap2.jpg);
		background-position:top center;
		background-repeat:no-repeat;
		background-size:100% auto;
	}
}
@media only screen and (max-width: 980px) {
	body {
		font-size:12px; line-height: 1.66;
	}
}

/*=================================================
 header
--------------------------------------------------- */
#header {
	width:100%; max-width:980px;
	margin:0 auto;
}
#header .kv{
	width: 100%; max-width: 980px;
	margin: 0 auto;
	height: 574px;
	position: relative;
}
#header .kv .pop1,
#header .kv .pop2{
	display: none;
}

#header .menu {
	padding:0 15px;
}
#header ul {
	width:100%;
	margin:0; padding:0;
	font-size:0;
}
#header li {
	margin:0; padding:0;
	list-style:none;
	display:inline-block; vertical-align:bottom;
}
#header li img{
	width:100%;
	vertical-align:bottom;
}
#header .m1 {width:300px;}
#header .m2 {width:198px;}
#header .m3 {width:184px;}
#header .m4 {width:212px;}
#header .sp {display:none;}


@media only screen and (max-width: 980px) {
	#header .kv{
		height: 120.4vw;
	}
	#header .kv .pop1{
		width: 40.5vw;
		display: block;
		position: absolute; left: 7.2vw; top: 65.5vw;
	}
	#header .kv .pop2{
		width: 40.5vw;
		display: block;
		position: absolute; right: 7.22vw; top: 65.5vw;
	}
	#header .kv .pop1 img,
	#header .kv .pop2 img{
		width: 100%; height: auto;
	}
}
@media only screen and (min-width: 641px) and (max-width: 980px) {
	#header .m1 {width:31%;}
	#header .m2 {width:21%;}
	#header .m3 {width:20%;}
	#header .m4 {width:22%;}
}
@media only screen and (max-width: 640px) {
	#header .menu {
		padding:0 10px;
	}
	#header .m1 {width:50%;}
	#header .m2 {width:50%;}
	#header .m3 {width:50%;}
	#header .m4 {width:50%;}
	#header .sp {display:block;}
	#header .pc {display:none;}
}


/*=================================================
 main
--------------------------------------------------- */
#main {
	width:100%; max-width:980px;
	margin:0 auto;
}
#container {
	margin:0 15px;
	background:#FFF;
}
.block {
	padding:0 9%;
	position:relative;
}
.block-wrap {
	padding: 1.5em 9% 2em 10%;
}
.block .icon {
	width:4.35%; max-width:27px;
	position:absolute; left:-6px; top:0;
}
.block h2 {
	margin-bottom: 5px;
	font-size:23px; line-height:43px; font-weight:normal;
	border-bottom: #000 1px solid;
}

@media only screen and (max-width: 640px) {
	#container {
		margin:0 10px;
	}
	.block {
		padding:0 7%;
	}
	.block-wrap {
		padding:1em 0 2em 0;
	}
	.block h2 {
		font-size:15px; line-height:22px;
	}
}

/* #news
-------------------------------------- */
#news {
	padding-top:47px;
}
#news .box {
	border-bottom:#898989 1px dotted;
}
#news .title {
	padding:15px 25px 13px 28px;
	display:table;
}
#news .date {
	width:108px;
	display:table-cell;
	line-height:20px;
}
#news .text {
	padding-left:40px;
	text-indent:-40px;
	display:table-cell;
	line-height:20px;
}
#news .text img{
	margin-right:15px;
	position:relative; top:4px;
}
#news .news_detail {
	margin:0 0 11px 28px; padding:15px 40px;
	background:#dcdcdc;
	position:relative;
	display:none;
}
#news .news_detail .close {
	position:absolute; right:26px; bottom:1px;
	cursor:pointer;
}
#news a:link, #news a:visited {color:#0073cc; text-decoration:none;}
#news a:hover, #news a:active {color:#e60012; text-decoration:underline;}
#news a.on:link, #news a.on:visited {color:#e60012; text-decoration:none; font-weight:bold;}
#news a.on:hover, #news a.on:active {color:#e60012; text-decoration:underline; font-weight:bold;}
#news .news_detail a:link, #news .news_detail a:visited {color:#ff1a1a; text-decoration:underline;}
#news .news_detail a:hover, #news .news_detail a:active {color:#e60012; text-decoration:underline;}

@media only screen and (max-width: 640px) {
	#news {
		padding-top:20px;
	}
	#news .title {
		padding:10px 10px 8px 18px;
		display:block;
	}
	#news .date {
		width:100%;
		display:block;
	}
	#news .text {
		display:block;
	}
	#news .news_detail {
		margin:0 0 10px 18px; padding:10px 15px 20px 15px;
	}
}

#news .hanabi_mv{
    position:relative;
    width:100%;
    height:0;
    padding-top:75%;
}

#news .hanabi_mv iframe{
   position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

/* .title
-------------------------------------- */
.title1{
	padding:0 9%; margin-top: 20px;
	position: relative;
}
.title1 span{
	padding: 2px 0 0 16px;
	display: block;
	background-color: #000;
	font-size: 20px; line-height: 38px; color: #FFF; font-weight: normal;
}
.title1#collection{
	margin: 84px 0 25px 0; padding-top: 116px;
}
.title1#springfesta{
	margin: 0 0 25px 0; padding-top: 116px;
}
.title1#collection span,
.title1#springfesta span{
	padding-left: 135px;
}
.title1#collection img,
.title1#springfesta img{
	position: absolute; left: 0; top: 0;
}
.title2{
	padding-top: 2px; padding-left: 20px; margin-top: 10px;
	background-color: #dcdcdc;
	font-size: 18px; line-height: 1.8; font-weight: normal;
}
.title3{
	padding-top: 2px; padding-left: 5px;
	background-color: #e3d9a6;
	line-height: 22px;
}

@media only screen and (max-width: 640px) {
	.title1 {
		padding:0 7% 0 7%;
	}
	.title1 span{
		font-size: 2.93vw; line-height: 2;
	}
	.title1#collection{
		margin: 10vw 0 25px 0; padding-top: 16vw;
	}
	.title1#springfesta{
		margin: 0 0 25px 0; padding-top: 16vw;
	}
	.title1#collection span,
	.title1#springfesta span{
		padding-left: 21vw;
	}
	.title1#collection img,
	.title1#springfesta img{
		width: 26vw;
		position: absolute; left: 0; top: 0;
	}
	.title2{
		font-size: 15px;
	}
}

/* .outline
-------------------------------------- */
.outline dl{
	width:100%;
	margin:0; padding:0;
	font-weight:normal;
}
.outline dt{
	width:6em;
	margin:0; padding:0;
	clear:left; float:left;
}
.outline dd{
	margin:0 0 0 6em; padding:0;
}
.outline dl.sizeL{
	font-size: 18px; font-weight:bold;
}
.outline dd .mass{
	width: 40%;
	display: inline-block; vertical-align: top;
}
.outline .box{
	padding: 15px 5px;
}
.ticket-table{
	margin-bottom: 10px;
	border-collapse: collapse;
	line-height: 1.33;
}
.ticket-table th,
.ticket-table td{
	padding: 7px 30px 5px 30px;
	border: #000 1px solid;
	text-align: center;
}
.ticket-table th  {
	background-color: #f5f2e2;
	font-weight: normal;
}
.ticket-table span{
	font-size: 12px;
}

@media only screen and (max-width: 640px) {

	.outline dt{
		width:100%;
		float:none;
	}
	.outline dd{
		margin:0;
	}
	.outline dl.sizeL{
		font-size: 15px;
	}
	.outline .box{
		padding: 10px 0;
	}
}

/* .pagetop
-------------------------------------- */
.pagetop {
	height:23px;
	margin:70px 8% 0 9%; padding-bottom:10px;
	position:relative;
}
.pagetop p {
	width:120px; height:23px;
	margin:0; padding:0;
	position:absolute; right:0; top:0;
	font-size:12px; line-height:23px; text-align:left;
}
.pagetop p img {
	position:absolute; left:0; top:0;
}
.pagetop p a {
	width:85px; height:23px;
	padding-left:35px;
	display:block;
}
.pagetop a:link, .pagetop a:visited {color:#8e8e8e; text-decoration:none;}
.pagetop a:hover, .pagetop a:active {color:#e60012; text-decoration:underline;}


/*=================================================
 footer
--------------------------------------------------- */
#footer {
	margin:0 15px; padding:15px 0;
	background:#242424;
	border-right:#7f7f7f 1px solid; border-left:#7f7f7f 1px solid;
	font-size:12px; line-height:20px; text-align:center; color: #FFF;
}
@media only screen and (max-width: 640px) {
	#footer {
		margin:0 10px; padding:5px 0;
		font-size:10px; line-height:14px;
	}
}

/* 
--------------------------------------------------- */

/* h
--------------------------*/
h1,h2,h3,h4,h5,h6,ul,li,p {margin:0; padding:0;}


/* font
--------------------------*/
.fs20 {font-size:20px;}
.fs12 {font-size:12px;}

@media only screen and (max-width: 640px) {
	.fs20 {font-size:16px;}
}

a:link, a:visited {color:#0073cc; text-decoration:underline;}
a:hover, a:active {color:#e60012; text-decoration:underline;}

.fw-b  {font-weight:bold;}
.fw-n  {font-weight:normal;}
.red   {color:#cc0000;}

/* align
--------------------------*/
.alignC {text-align:center !important;}
.alignL {text-align:left !important;}
.alignR {text-align:right !important;}

/* float
--------------------------*/
.floatR {float:right;}
.floatL {float:left;}
.floatN {float:none;}
.clearR {clear:right;}
.clearL {clear:left;}

/* module
--------------------------*/
.clearfix:after {
	display: block;
	clear: both;
	content: "";
}
.pagetop {
	text-align:right;
}
.link-opacity:hover {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	opacity: 0.8;
}

/* margin / padding
--------------------------*/

.mg0  {margin:0 !important;}
.mg5  {margin:5px !important;}
.mg10 {margin:10px !important;}
.mg15 {margin:15px !important;}
.mg20 {margin:20px !important;}
.mg25 {margin:25px !important;}
.mg30 {margin:30px !important;}
.mg35 {margin:35px !important;}
.mg40 {margin:40px !important;}
.mg45 {margin:45px !important;}
.mg50 {margin:50px !important;}

.pd0  {padding:0 !important;}
.pd5  {padding:5px !important;}
.pd10 {padding:10px !important;}
.pd15 {padding:15px !important;}
.pd20 {padding:20px !important;}
.pd25 {padding:25px !important;}
.pd30 {padding:30px !important;}
.pd35 {padding:35px !important;}
.pd40 {padding:40px !important;}
.pd45 {padding:45px !important;}
.pd50 {padding:50px !important;}

.mgL5  {margin-left:5px !important;}
.mgL10 {margin-left:10px !important;}
.mgL15 {margin-left:15px !important;}
.mgL20 {margin-left:20px !important;}
.mgL25 {margin-left:25px !important;}
.mgL30 {margin-left:30px !important;}
.mgL35 {margin-left:35px !important;}
.mgL40 {margin-left:40px !important;}
.mgL45 {margin-left:45px !important;}
.mgL50 {margin-left:50px !important;}
.mgR5  {margin-right:5px !important;}
.mgR10 {margin-right:10px !important;}
.mgR15 {margin-right:15px !important;}
.mgR20 {margin-right:20px !important;}
.mgR25 {margin-right:25px !important;}
.mgR30 {margin-right:30px !important;}
.mgR35 {margin-right:35px !important;}
.mgR40 {margin-right:40px !important;}
.mgR45 {margin-right:45px !important;}
.mgR50 {margin-right:50px !important;}
.mgT0  {margin-top:0px !important;}
.mgT5  {margin-top:5px !important;}
.mgT10 {margin-top:10px !important;}
.mgT15 {margin-top:15px !important;}
.mgT20 {margin-top:20px !important;}
.mgT25 {margin-top:25px !important;}
.mgT30 {margin-top:30px !important;}
.mgT35 {margin-top:35px !important;}
.mgT40 {margin-top:40px !important;}
.mgT45 {margin-top:45px !important;}
.mgT50 {margin-top:50px !important;}
.mgB0  {margin-bottom:0px !important;}
.mgB5  {margin-bottom:5px !important;}
.mgB10 {margin-bottom:10px !important;}
.mgB15 {margin-bottom:15px !important;}
.mgB20 {margin-bottom:20px !important;}
.mgB25 {margin-bottom:25px !important;}
.mgB30 {margin-bottom:30px !important;}
.mgB35 {margin-bottom:35px !important;}
.mgB40 {margin-bottom:40px !important;}
.mgB45 {margin-bottom:45px !important;}
.mgB50 {margin-bottom:50px !important;}

.pdL5  {padding-left:5px !important;}
.pdL10 {padding-left:10px !important;}
.pdL15 {padding-left:15px !important;}
.pdL20 {padding-left:20px !important;}
.pdL25 {padding-left:25px !important;}
.pdL30 {padding-left:30px !important;}
.pdL35 {padding-left:35px !important;}
.pdL40 {padding-left:40px !important;}
.pdL45 {padding-left:45px !important;}
.pdL50 {padding-left:50px !important;}
.pdR5  {padding-right:5px !important;}
.pdR10 {padding-right:10px !important;}
.pdR15 {padding-right:15px !important;}
.pdR20 {padding-right:20px !important;}
.pdR25 {padding-right:25px !important;}
.pdR30 {padding-right:30px !important;}
.pdR35 {padding-right:35px !important;}
.pdR40 {padding-right:40px !important;}
.pdR45 {padding-right:45px !important;}
.pdR50 {padding-right:50px !important;}
.pdT0  {padding-top:0px !important;}
.pdT5  {padding-top:5px !important;}
.pdT10 {padding-top:10px !important;}
.pdT15 {padding-top:15px !important;}
.pdT20 {padding-top:20px !important;}
.pdT25 {padding-top:25px !important;}
.pdT30 {padding-top:30px !important;}
.pdT35 {padding-top:35px !important;}
.pdT40 {padding-top:40px !important;}
.pdT45 {padding-top:45px !important;}
.pdT50 {padding-top:50px !important;}
.pdB0  {padding-bottom:0px !important;}
.pdB5  {padding-bottom:5px !important;}
.pdB10 {padding-bottom:10px !important;}
.pdB15 {padding-bottom:15px !important;}
.pdB20 {padding-bottom:20px !important;}
.pdB25 {padding-bottom:25px !important;}
.pdB30 {padding-bottom:30px !important;}
.pdB35 {padding-bottom:35px !important;}
.pdB40 {padding-bottom:40px !important;}
.pdB45 {padding-bottom:45px !important;}
.pdB50 {padding-bottom:50px !important;}
.pdB60 {padding-bottom:60px !important;}
.pdB85 {padding-bottom:85px !important;}

@media only screen and (max-width: 640px) {
	.pdB20 {padding-bottom:15px !important;}
	.pdB60 {padding-bottom:30px !important;}
	.pdB85 {padding-bottom:40px !important;}
}