@charset "utf-8";

/* ================ Reset ================= */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, var,b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;box-sizing: border-box;font-weight: normal;font-style: normal;}
body {
	height: 100%;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
	font-optical-sizing: auto;
	font-size: 17px;
	color: #000;
	letter-spacing: 0;
}

html{
	overflow-x: hidden;
	overflow-y: scroll;
}
body{
	padding-right: 0!important;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section {
	display:block;
}
nav ul, ul, nav ol, ol {
	list-style:none;
}
blockquote, q {
	quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}
a {
	margin:0;
	padding:0;
	border:0;
	vertical-align:baseline;
	background:transparent;
	-webkit-tap-highlight-color:transparent;
	-webkit-tap-highlight-color:rgba( 100, 100, 100, 0.5 );
	text-decoration: none;
	color: #000;
}
a, a:before, a:after{
	-webkit-transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1)
}
a:hover {
	transform: scale(1.04);
}

button {
	-webkit-transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1)
}
img{
	vertical-align: bottom;
	border: 0;
	max-width: 100%;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
input, select {
	vertical-align:middle;
}
.cf:before,
.cf:after {
	content: " ";
	display: table;
}
.cf:after {
	clear: both;
}
.cf {
	*zoom: 1;
}

/* =================== */
.wrapper .pc_l,
.wrapper .pc_r{
	display: none;
}

.view_area{
	background: #fff;
	overflow-x: hidden;
	position: relative;
	font-size: 4.8vw;
}
.kv{
	background: url("../img/bg_kv.png") top center no-repeat #ff2e07;
	background-size: 100% auto;
	position: relative;
}
.kv .inner{
	padding: 18px 0 0;
	margin: 0 0 8%;
	position: relative;
}
.kv .inner .img{
	margin: -20% 0 0 0;
}


.kv .logo{
	width: calc((146/828)*100%);
	margin: 0 auto 5%;
}
.kv .th01{
	width: calc((100/828)*100%);
	position: absolute;
	top: 5%;
	left: 2%
}
.kv .th02{
	width: calc((86/828)*100%);
	position: absolute;
	top: 3%;
	left: 23%
}
.kv .th03{
	width: calc((134/828)*100%);
	position: absolute;
	top: 3%;
	right: 1%;
}

.kv h2 span{
	display: block;
}
.kv h2 .ttl01{
	width: calc((488/828)*100%);
	margin: 0 auto 2%;
}
.kv h2 .ttl02{
	width: calc((632/828)*100%);
	margin: 0 auto 1%;
}
.kv h2 .ttl03{
	width: calc((814/828)*100%);
	margin: 0 auto 3%;
}
.kv h2 .ttl04{
	width: calc((480/828)*100%);
	margin: 0 auto;
}

.kv nav{
	padding: 0 0 1%
}
.kv nav li{
	margin: 0 0 2%;
}



.ceremony{
	background-image: url("../img/bg_ceremony01.png"),url("../img/bg_ceremony02.png");
	background-position: top center;
	background-repeat: no-repeat,repeat-y;
	background-size: 100% auto;
	padding: 0 0 30% 0;
}
.ceremony h3{
	padding: 30% 0 0 0;
	margin: 0 auto 3%;
}
.ceremony .fin{
	margin: 0 auto 5%;
	display: flex;
	justify-content: center;
}

.ceremony .fin span{
	display: inline-block;
	justify-content: center;
	border:3px solid #000;
	padding: 2%;
	font-weight: 600;
}

.ceremony .txt{
	margin: 5% 8% 10%;
	line-height: 2;
	font-weight: 600;
/*	font-size: 20px;*/
}
.ceremony .cloud01{
	width: calc((295/828)*100%);
	position: absolute;
	right: -12%;
	margin: -7% 0 0 0;
}
.ceremony h4{
	width: calc((476/828)*100%);
}
.ceremony .img04{
	width: calc((690/828)*100%);
	margin: 0 auto;
}
.ceremony .cloud02{
	width: calc((262/828)*100%);
	position: absolute;
	right: -12%
}
.ceremony .img05{
	width: calc((690/828)*100%);
	margin: 0 auto;
	padding: 10% 0 0 0;
}
.ceremony .img06{
	width: calc((690/828)*100%);
	margin: 0 auto;
}
.ceremony .cloud03{
	width: calc((262/828)*100%);
	position: absolute;
	left: -12%
}




.special{
	background: url("../img/bg_special01.png") top center no-repeat;
	background-size: cover;
	padding: 15% 0 30%;
	position: relative;
}
.special h5{
	font-size: 6vw;
	text-align: center;
	margin: 0 0 5%;
	font-weight: 700;
	letter-spacing: 3px;
}
.special h5 span{
	display: inline-block;
	width: 25px;
	margin: 0 25px;
}

.special .txt{
	margin: 0 8%;
	line-height: 2;
}
.special .txt b{
	color: #ffff48;
}
.special .hash{
	margin: 2% 8%;
}

.special .box01{
	color: #fff;
	padding: 0 0 10%;
}
.special .box02{
	background: url("../img/bg_special02.png") top center no-repeat;
	background-size: cover;
	padding: 10% 0;
}
.special .box02 h5{
	width: calc((536/828)*100%);
	margin: 0 auto 5%;
}
.special .box02 .img{
	width: calc((676/828)*100%);
	margin: 0 auto 5%;
}
.special .box02 .notice{
	display: flex;
	justify-content: center;
	font-size: 14px;
}
.special .box03{
	color: #fff;
	padding: 15% 0 0 0;
}
.special .box03 .txt{
	margin: 0 8% 10%;
}
.special .box03 .img{
	width: calc((566/828)*100%);
	margin: 0 auto 10%;
}
.special .box03 .lottery{
	background-image: url("../img/line01.png"),url("../img/line01.png");
	background-position: top center, bottom center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	width: calc((692/828)*100%);
	margin: 0 auto;
}
.special .box03 .lottery p{
	padding: 5% 0;
	text-align: center;
	line-height: 2;
}
.special .box03 .cloud01{
	width: calc((262/828)*100%);
	position: absolute;
	right: -5%;
	bottom: -15px;
}
.info{
	background: url("../img/bg_info.png") bottom center no-repeat;
	background-size: 100% auto;
	padding: 15% 0 6%
}
.info .inner{
	background: url("../img/bg_info-inner.png") top center no-repeat;
	background-size: 100% 100%;
	width: calc((726/828)*100%);
	margin: 0 auto 10%;
	padding: 15% 0;
	text-align: center;
}
.info .inner dl{
	margin: 0 8%;
}
.info .inner dt{
	color: #7a4c9b;
	margin: 0 0 3%;
	font-size: 6vw;
}
.info .inner dd{
	font-size: 6vw;
	margin: 0 0 10%;
	padding: 0 0 10%;
	background: url("../img/line02.png") bottom center no-repeat;
	background-size: 100% auto;
}
.info .inner .txt{
	font-size: 6vw;
	font-weight: 500;
	letter-spacing: 3px;
	background: #d63c00;
	color: #fff;
	display: inline-block;
	padding: 6px 30px;
}

.info .cloud01{
	width: calc((350/828)*100%);
	left: 5%;
	position: relative;
}


#centennialbouquet{
	background: #ff2800;
	position: relative;
	padding: 0 0 30%;
	margin: 0;
}
#centennialbouquet h3{
	position: absolute;
	top: 2.5%;
	left: 0
}
#centennialbouquet .txt_box{
	border:4px solid #000;
	background: #fff;
	padding: 5% 5% 8%;
	margin: -20% 5% 0;
	position: relative;
}
#centennialbouquet .txt_box p{
	font-size: 4.3vw;
	font-weight: 500;
}
#centennialbouquet .txt_box a{
	display: block;
	width: calc((480/828)*120%);
	position: absolute;
	bottom: -40px;
	left: 50%;
	transform: translateX(-50%);
}
#centennialbouquet .txt_box a:after{
	content: "";
	display: block;
	background: #2a2a2a;
	width: calc((100/828)*100%);
	height: 50%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 10%;
	animation: btn_cb 1s steps(1) infinite;
}
@keyframes btn_cb{
	0%,100%{opacity:1}
	50%{opacity:0}
}



