@charset "utf-8";

/******************************************************************** structure
*/

.rizinHeadView { background: url(../rizin/img/rizin_image_bg.png) #000 no-repeat 50% 85%; background-size: 1200px auto; padding-bottom: 800px; position: relative;}
.rizinHeadView .inner { max-width: 1200px; padding: 100px 50px 0;}
.rizinHeadView .inner p { padding: 0; text-align: center;}
.rizinHeadView .image { position: absolute; left: 0; width: 100%; text-align: center; bottom: 0;}
.rizinHeadView .image img { width: 1200px;}

.rizinHeadAllView { background: #000; color: #fff; padding-top: 90px; padding-bottom: 50px;}
.rizinHeadAllView .inner { max-width: 1200px;}
.rizinHeadAllView p.image { padding-bottom: 60px;}
.rizinHeadAllView p:last-child { padding-top: 30px;}

.rizinView { padding-bottom: 70px;}
.rizinView .inner { max-width: 1200px; padding: 0 20px;}
.rizinView p { text-align: center;}
.rizinView p.text { font-size: 60px; line-height: 1;}
.rizinView p.text span { font-size: 60%;}

.rizinMessageView { padding-bottom: 5px; background: #111; color: #fff; padding-top: 5px;}
.rizinMessageView h2 { text-align: center; font-size: 44px; margin: 30px 0;}
.rizinMessageView p { margin: 30px 0 5px; font-size: 16px; font-weight: 300;}
.rizinMessageView .inner { max-width: 1200px;}

.famousItemsView.rizinPickupView { padding-top: 30px; background: #111; padding-bottom: 30px;}
.famousItemsView.rizinPickupView .inner { background: none;}

.rizinContentsView { padding: 50px 0; background: #000; color: #fff;}
.rizinContentsView .inner { max-width: 1200px;}
.rizinContentsView .headerBox h2 { text-align: center; font-size: 44px;}
.rizinContentsView .headerBox p { text-align: center; padding: 0; margin: 10px 0; font-size: 18px;}
.rizinContentsView .headerBox ul { list-style: none; margin: 30px 0 50px; padding: 0; text-align: center; font-size: 18px;}
.rizinContentsView .headerBox ul li { display: inline-block; width: 49%; margin-right: 1.4%;}
.rizinContentsView .headerBox ul li:last-child { margin-right: 0;}
.rizinContentsView .headerBox a { background: #001B3F; color: #fff !important; display: block; text-decoration: none; line-height: 2.8;}
.rizinContentsView .headerBox a.fcs { background: #bf0e00; color: #fff !important; transition: background 0.3s, color 0.3s;}

.rizinContentsView .contBox { margin: 40px 0; padding: 40px; border-radius: 20px; position: relative;}
.rizinContentsView .contBox#contBox1 { background: url(../img/rizin_cont1_bg.jpg); background-size: 100% 100%;}
.rizinContentsView .contBox#contBox2 { background: url(../img/rizin_cont2_bg.jpg); background-size: 100% 100%;}
.rizinContentsView .contBox#contBox3 { background: url(../img/rizin_cont3_bg.jpg); background-size: 100% 100%;}
.rizinContentsView .contBox dl { margin: 0; padding: 0;}
.rizinContentsView .contBox dt { font-size: 32px; font-weight: 700;}
.rizinContentsView .contBox dd { font-size: 24px; margin: 10px 0;}
.rizinContentsView .contBox .textSide { width: 48%;}
.rizinContentsView .contBox#contBox2 { padding-left: 52%;}
.rizinContentsView .contBox#contBox2 .textSide { width: auto;}
.rizinContentsView .contBox#contBox3 dt { font-size: 28px;}
.rizinContentsView .contBox#contBox3 dd { font-size: 20px;}
.rizinContentsView .contBox p { font-weight: 300; padding: 0; margin: 20px 0;}
.rizinContentsView .contBox p.catMark { position: absolute; right: 20px; top: 20px; margin: 0; font-weight: bold; background: #FFF; color: #001B3F; text-align: center; border-radius: 50%; line-height: 4; width: 4em; font-size: 18px;}
.rizinContentsView .contBox#contBox2 p.catMark { left: 20px; right: unset;}
.rizinContentsView .contBox h3 { margin: 20px 0 5px; font-size: 18px; padding: 0;}

.rizinContentsView .contBox .imageSide { position: absolute; top: 50%; transform: translateY(-50%); min-width: 48%;}
.rizinContentsView .contBox .imageSide p { padding: 0; text-align: center;}
.rizinContentsView .contBox#contBox1 .imageSide { right: 0;}
.rizinContentsView .contBox#contBox2 .imageSide { left: 0;}

.rizinContentsView .contBox#contBox1 .imageSide img { height: 650px;}

.rizinPresentView { padding: 50px 0; text-align: center;}
.rizinPresentView .inner { max-width: 1200px;}
.rizinPresentView ul { list-style: none; margin: 0 0 40px; padding: 0;}
.rizinPresentView ul li { display: inline-block; width: 48%; margin-right: 3%;}
.rizinPresentView ul li:last-child { margin-right: 0;}
.rizinPresentView ul a:hover { opacity: 0.6; transition: 0.3s;}


.rizinPresentView .eventBox { background: #000; color: #fff;}
.rizinPresentView .leftSide { float: left; width: 540px; padding: 20px 20px 0;}
.rizinPresentView .leftSide img { max-height: 740px;}
.rizinPresentView .leftSide p { padding: 0;}
.rizinPresentView .rightSide { padding: 20px 30px 0 600px; text-align: left;}
.rizinPresentView .rightSide dl { margin: 30px 0; padding: 0; font-size: 18px;}
.rizinPresentView .rightSide dl dt { float: left;}
.rizinPresentView .rightSide p { margin: 20px 0; padding: 0; font-size: 18px;}
.rizinPresentView .rightSide p.mini { font-size: 12px;}
.rizinPresentView .rightSide .attention { color: #FFBE00;}
.rizinPresentView .rightSide .box { position: relative;}
.rizinPresentView .rightSide .box p { margin: 0; padding: 0; position: absolute; right: 0; bottom: 0;}
.rizinPresentView .clearfix { border-left: 20px solid #FFBE00; border-right: 20px solid #FFBE00; border-top: 20px solid #FFBE00; padding-bottom: 5px;}
.rizinPresentView .clearfix.noBottom { padding-bottom: 0;}
.rizinPresentView .fullButton { padding: 0;}

.rizinPresentView .finishedCampaign { display: block; position: relative;}
.rizinPresentView .finishedCampaign:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.6); background-image: url(../img/finished_camaign.png); background-repeat: no-repeat; background-position: 50% 50%; background-size: contain;}
.rizinPresentView .finishedEvents { display: block; position: relative;}
.rizinPresentView .finishedEvents:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.6); background-image: url(../img/finished_events.png); background-repeat: no-repeat; background-position: 50% 50%; background-size: contain;}

.rizinPresentView .finishedEvent { display: block; position: relative;}
.rizinPresentView .finishedEvent:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.6); background-image: url(../img/finished_event.png); background-repeat: no-repeat; background-position: 50% 50%;}

.rizinPresentView .presentSlideBox ul { list-style: none; margin: 0; padding: 0;}
.rizinPresentView .presentSlideBox .bx-wrapper { margin-bottom: 0;}

.rizinReportView { padding-top: 20px;}
.rizinReportView .gTitle { margin-bottom: 20px; line-height: 1.4;}
.rizinReportView .inner { max-width: 1200px;}
.rizinReportView .leftSide { width: 48.5%; float: left;}
.rizinReportView .rightSide { width: 48.5%; float: right;}
.rizinReportView dl { margin: 20px 0; text-align: center;}
.rizinReportView dl dt { margin-bottom: 10px; font-size: 22px; font-weight: 700; color: #333; line-height: 1.3;}
.rizinReportView dl dt .plusText { font-size: 16px; font-weight: normal;}
.rizinReportView ul { list-style: none; margin: 60px 0 0; padding: 0;}
.rizinReportView ul li { display: inline-block; width: 48.5%; margin-right: 2.5%; margin-bottom: 20px;}
.rizinReportView ul li:nth-child(2n) { margin-right: 0;}
.rizinReportView ul a { display: block;}

.TokyoDome28View { padding: 10px 0 30px;}
.TokyoDome28View h2 { text-align: center; font-size: 34px; font-weight: 900; margin-bottom: 30px; line-height: 1.5;}
.TokyoDome28View .inner { max-width: 1200px;}
.TokyoDome28View .leftSide { float: left;}
.TokyoDome28View .rightSide { float: right; background: url(../rizin/img/banner_tokyodome28_bg.png) 50% 50% repeat-x; background-size: 100% auto;}
.TokyoDome28View .leftSide p,
.TokyoDome28View .rightSide p { margin: 0; padding: 0;}

@media screen and (max-width: 1400px){
	.rizinHeadView .inner { padding-top: 90px;}

	.rizinMessageView { padding-left: 20px; padding-right: 20px;}
	.rizinContentsView { padding-left: 20px; padding-right: 20px;}
}

@media screen and (max-width: 1200px){
	.rizinHeadView { background-size: 1000px auto; padding-bottom: 650px; background-position: 50% 90%;}
	.rizinHeadView .inner { padding-top: 80px;}
	.rizinHeadView .image img { width: 850px;}
	.rizinContentsView .contBox dt { font-size: 26px;}
	.rizinContentsView .contBox dd { font-size: 20px;}

	.rizinHeadAllView p { padding: 0 20px;}

	.rizinPresentView .eventBox { width: calc(100% - 20px); margin-left: auto; margin-right: auto;}
	.rizinPresentView .inner > .fullButton { width: calc(100% - 20px); margin-left: auto; margin-right: auto;}
	.rizinPresentView .clearfix { border-width: 10px;}
	.rizinPresentView .rightSide .box p { position: static; text-align: right;}

	.rizinReportView .inner { padding-left: 20px; padding-right: 20px;}
	.rizinReportView dl dt { font-size: 18px;}
	.rizinReportView dl dt .plusText { font-size: 12px;}

	.TokyoDome28View h2 { font-size: 30px;}
	.TokyoDome28View .leftSide { width: 66.67%;}
	.TokyoDome28View .rightSide { width: 30.83%;}

	.rizinContentsView .contBox .imageSide { width: 50%;}
}

@media screen and (max-width: 1050px){
	.rizinHeadView { background-size: contain; padding-bottom: 60vw;}
	.rizinHeadView .inner { padding-top: 70px;}
	.rizinHeadView .image img { width: 85vw;}

	.rizinMessageView h2 { font-size: 40px;}
	.rizinContentsView .headerBox h2 { font-size: 36px;}
	.rizinContentsView .headerBox p { font-size: 16px;}
	.rizinContentsView .contBox p { font-size: 12px;}

	.rizinHeadAllView p.image { padding-bottom: 40px;}

	.rizinHeadAllView p:last-child { padding-top: 20px;}

	.rizinPresentView .leftSide { width: calc(50% - 60px);}
	.rizinPresentView .rightSide { padding-left: 50%;}
	.rizinPresentView .rightSide p { margin: 10px 0; font-size: 14px;}
	.rizinPresentView .rightSide dl { margin: 10px 0;}

	.rizinReportView .inner { padding-left: 10px; padding-right: 10px;}
	.rizinReportView dl dt { font-size: 14px;}
	.rizinReportView .gTitle { font-size: 28px;}
	.TokyoDome28View h2 { font-size: 22px;}
}

@media screen and (max-width: 800px){
	.rizinMessageView h2 { font-size: 28px;}
	.rizinMessageView p { font-size: 14px;}
	.rizinContentsView .headerBox h2 { font-size: 28px;}
	.rizinContentsView .headerBox p { font-size: 12px;}
	.rizinContentsView .contBox .textSide { width: auto;}
	.rizinContentsView .contBox p.catMark { display: none;}

	.rizinContentsView .contBox .imageSide { display: none;}

	.rizinHeadAllView p { padding: 0 10px;}

	.rizinHeadAllView p.image { padding-bottom: 20px;}

	.rizinContentsView.rizinContentsHome { padding-top: 5px;}

	.rizinHeadAllView p:last-child { padding-top: 10px;}

	.rizinPresentView ul { padding: 0 10px;}
	.rizinPresentView ul li { display: block; margin-right: 0; padding-bottom: 20px; width: auto;}
	.rizinPresentView .presentSlideBox ul li { padding-bottom: 0;}

	.rizinPresentView .rightSide { padding: 20px;}

	.rizinPresentView .rightSide p.spOnly { text-align: center;}
	.rizinPresentView .rightSide p.spOnly img { max-height: 400px;}

	.rizinPresentView .finishedEvent:after { background-size: 70% auto;}

	.rizinContentsView .headerBox ul { font-size: 14px; margin: 20px 0;}
	.rizinContentsView .headerBox ul li { margin-right: 1%;}

	.rizinReportView ul li { margin-right: 2%;}

	.TokyoDome28View h2 { font-size: 18px;}
}

@media screen and (max-width: 640px){
	.rizinView { padding-bottom: 50px;}
	.rizinView p.text { font-size: 30px;}
	.rizinHeadView .title { margin-bottom: 40px;}
	.rizinHeadView .inner { padding-left: 5px; padding-right: 5px; padding-top: 100px;}
	.rizinHeadView .image img { width: 100%;}

	.rizinMessageView h2 { font-size: 24px; margin: 20px 0;}
	.rizinMessageView p { margin: 15px 0; font-size: 12px;}
	.rizinContentsView .headerBox h2 { font-size: 24px;}
	.rizinContentsView .headerBox p { text-align: left;}
	.rizinContentsView .headerBox ul li { margin: 10px 0; width: auto; display: block;}
	.rizinContentsView .contBox { margin: 20px 0; padding: 10px 0;}
	.rizinContentsView .contBox#contBox1,
	.rizinContentsView .contBox#contBox2 { padding: 12px;}
	.rizinContentsView .contBox#contBox2 dt { font-size: 20px; }

	.rizinContentsView .contBox dt { font-size: 24px;}
	.rizinContentsView .contBox dd { font-size: 16px; margin: 5px 0;}
	.rizinContentsView .contBox#contBox3 dt { font-size: 28px;}
	.rizinContentsView .contBox#contBox3 dd { font-size: 16px;}
	.rizinContentsView .contBox dd br { display: none;}
	.rizinContentsView .contBox h3 { font-size: 16px;}

	.rizinContentsView .buttonBlack { font-size: 14px;}
	.rizinContentsView .headerBox ul { font-size: 14px;}

	.rizinHeadAllView p.image { padding-bottom: 20px;}

	.rizinPresentView .rightSide { padding: 10px;}
	.rizinPresentView .rightSide dl { font-size: 14px;}
	.rizinPresentView .rightSide .box p.zoom { text-align: left;}
	.rizinPresentView .rightSide .box p.zoom img { width: 120px;}

	.rizinPresentView .button { font-size: 14px;}

	.rizinPresentView .eventBox2 .rightSide p.spOnly { margin-left: -10px; margin-right: -10px; border-bottom: 10px solid #FFBE00;}

	.rizinHeadAllView p { font-size: 12px;}

	.rizinReportView ul li { margin-right: 0; width: auto; display: block;}

	.rizinReportView .gTitle { font-size: 22px;}
	.rizinReportView .leftSide { width: auto; float: none;}
	.rizinReportView .rightSide { width: auto; float: none;}
	.rizinReportView dl { text-align: center;}
	.rizinReportView dl img { max-height: 400px;}

	.TokyoDome28View { padding: 0 0 10px;}
	.TokyoDome28View .inner { padding-left: 10px; padding-right: 10px;}
	.TokyoDome28View .leftSide { float: none; width: auto; margin-bottom: 10px;}
	.TokyoDome28View .rightSide { float: none; width: auto;}

	.rizinContentsView { padding-left: 10px; padding-right: 10px;}
}
