@charset "UTF-8";
/* CSS Document */
body#newyear .container{background:url("images/bk_body.jpg?02") top center no-repeat; background-size:cover; background-attachment:fixed; text-align:center;}

#newyear .price{text-align:center;}
#newyear #pagetitle {margin-top:-100px;}
/*スライドショー*/
#newyear #cover{width:100%; padding:0; text-align: center;}
#newyear #cover .message{text-align:center;}
#newyear #slideshow{ position:relative; margin:50px auto; width: 1000px; padding:0; }
#newyear #slideshow h2#title{ position:absolute; top:0; left:0; right:0; bottom:0; margin:0 auto; z-index:500;}
#newyear #slideshow ul.slider li{ margin:-20px auto 0;}
#newyear #slideshow ul.slider li img{ margin:0px auto 30px; z-index:100; width:900px; height:auto;
	-webkit-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 20px 20px rgba(0,0,0,0.3);
  -moz-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 20px 20px rgba(0,0,0,0.3);
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 20px 20px rgba(0,0,0,0.3);}
#newyear #slideshow ul.slider li .message{display:block;}
#newyear .bx-wrapper .bx-pager{ padding-top:0;}
#newyear .bx-wrapper .bx-pager.bx-default-pager a{ background:#000024;}
#newyear .bx-wrapper .bx-pager.bx-default-pager a.active{ background:#da3a2a;}


/*カレンダー日付*/
#newyear ul.square:after { content:""; display:table; clear:both;}
#newyear ul.square>li{ display:inline-block; width:376px; margin:12px; padding:0; position:relative; vertical-align:top;}
#newyear ul.square>li .image img{width:100%;}

#newyear ol.date{position:absolute; top:0; left:0;}
#newyear ol.date li,div.date{text-align:center; color:#fff; display:inline-block; padding:20px 30px;}
#newyear .date p{ font-size:250%; font-weight:bold; margin:0 auto; line-height:100%;}
#newyear .date span{ margin:20px 0 0; line-height:100%; display:block;}
#newyear ul.square li ol.date{position:absolute; top:0; left:0;}
#last_year .date{ background:#000024;}
#next_year .date{ background:#da3a2a;}
#newyear #eve .date>p{ font-size:400%;}

/*時計*/
#newyear section{text-align:center; position:relative; }
#newyear section.block{padding:0 0 50px; position:relative; margin:20px auto 50px; max-width:1200px;}
#newyear section.block .message{color:#fff;}
#newyear .time{margin:0 auto;}
#newyear #eve .time .message{color:#fc3!important;}
#newyear #next_year .time .message{color:#da3a2a!important;}
#newyear .time img{width:60px;}

/*イベント情報*/
#newyear table{ background:#fff; display:block; padding:20px; width:100%; background:url(images/bk_wood02.jpg) top center repeat;}
#newyear table tr td{ padding:6px; }
#newyear table .time{ color:#000;}
/*予約マーク*/
#newyear .mark{ background:#da3a2a; border-radius:0; margin:0 10px 0 0; padding:0 4px; color:#fff;}
#newyear .mark.off{ border:1px solid #333; background:transparent !important; text-decoration:none; color:#333;}
#newyear section.block .mark{padding:4px 12px; color:#fff; font-size:100%; letter-spacing:0.1em;}
#newyear #last_year section.block .mark{background:#000023;}
#newyear section.block .mark.off{ border:1px solid #fff;}


/*ボタン・リンク*/
#newyear .btn a{background:#fff; padding:12px 50px; color:#003; margin:20px auto 0; position:relative; border-radius: 2px;
    -webkit-box-shadow: 0 10px 30px rgba(0,0,0,0.19), 0 15px 20px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 10px 30px rgba(0,0,0,0.19), 0 15px 20px rgba(0,0,0,0.3);
    box-shadow: 0 10px 30px rgba(0,0,0,0.19), 0 15px 20px rgba(0,0,0,0.3);}
#newyear .btn a,#newyear .contents a{ color:#003;}
#newyear .btn a:hover{ font-weight:800;}
#newyear ul.square>li .btn{ margin:0; text-align:left;}
#newyear ul.square>li .btn a{ padding:6px 12px; margin:4px 0; box-shadow:none; border-radius:2px;}

/*ゆく年パート*/
#last_year{background-image: linear-gradient(45deg, #000024 25%, transparent 25%, transparent 75%, #000024 75%),
      linear-gradient(45deg, #000024 25%, transparent 25%, transparent 75%, #000024 75%); /* 市松模様になるようグラデーションで単色を入れる */
  background-position: 0 0, 20px 20px;  /* 「0 0」と1マス（1色）の大きさ「30px 30px」をそれぞれ指定 */
  background-size: 40px 40px;           /* 1マス分の倍の大きさを指定「60px 60px」 */
  background-color:rgba(0,0,36,0.5); padding:0 50px 50px; text-align: center;}

/*大晦日パート*/
#eve{margin:100px auto 50px; padding:0; background-color:rgba(0,0,36,0); background:linear-gradient(0deg, rgba(0,0,36,1) 0%, rgba(0,0,36,0.5)100%);}
#eve #takiviva{margin-bottom:100px; color:#fff!important;}
#eve #takiviva .message {line-height:2.5!important;}
#eve #takiviva .message span{background:#000023; padding:6px 10px; margin:0 10px; border-bottom:2px solid #fc3;}
#eve #takiviva .map{position:relative; margin-top:50px;}
#yatai{background:url("images/bk_yatai02.jpg?02") center center no-repeat; background-size:cover; margin-top:100px;}
#yatai>div{margin:30px auto; text-align:center; }
#yatai .gridList{display:grid; grid-template-columns:repeat(3,300px); grid-gap:30px; justify-content:center;}
#bingo{background:url("images/bk_bingo.jpg") center center no-repeat; background-size:cover;}
#soba{background:url("images/bk_soba02.jpg") top center no-repeat; background-size:cover;}
section.block#theatre{padding-bottom:0;}
#newyear section.block#countdown{background:url("images/bk_countdown.jpg") center center no-repeat; background-size:cover; margin-bottom:0; padding:0 0 30px;}
#countdown .message{color:#fff;}