#spicyderby{
	background: #ff2800;
	position: relative;
	padding: 0 0 30%;
	margin: 0;
}
#spicyderby h3{
	position: absolute;
	top: 2.5%;
	left: 0
}
#spicyderby .txt_box{
	border:4px solid #000;
	background: #fff;
	padding: 5% 5% 8%;
	margin: -20% 5% 0;
	position: relative;
}
#spicyderby .txt_box p{
	font-size: 4.3vw;
	font-weight: 500;
}
#spicyderby .txt_box a{
	display: block;
	width: calc((480/828)*120%);
	position: absolute;
	bottom: -40px;
	left: 50%;
	transform: translateX(-50%);
}
#spicyderby .txt_box a:after{
	content: "";
	display: block;
	background: #2a2a2a;
	width: calc((100/828)*100%);
	height: 50%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 10%;
	animation: btn_cb 1s steps(1) infinite;
}



.footer hr{
	display: none;
}
.footer img {
	display: block;
	width: 100%;
	height: auto;
	will-change: transform;
}
.footer-share {
	width: 91.0628019324%;
	margin: 16.9082125604% auto
}
.footer-share--head {
	width: 46.9806763285%;
	margin: 0 auto 5.0724637681%
}
.footer-share-links {
	display: flex;
	justify-content: center
}
.footer-share--link {
	width: 15.0966183575%;
	margin: 0 4.4685990338%
}
@media (any-hover: hover) {
	.footer-share--link a img {
		transition: -webkit-transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99);
		transition: transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99);
		transition: transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99), -webkit-transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99)
	}
	.footer-share--link a:hover img {
		-webkit-transform: scale(1.1);
		transform: scale(1.1)
	}
}

