@charset "utf-8";



/* sw-MainTitle
-----------------------------------*/
.st-Content-report .sw-MainTitle{
	margin-top: 30px;
}



/* report-Content
-----------------------------------*/
.report-Content{
	background: #FBFBF5;
	padding: 60px 0;
	margin-top: 40px;
	position: relative;
}
.report-Content .inner{
	padding-bottom: 45px;
	margin: 0 15px;
	position: relative;
}
.report-Content .inner:before{
	content: "";
	width: 119px;
	height: 137px;
	background-image: url("/asset/img/ico_report_01.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0;
	display: block;
	position: absolute;
	right: 0;
	bottom: -50px;
	z-index: 2;
}
.report-Content .inner:after{
	content: "";
	width: 100%;
	height: 5px;
	border-top: 1px solid #333;
	border-bottom: 3px solid #333;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	margin: 0 auto;
}
.report-Content .head .maintitle{
	text-align: center;
	position: relative;
}
.report-Content .head .maintitle .en_hand{
	color: #E6E1B9;
	font-size: 423%;
	line-height: 1;
	display: inline-block;
	position: absolute;
	top: 50%;
	right: 0;
	left: 0;
	-webkit-transform: translate(-40px,-75%);
	transform: translate(-40px,-75%);
	opacity: 1;
}
.report-Content .head .maintitle .min{
	font-size: 138.5%;
	position: relative;
	z-index: 2;
}
.report-Content .head .text{
	font-size: 108%;
	text-align: center;
	margin: 10px auto 0;
}
.report-Content .new{
	margin: 25px auto 0;
}
.report-Content .new .image{
	width: 100%;
	height: 0;
	padding-top: 66.4%;
	position: relative;
}
.report-Content .new .image img{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.report-Content .new.interview .image:before{
	content: "";
	width: 80px;
	height: 80px;
	background-image: url("/asset/img/ico_common_09.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	z-index: 1;
}
.report-Content .new .comment{
	margin-top: 15px;
}
.report-Content .new .comment .title{
	font-size: 108%;
	font-weight: bold;
}
.report-Content .new .comment .label{
	margin-top: 10px;
}
.report-Content .new .comment .label span{
	color: #fff;
	font-size: 93%;
	background: #C9AC75;
	padding: 2px 10px;
	margin-right: 5px;
	display: inline-block;
}
.report-Content .list{
	max-width: 1280px;
	padding: 0 15px;
	margin: 45px auto 0;
}
.report-Content .list li + li{
	margin-top: 45px;
}
.report-Content .list li .image{
	width: 100%;
	height: 0;
	padding-top: 66.4%;
	position: relative;
}
.report-Content .list li .image img{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.report-Content .list li.interview .image:before{
	content: "";
	width: 80px;
	height: 80px;
	background-image: url("/asset/img/ico_common_09.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	z-index: 1;
}
.report-Content .list li .comment{
	margin-top: 15px;
}
.report-Content .list li .comment .title{
	font-size: 108%;
	font-weight: bold;
}
.report-Content .list li .comment .label{
	margin-top: 10px;
}
.report-Content .list li .comment .label span{
	color: #fff;
	font-size: 93%;
	background: #C9AC75;
	padding: 2px 10px;
	margin-right: 5px;
	display: inline-block;
}
@media only screen and (min-width: 768px){
}
@media only screen and (min-width: 1024px){
	.report-Content{
		padding: 160px 0 120px;
		margin-top: 120px;
	}
	.report-Content .inner{
		max-width: 1280px;
		padding: 0;
		margin: 0 auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	.report-Content .head{
		width: 34.4%;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		margin: 0;
	}
	.report-Content .head .maintitle .en_hand{
		font-size: 846%;
	}
	.report-Content .head .maintitle .min{
		font-size: 186%;
	}
	.report-Content .head .text{
		font-size: 123.1%;
	}
	.report-Content .new{
		width: 65.6%;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		margin: 0 0 -120px;
		-webkit-transform: translateY(-200px);
		transform: translateY(-200px);
	}
	.report-Content .new .comment .title{
		font-size: 123.1%;
	}
	.report-Content .new .comment .label span{
		font-size: 108%;
	}
	.report-Content .list{
		max-width: 1280px;
		padding: 0 15px;
		margin: 80px auto 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.report-Content .list li{
		width: calc(33.3% - 20px);
		margin-bottom: 60px!important;
	}
	.report-Content .list li + li{
		margin: 0;
	}
	.report-Content .list li .comment{
		margin-top: 15px;
	}
	.report-Content .list li .comment .title{
		font-size: 123.1%;
		font-weight: bold;
	}
	.report-Content .list li .comment .label{
		margin-top: 10px;
	}
	.report-Content .list li .comment .label span{
		color: #fff;
		font-size: 108%;
		background: #C9AC75;
		padding: 2px 10px;
		display: inline-block;
	}
}



/* detail-Content
-----------------------------------*/
.detail-Content{
	margin: 20px auto 0;
}
.detail-Content .head{
	max-width: 1100px;
	padding: 0 15px;
	margin: 0 auto;
}
.detail-Content .head  .movie{
	width: 100%;
	padding-top: 56.25%;
	height: 0px;
	position: relative;
	z-index: 2;
}
.detail-Content .head  .movie iframe {
	width: 100%;
	height: 100%;
	border: none;
	position: absolute;
	top: 0;
	left: 0;
}
.detail-Content .head .title{
	text-align: center;
	font-size: 123.1%;
	color: #C9AC75;
	margin: 20px auto 0;
}
.detail-Content .head .list{
	max-width: 860px;
	margin: 20px auto 0;
}
.detail-Content .head .section{
	border-bottom: 1px solid #ccc;
	padding: 10px 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.detail-Content .head .label{
	font-size: 108%;
	width: 30%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.detail-Content .head .data{
	font-size: 108%;
	font-weight: bold;
	width: 70%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.detail-Content .content{
	background: #FBFBF5;
	padding: 30px 15px 45px;
	margin: 60px auto 0;
}
.detail-Content .content .article{
	max-width: 1080px;
	margin: 0 auto;
}
.detail-Content .content .article h3{
	color: #C9AC75;
	font-family: 'Noto Serif JP', serif;
	font-size: 123.1%;
	font-size: 100%;
	text-align: left;
	border-bottom: 1px solid #333;
	padding-bottom: 10px;
}
.detail-Content .content .article p{
	text-align: left;
	margin-top: 0;
}
.detail-Content .content .interview{
	max-width: 1080px;
	margin: 0 auto;
}
.detail-Content .content .interview h3{
	color: #C9AC75;
	font-family: 'Noto Serif JP', serif;
	font-size: 123.1%;
	text-align: left;
	border-bottom: 1px solid #333;
	padding: 45px 0 10px;
}
.detail-Content .content .interview p{
	text-align: left;
	padding-top: 15px;
}
.detail-Btn{
	max-width: 860px;
	padding: 0 15px;
	margin: 45px auto 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.detail-Btn .navbtn{
	width: calc(50% - 7px);
}
.detail-Btn .navbtn a{
	border: 1px solid #C9AC75;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px;
	display: block;
}
.detail-Btn .navbtn .ico{
	padding-left: 30px;
	margin-top: 10px;
	position: relative;
}
.detail-Btn .navbtn .ico:before{
	content: "";
	width: 22px;
	height: 6px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -3px;
}
.detail-Btn .prev .ico:before{
	background-image: url("/asset/img/ico_prev_01.png");
}
.detail-Btn .next .ico:before{
	background-image: url("/asset/img/ico_next_01.png");
}
.detail-Btn .navbtn .title{
	font-size: 108%;
	font-weight: bold;
	margin-top: 15px;
}
.detail-Btn .navbtn .tag{
	font-size: 93%;
	margin-top: 5px;
}
.detail-Back{
	margin: 45px auto 0;
}
@media only screen and (min-width: 768px){
}
@media only screen and (min-width: 1024px){
	.detail-Content .head{
		margin: 60px auto 0;
	}
	.detail-Content .head .title{
		font-size: 153.8%;
		margin: 45px auto 0;
	}
	.detail-Content .head .list{
		max-width: 860px;
		margin: 20px auto 0;
	}
	.detail-Content .content{
		padding: 60px 15px;
	}
	.detail-Content .content .article h3{
		font-size: 186%;
	}
	.detail-Content .content .article p{
		font-size: 123.1%;
	}
	.detail-Content .content .interview h3{
		font-size: 186%;
		padding: 60px 0 10px;
	}
	.detail-Content .content .interview p{
		font-size: 123.1%;
		padding-top: 20px;
	}
	.detail-Btn .navbtn a{
		padding: 15px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	.detail-Btn .navbtn .thumb{
		width: 40%;
	}
	.detail-Btn .navbtn .comment{
		width: 60%;
		padding: 0 15px;
	}
	.detail-Btn .navbtn .ico{
		margin-top: 5px;
	}
	.detail-Btn .navbtn .title{
		margin-top: 10px;
	}
}




/* plugin
-----------------------------------*/
.detail-Content .content .interview .dgwt-jg-gallery{
	margin-top: 30px;
}
@media only screen and (min-width: 1024px){
	.detail-Content .content .interview .dgwt-jg-gallery{
		margin-top: 45px;
	}
}



/* =============================================================== */
.article h3{
	padding-right: 70px;
	margin-top: 70px;
	position: relative;
}
.article h3:before {
	width: 25px;
	height: 29px;
	top: -100px;
	left: 0;
	right: 0;
	bottom: 0;
}
.article h3:after {
	width: 65px;
	height: 65px;
	top: 30px;
	right: 0;
	bottom: 0;
}
.article h3:after,
.article h3:before {
	margin: auto;
	position: absolute;
	content: "";
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
}
.article p{
	font-size: 14px;
	line-height: 2;
	text-align: left;
	position: relative;
	z-index: 2;
}
.article h3 + p{
	padding: 15px 0 80px;
	width: 100%;
	margin: 0 auto;
}
.article img.alignnone{
	display: block;
	float: none;
}
@media (min-width: 1024px){

}



/* ====== 当日の挙式のご感想をお教えください ======= */
.article h3:nth-of-type(1):after {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_impression_bg_illust.png);
}
.article h3:nth-of-type(1):before {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_impression_illust.png);
}
.article h3 + p:nth-of-type(2) {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_impression_text_bg.png);
	background-repeat: no-repeat;
	background-size: 120px;
	background-position: left bottom;
}



/* ====== 忘れられないシーンは？ ======= */
.article h3:nth-of-type(2):after {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_seen_bg_illust.png);
	width: 62.5px;
	height: 53.5px;
}
.article h3:nth-of-type(2):before {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_seen_illust.png);
	width: 38.5px;
	height: 29.5px;
}
.article h3 + p:nth-of-type(3) {
	background-image:url(https://river-suite.jp/images/report/detail/640/detail_seen_bg_bottom.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center bottom;
}
@media (min-width: 1024px){
	.article h3 + p:nth-of-type(3) {
		background-image:url(https://river-suite.jp/images/report/detail/1024/detail_seen_bg_bottom.png);
		background-size:100%;
	}
}



/* ====== ブライダルプランナーより一言 ======= */
.article h3:nth-of-type(3):after {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_plannercomment_bg_illust.png);
}
.article h3:nth-of-type(3):before {
	width: 36px;
	height: 65px;
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_plannercomment_illust.png);
}
.article h3 + p:nth-of-type(4) {
	background-image: url(https://river-suite.jp/images/report/detail/640/detail_plannercomment_text_bg.png);
	background-repeat: no-repeat;
	background-size: 120px;
	background-position: left bottom;
}
@media (min-width: 768px){
	.article h3 + p:after {
		width: 91.5px;
		height: 39.5px;
		left: -83px;
		bottom: 6px;
	}
}
@media (min-width: 1024px){
	.article h3{
		font-size: 20px;
		padding-right: 100px;
		margin-top: 100px;
	}
	.article h3:after {
		width: 92px;
		height: 92px;
		top: 7px;
	}
	.article h3:before {
		width: 34px;
		height: 39px;
		top: -92px;
	}
	.article p{
		font-size: 16px;
	}
	.article h3 + p {
		padding: 25px 0 100px;
	}
	.article h3 + p:nth-of-type(2) {
		background-size: 150px;
	}
}
