@charset "UTF-8";
/* for AR dynamic_review 動的レビュー 20240820 sz css */
/*▼▼▼▼▼▼▼▼▼comcss/dynamic_review.css********************▼▼▼▼▼▼▼▼▼*/

/* common ***************************************/

/*PC*/body:not(.spView) .u-show-on-sp,
/*PC*/body:not(.spView) .u_show_on_sp,
/*sp*/body.spView .u-show-on-pc,
/*sp*/body.spView .u_show_on_pc{ display: none;}


/* dynamic_review ***************************************/
.dynamic_review{
	font-family: serif;
	background: #fff;

}



/*sp*/ body.spView .dynamic_review{
	margin: 30px auto; padding: 5px 1vw; width: 98%;

}

/*PC*/ body:not(.spView) .dynamic_review{
	margin: 140px auto 100px; padding: 10px; width: 100%; max-width: 1100px;
}

/****************************************/
/* ▼見出し******/


.dynamic_review .dynamic_review_title{
	position: relative;
	text-align: center;
}

/*sp*/body.spView .dynamic_review .dynamic_review_title{
	margin-bottom: 20px; padding-top: 8vw; min-height: 25vw;
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title{
	padding: 50px 0 0 0; height: 200px;
	text-align: center;
}


.dynamic_review .dynamic_review_title::before,
.dynamic_review .dynamic_review_title::after{
	content: "";
	position: absolute;
	display: block; width: 15vw; height: 22vw;
	font-weight: bold; letter-spacing: -1px;
	background: url( /comimg/dynamic_review/null.svg ) center bottom / 100% auto no-repeat;
}

.dynamic_review .dynamic_review_title::before{
	width: 19vw; bottom: 1vw;
	background-image: url( /comimg/dynamic_review/dynamic_review_title_grass.png );
}

.dynamic_review .dynamic_review_title::after{
	bottom: 0; right: 0;
	background-image: url( /comimg/dynamic_review/dynamic_review_title_bottle.png );
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title::before{
	width: 190px; bottom: 10px; left: 43px;
}

/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title::after{
	right: 50px; width: 150px;
}

.dynamic_review .dynamic_review_title .main_text,
.dynamic_review .dynamic_review_title .sub_text{ position: relative;}
/*sp*/ body.spView .dynamic_review .dynamic_review_title .main_text{ font-size: 4.5vw;text-align:center;}
/*sp*/ body.spView .dynamic_review .dynamic_review_title .sub_text{ margin-top: 1.5vw; font-size: 2.5vw;text-align:center;}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title .main_text{ 
font-size: 40px;
text-align:center;
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title .sub_text{ 
margin-top: 10px; 	
font-size: 25px; 
letter-spacing: -1px;
text-align:center;
}


.dynamic_review .dynamic_review_title .main_text::before,
.dynamic_review .dynamic_review_title .sub_text::before{
	content: "";
	position: absolute; left: 50%; transform: translateX( -50% );
	display: block;
	background: url( /comimg/dynamic_review/null.svg ) center bottom / contain no-repeat;
}
.dynamic_review .dynamic_review_title .main_text::before{
	height: 80px; width: 20vw; top: -21vw;
	background-image: url( /comimg/dynamic_review/dynamic_review_title_concent.svg );
}
.dynamic_review .dynamic_review_title .sub_text::before{
	height: 10px;  width: 57%; bottom: -2vw;
	background-image: url( /comimg/dynamic_review/dynamic_review_title_underline.svg );

}

/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title .main_text::before{
	height: 80px; width: 170px; top: -78px;
}

/*PC*/body:not(.spView) .dynamic_review .dynamic_review_title .sub_text::before{
	height: 17px;  width: 100%; bottom: -14px;
}

/****************************************/
/* ▼装飾枠******/
.dynamic_review .dynamic_review_wrapper{	
	position: relative;
	border: 2px solid #e7c772;
}

/*sp*/ body.spView .dynamic_review .dynamic_review_wrapper{
	margin: 0.3vw; padding: 3.7vw;

}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_wrapper{
	margin: 30px 0; padding: 30px 50px;
}

.dynamic_review .dynamic_review_wrapper::before,
.dynamic_review .dynamic_review_wrapper::after{
	content: ""; position: absolute; left: 50%; ; display: block; 
	width: 95vw; height: 17vw;
	background:
		url( /comimg/dynamic_review/dynamic_review_corner_leftup.svg ) left top / auto 100% no-repeat,
		url( /comimg/dynamic_review/dynamic_review_corner_rightup.svg ) right top / auto 100% no-repeat;
}
.dynamic_review .dynamic_review_wrapper::before{
	top: -2px; transform: translateX( -50% );
}
.dynamic_review .dynamic_review_wrapper::after{
	bottom: -2px; transform: translateX( -50% ) scaleY( -1 );
}

/*PC*/body:not(.spView) .dynamic_review .dynamic_review_wrapper::before,
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_wrapper::after{
	width: 1082px; height: 123px;
}

/*PC*/body:not(.spView) .dynamic_review .dynamic_review_wrapper::before{ top: -4px;}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_wrapper::after{ bottom: -4px;}



/****************************************/
/* ▼レビュー枠(grid)******/

.dynamic_review .dynamic_review_box{
	margin-block: 0; padding-inline-start: 0; list-style: none;

}

.dynamic_review .dynamic_review_box .line{
	position: relative; display: grid;
}
.dynamic_review .dynamic_review_box .line:nth-of-type(N+2){ margin-top: 1.5em;}


.dynamic_review .dynamic_review_box .line .area{ grid-area: AREA; padding: unset;}
.dynamic_review .dynamic_review_box .line .date{ grid-area: DATE;}
.dynamic_review .dynamic_review_box .line .name{ grid-area: NAME;}
.dynamic_review .dynamic_review_box .line .text{ grid-area: TEXT;}



/*sp*/ body.spView .dynamic_review .dynamic_review_box .line{
	grid-template-rows: 1.5em auto auto;
	grid-template-columns: 9em 1fr;
	gap: 5px;
	grid-template-areas:
		"AREA DATE"
		"NAME NAME"
		"TEXT TEXT";
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_box .line{
	padding: 0 80px 0 120px; min-height: 72px;
	grid-template-rows: 1.5em auto auto;
	grid-template-columns: 100px 230px 1fr;
	gap: 8px 20px;
	grid-template-areas:
		"AREA DATE TEXT"
		"NAME NAME TEXT";
}







.dynamic_review .dynamic_review_box .line .area{ position: relative;}/*アイコンぶらさげ用*/

/*sp*/ body.spView .dynamic_review .dynamic_review_box .line .name{
	line-height: 1.1em;
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_box .line .name{
	font-size: 16px; line-height: 1.2em; font-weight: bold;
}


.dynamic_review .dynamic_review_box .line .text{
	line-height: 1.1em; overflow: hidden;
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_box .line .text{
	line-height: 1.3em; -webkit-line-clamp: 4;
}
					/*-webkit-line-clamp = 何行まで表示する？*/

/*sp*/ body.spView .dynamic_review .dynamic_review_box .line .area,
/*sp*/ body.spView .dynamic_review .dynamic_review_box .line .name{ padding-left: 4em;}








/*line_アイコン*/
.dynamic_review .dynamic_review_box .line .area::before{
	content: ""; position: absolute; top: 0; left: 0.5em; display: block; 
	background: url( /comimg/dynamic_review/null.svg ) center center / 100% auto no-repeat;
}



.dynamic_review .dynamic_review_box .line:nth-of-type(4n) .area:before{
	background-image: url( /comimg/dynamic_review/dynamic_review_icon_bottle.png );
}
.dynamic_review .dynamic_review_box .line:nth-of-type(4n+1) .area:before{
	background-image: url( /comimg/dynamic_review/dynamic_review_icon_grape.png );
}
.dynamic_review .dynamic_review_box .line:nth-of-type(4n+2) .area:before{
	background-image: url( /comimg/dynamic_review/dynamic_review_icon_grass.png );
}
.dynamic_review .dynamic_review_box .line:nth-of-type(4n+3) .area:before{
	background-image: url( /comimg/dynamic_review/dynamic_review_icon_hand.png );
}

/*sp*/ body.spView .dynamic_review .dynamic_review_box .line .area::before{
	width: 2.5em; height: 2.5em;
}
/*PC*/body:not(.spView) .dynamic_review .dynamic_review_box .line .area::before{
	left: -70px; width: 48px; height: 72px;
}


.bx-wrapper {
margin-bottom: 0px;
}




/*sp*/ body.spView {}



/*sp*/ body.spView {}

/*PC*/body:not(.spView) {}

/****************************************/