.footer-content {
	display: flex;
	flex-wrap: wrap;
	width: 91.0628019324%;
	margin: 0 auto
}
.footer-info {
	width: 91.0628019324%
}
.footer-info--head {
	width: 22.5845410628%;
	margin: 0 0 3.6231884058% 0
}
.footer-info-data {
	display: flex;
	font-size: 3.4vw;
	line-height: 1.25;
	margin: 0 0 1em 0
}
.footer-info-data span:nth-child(1) {
	width: 4.5em
}
.footer-sns {
	width: 91.0628019324%;
	margin: 0 auto
}
.footer-sns--head {
	width: 22.3429951691%;
	margin: 18.115942029% auto 4.347826087%
}
.footer-sns-links {
	display: flex;
	justify-content: center
}
.footer-sns--link {
	width: 14.7342995169%;
	margin: 0 2.4154589372%
}
@media (any-hover: hover) {
	.footer-sns--link a img {
		transition: -webkit-transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99);
		transition: transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99);
		transition: transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99), -webkit-transform 0.25s cubic-bezier(0.13, 0.71, 0.58, 0.99)
	}
	.footer-sns--link a:hover img {
		-webkit-transform: scale(1.1);
		transform: scale(1.1)
	}
}
.footer-btns {
	display: flex;
	justify-content: space-between;
	width: 91.0628019324%;
	margin: 12.077294686% auto 15.9420289855%
}
.footer--btn {
	width: 42.8743961353%
}
.footer--bnr {
	width: 91.3043478261%;
	margin: 0 auto 10.8695652174%
}
.footer--txt {
	width: 100%;
	font-size: 3vw;
	line-height: 1.39;
	text-align: center;
	margin: 0 0 5.5555555556% 0
}
.footer--txt a{
	text-decoration: underline;
}

.footer--copyright {
	width: 100%;
	line-height: 1;
	text-align: center;
	font-size: 3vw;
	margin: 0 0 3.8647342995%
}
.footer--logo {
	background: #000;
	padding: 2.1739130435% 0 1.690821256%
}
.footer--logo>img {
	width: 23.4299516908%;
	margin: 0 auto
}
.pc_img{
	display: none;
}


/* ======================================== */
@media print, screen and (min-width: 829px){
/* =======1199px～829PC======== */
.pc{display: inline-block;}
.sp{display: none;}

.wrapper{
	position: relative;
/*  display: grid;
  grid-template-columns: 1fr 510px 33%;
  align-items: flex-start;
  z-index: 1;
*/
	background:url("../img/bg_pc.png") top center no-repeat fixed;
	background-size: cover;
}

.view_area{
	position: relative;
	width: 510px;
	z-index: 2;
	margin: 0;
	font-size: 20px;
}

.pc_wrap{
	position: relative;
	width: 510px;
	z-index: 2;
	margin: 0 0 0 20%;
}
.pc_wrap:before{
	content: "";
	display: block;
	height: 100%;
	width: 31px;
	background: url("../img/bg_view-l.png") top center repeat-y;
	background-size: 31px auto;
	position: absolute;
	top: 0;
	left: -31px
}

.pc_wrap:after{
	content: "";
	display: block;
	height: 100%;
	width: 31px;
	background: url("../img/bg_view-r.png") top center repeat-y;
	background-size: 31px auto;
	position: absolute;
	top: 0;
	right: -31px
}

.wrapper .pc_l{
	display: flex;
	align-items: center;
	align-content: center;
	flex-wrap: wrap;
	width: 400px;
	height: 100%;
	position: fixed;
	margin: 0 0 0 520px;
	top: 0;
	left:30%;
	z-index: 2;
}
.wrapper .pc_l .logo{
	width: 100px;
	margin: 0 auto 33px;
}
.wrapper .pc_l .th{
	width: 100%;
	position: relative;
}
.wrapper .pc_l .th .th01{
	width: 57px;
	position: absolute;
	top: 0;
	left: -10px
}
.wrapper .pc_l .th .th02{
	width: 42px;
	position: absolute;
	top: -70px;
	left: 50px
}
.wrapper .pc_l .th .th03{
	width: 47px;
	position: absolute;
	top: -50px;
	right: 20px
}

.wrapper .pc_l h1{
	text-align: center;
	width: 100%;
	margin: 0 0 55px;
}
.wrapper .pc_l nav{
	width: 100%;
	text-align: center;	
}
.wrapper .pc_l nav li{
	margin: 0 0 10px;
}
.kv{
	padding: 0 0 1%;
}
.kv nav{
	display: none;
}
.special h5{
	font-size: 24px;
	line-height: 1;
}
.special h5 span{
	width: 24px;
}
.info .inner dt{
	font-size: 24px;
}
.info .inner dd{
	font-size: 24px;
}
.info .inner .txt{
	font-size: 24px;
}

#centennialbouquet .txt_box p,
#spicyderby .txt_box p{
	font-size: 22px;
	margin: 0 0 20px;
	letter-spacing: -1px;
}

.footer-info-data{
	font-size: 15px;
}
.footer--txt{
	font-size: 15px;
}
.footer--copyright{
	font-size: 14px;
}



}


@media print, screen and (min-width: 1199px){
/* =======1200px～PC======== */
.pc{display: inline-block;}
.sp{display: none;}



/* ======PC=======*/}