/*くる年パート*/
#next_year{background-image: linear-gradient(45deg, #fff 25%, rgba(255 255 255/0.2) 25%, rgba(255 255 255/0.2) 75%, #fff 75%),
      linear-gradient(45deg, #fff 25%, rgba(255 255 255/0.2) 25%, rgba(255 255 255/0.2) 75%, #fff 75%); /* 市松模様になるようグラデーションで単色を入れる */
  background-position: 0 0, 20px 20px;  /* 「0 0」と1マス（1色）の大きさ「30px 30px」をそれぞれ指定 */
  background-size: 40px 40px;           /* 1マス分の倍の大きさを指定「60px 60px」 */
  background-color:rgba(255,255,255,0.3); padding:10px 50px 50px; margin-top:350px;}
#next_year h2.headline {margin-top:-310px;}
#newyear section#mochi{background:url("images/bk_mochi.jpg") center center no-repeat; background-size:cover; padding:0;}
#mochi .illust{margin:-80px 0 0 110px;}
#newyear section#sunrise{background:url("images/bk_sunrise.jpg") center center no-repeat; background-size:cover; /*margin:100px auto 0; */padding:0 0 150px 0;}

/*2025ADD*/
#newyear section#zoni{background:url("images/bk_zoni.jpg") center center no-repeat; background-size:cover; padding:0 0 150px 0;}
#zoni .illust{margin:-80px 0 0 110px;}
#newyear section#mochitsuki{background:url("images/bk_mochitsuki.jpg?002") center center no-repeat; background-size:cover; padding:0 0 150px 0;}
#mochitsuki .illust{margin:-80px 0 0 110px;}




/*2023-24パート*/
#year2324{background-image: linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%),
      linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%); /* 市松模様になるようグラデーションで単色を入れる */
  background-position: 0 0, 20px 20px;  /* 「0 0」と1マス（1色）の大きさ「30px 30px」をそれぞれ指定 */
  background-size: 40px 40px;           /* 1マス分の倍の大きさを指定「60px 60px」 */
  background-color:rgba(255,255,255,0.3); padding:10px 50px 50px; margin-top:50px;}

ul.frexList {display: flex; flex-wrap:wrap; justify-content:center; gap:20px 30px; margin: 20px auto;}
ul.frexList li {position:relative; flex-basis:18%; min-width:300px; background:url(images/bk_wood02.jpg) top center repeat; padding:0 0 20px;}
ul.frexList li p.image{overflow:hidden; margin-bottom:20px;}
ul.frexList li p.image img{ margin-bottom:0; width:100%;}
ul.frexList li a:hover img{ transform: scale(1.1,1.1); transition:0.5s all;}

#workshopkit{margin-top:50px;}
#workshopkit ul.frexList li{background:#fc3;}

/*ふわっと浮かぶアニメーション*/
.cut{ position:absolute; z-index:600;}
.cut#pair{ top:20px; right:150px;}
.cut#trio{ bottom:-30px; left:-80px;}
.cut#cut03{ bottom:0; right:0;}
.cut#cut04{ bottom:0; right:-50px;}

.list-mv07{opacity:0;　transform:translate(0,60px); -webkit-transform:translate(0,60px); transition: .8s; }
.mv07{ opacity: 1.0; transform: translate(0,0);  -webkit-transform: translate(0,0);}


@media(max-width:640px ){
body#newyear .container{background:url("images/bk_body_sp.jpg") top center repeat-y; background-size:100%; background-attachment:fixed;}
#newyear .wrapper{width:100%;}
#newyear .contents{padding:0 0 30px;}
#newyear .contents#last_year{ margin-top:-1px;}
#newyear .contents#next_year{ padding-top:10px; margin-top:380px;}
#newyear .contents#year2324{ padding:30px 0 50px; background-color:rgba(255,255,255,0.5); margin-top:30px;}
#newyear #slideshow{width:100%; margin-bottom:0; background:linear-gradient(0deg, rgba(0,0,36,1) 0%, rgba(0,0,36,0.5)100%);}
#newyear #slideshow ul.slider li img{ width:100%;}
#newyear #slideshow ul.slider li .image{ margin:0 5%;}
#newyear #slideshow ul.slider li .message{text-align:left; padding:0 4% 30px; color:#fff;}

#eve {padding:0 4%;}
#newyear ul.square>li{ width:85%; margin:0 auto;}

#yatai .gridList{grid-template-columns:repeat(2,44%); grid-gap:20px 5%;}	
#yatai .gridList li img{width:100%;}	

#newyear section.block#countdown{padding-bottom:0;}

.cut#pair{ display:none;}
.cut#trio{ display:none;}
.cut#cut03{ position:relative; top:0; left:0; right:0; bottom:0;}
.cut#cut04{ display:none;}
#mochi .illust{margin:-50px 0 0 0;}
#mochi .illust img{width:100%;}

#newyear section#zoni{background:url("images/bk_zoni_sp.jpg") center center no-repeat;padding:0 0 250px 0;}
#newyear section#mochitsuki{background:url("images/bk_mochitsuki_sp.jpg") center center no-repeat;padding:0 0 250px 0;}
#mochitsuki .illust{margin:-80px 0 0 110px;}



}