@charset "UTF-8";
/* for FD HC 05 20250617 sz css */
/*▼▼▼▼▼▼▼▼▼5hc00.css********************▼▼▼▼▼▼▼▼▼*/



/*特設 form-title調整*/
/*PC*/ body:not(.spView) #order .form-img{ margin: 0px auto 30px;}
/*PC*/ body:not(.spView) #order .form-img img{ width: 100%;}


/*sp*/ body.spView #header{ display: none;}
/*sp*/ body.spView #footer #foot_info { background: #130c07;}

/*sp*/ body.spView #footer #foot_info .info_tel .area-txt{ color: #fcfcfc; font-family: "NSCJKjp-Regular";}
/*sp*/ body.spView #gnav .tel,
/*sp*/ body.spView #gnav .mail{ color: #fff; border-right: 1px solid #C7A970; background: #130902;}
/*sp*/ body.spView #gnav .mail .label{ background: url(/comimg/plugin/ico_order_form.png) center left / 1.8rem auto no-repeat;}
/*sp*/ body.spView #gnav .pagetop { background: #AB7820 url(/comimg/plugin/ico_delta_pagetop.png) center center / 2rem auto no-repeat;}
/*sp*/ body.spView #contents{ padding-bottom: 20px;}
/*sp*/ body.spView #contents > .form-logo{display: none;}
/*sp*/ body.spView #contents > .form-img{ position: relative; z-index: 1000;}
/*sp*/ body.spView .order-submit button { background: url(/comimg/ico_delta_left_white.png) no-repeat #5bb847; background-size: 5px auto; background-position: left 17px center;}

/*PC*/ body:not(.spView) #footer .copy .copy_nav a,
/*PC*/ body:not(.spView) #footer .copy address{}
/*PC*/ body:not(.spView) #footer #foot_info .company .logo{ filter: invert(1);}
/*PC*/ body:not(.spView) #footer #foot_info .info_tel{ border-color: #000;}
/*PC*/ body:not(.spView) #footer #foot_info { color: #000; background: linear-gradient(to right,rgb(196,172,42) 0%,rgb(225,212,146) 20%,rgb(255,243,194) 50%,rgb(225,212,146) 80%,rgb(196,172,42) 100%);}
/*PC*/ body:not(.spView) #footer #foot_info .lead,
/*PC*/ body:not(.spView) #footer #foot_info .info_tel .area-txt{ color: #000; font-family: "NSCJKjp-Regular";}

/*PC*/ body:not(.spView) #header .orderNav .orderNav_link a{ background-color: #c30e23;}
/*PC*/ body:not(.spView) .order-submit button {
	background-color: #3f861c !important;
	background-image: url(/comimg/ico_delta_left_white.png) no-repeat !important;
	background-position: 27px center;
}
/*PC*/ body:not(.spView) #footer,
/*PC*/ body:not(.spView) #contents{ padding-bottom: 20px;}
/*PC*/ body:not(.spView) #contents{ background: #000;}
/*PC*/ body:not(.spView) #contents .order > .inner{ margin-top: unset; padding-top: 35px; background: rgba( 255,255,255,1.0);}

/*ヘッダ>声>隠し*/
/*PC*/ body:not(.spView) #header .hd_link li:nth-of-type(3){ display: none;}

/*************************************************************************/
/*▼基礎▼***/
/*************************************************************************/

#user_contents{
	background-color: #000;
}


#user_contents .sec_hd{
	color: #5B2C25; background: #F6E091;
	background: linear-gradient(to right,rgb(197,134,23) 0%,rgb(246,224,145) 50%,rgb(197,134,23) 100%);
	line-height: 1.3em !important;
}



/*sp*/body.spView #user_contents .sec_hd {
	font-size: 5.3vw;
}

/*************************************************************************/
/*▼デザイン本体▼***/
/*************************************************************************/

/*▼▼#main メインイメージ/ファーストビュー*********************/
#user_contents #main{
	position: relative; z-index: 2;
	background: #000 url( /5hc00/img/main/main_bg.jpg ) center bottom / 121% auto no-repeat;
}

/*sp*/body.spView #user_contents #main{
	height: 113vw;
	background-position: 69% 134%;
	background-size: 180% auto;
}
/*PC*/body:not(.spView) #user_contents #main{
	height: 1110px;
	background-color: #000;
	background-size: auto 1190px;
}

/* .esinfo 冒頭メッセージ*********************/
#user_contents .esinfo{
	padding: 7px 0px; width: 100%;
	text-align: center; color: #F5EDE1; background: #000;
}
#user_contents .esinfo .text{ position: relative; z-index: 100;}
/*PC*/body:not(.spView) #user_contents .esinfo{
	font-size: 22px; padding: 12px 0px;
}




/* 他#メイン部品*********************/

#user_contents #main .title,
#user_contents #main .three_points{
	position: absolute;
}
#user_contents #main .three_points{
	width: 40vw; height: auto;
	bottom: 10px; left: 50%; transform: translateX(-50%);
}
/*sp*/body.spView #user_contents #main .three_points{
	width: 86vw; height: auto;
	bottom: -24px; left: 50%; transform: translateX(-50%);
}


#user_contents #main .title{
	top: calc( 34px + 5px ); left: 50%; transform: translateX(-50%);
	width: 56vw; padding: 10px;

}
/*sp*/body.spView #user_contents #main .title{
	top: calc( 34px - 10px );
	width: 86vw;
	background: rgba(0, 0, 0, 0.3);
}
/*PC*/body:not(.spView) #user_contents #main .title{
	background: rgba(0, 0, 0, 0.6);
	max-width: 800px;
}











/*▼▼共用 ▽三角▽*********************/
#user_contents #reason::after,
#user_contents #item::after,
#user_contents #faq::after,
#user_contents #voice::after,
#user_contents #benefit::after{
	content: "";
	position: absolute; z-index: 2000; bottom: 0; left: 50%; transform: translateX(-50%);
	display: block; width: 40%; max-width: 308px; height: 120px;
	background: url(/5hc00/img/parts/parts_under_arrow_gold.png) center top / 100% auto no-repeat;
}


/*sp*/body.spView #user_contents #reason::after{ bottom: -100px;}
/*PC*/body:not(.spView) #user_contents #reason::after{ bottom: -70px;}
/*sp*/body.spView #user_contents #item::after{ bottom: -94px;}
/*PC*/body:not(.spView) #user_contents #item::after{ bottom: -70px;}
/*sp*/body.spView #user_contents #faq::after{ bottom: -70px;}
/*PC*/body:not(.spView) #user_contents #faq::after{ bottom: -60px;}
/*sp*/body.spView #user_contents #benefit::after{ background-position: center bottom; bottom: -2vw;}



/*▼▼#reason 人気の理由*********************/

#user_contents #reason{
	background: #fff;
}

#user_contents #reason .sec_hd{
	padding-bottom: 0;
	background: unset;
}


/*PC*/body:not(.spView) #user_contents #reason .reason_grid{
	display: grid;
	grid-template-rows: 1fr 150px;
	grid-template-columns: 640px 1fr;
	gap: 16px;
	grid-template-areas:
		 "PHOTO TEXT1"
		 "TEXT2 TEXT2";
}


#user_contents #reason .photo_affinere{ position: relative;}
/*PC*/body:not(.spView) #user_contents #reason .photo_affinere{ grid-area: PHOTO;}
/*PC*/body:not(.spView) #user_contents #reason .reason_text.text1{ grid-area: TEXT1;}
/*PC*/body:not(.spView) #user_contents #reason .reason_text.text2{ grid-area: TEXT2;}
/*PC*/body:not(.spView) #user_contents #reason .reason_text .text{ margin-bottom: 0.5em;}

/*PC*/body:not(.spView) #user_contents #reason .photo_affinere{ padding-top: 70px;}
/*sp*/body.spView #user_contents #reason .photo_affinere{ margin-bottom: 13px;}

/*PC*/body:not(.spView) #user_contents #reason .reason_text.text1{
	padding-top: 30px;
	line-height: 1.4em;
}


#user_contents #reason .photo_affinere .name_affinere{
	position: absolute;
	width: 20vw;
}
/*PC*/body:not(.spView) #user_contents #reason .photo_affinere .name_affinere{
	width: 160px;
}

#user_contents #reason .photo_affinere .name_affinere.bourgon{ top: 31vw; left: 1vw;}
#user_contents #reason .photo_affinere .name_affinere.alleosse{ top: -5vw; left: 30vw;}
#user_contents #reason .photo_affinere .name_affinere.rodolphe{ top: -4vw; left: 64vw;}

/*PC*/body:not(.spView) #user_contents #reason .photo_affinere .name_affinere.bourgon{ top: 40px; left: 1px;}
/*PC*/body:not(.spView) #user_contents #reason .photo_affinere .name_affinere.alleosse{ top: 11px; left: 241px;}
/*PC*/body:not(.spView) #user_contents #reason .photo_affinere .name_affinere.rodolphe{ top: 36px; left: 451px;}


/*sp*/body.spView #user_contents #reason .reason_text {
	font-family: sans-serif;
	font-size: 14px; line-height: 1.2em;
}




/*▼▼#message 店長メッセージ*********************/
#user_contents #message{ position: relative;}

#user_contents #message .sec_title{
	color: #fff; text-align: center;
}
/*sp*/body.spView #user_contents #message .sec_title{
	padding-top: 12vw;
	font-size: 6.2vw; line-height: 1.7em;
}

/*PC*/body:not(.spView) #user_contents #message .sec_title{
	font-size: 65px; line-height: 1.5em;
}


#user_contents #message .grid_box{ display: grid;}
/*sp*/body.spView #user_contents #message .grid_box{
	grid-template-rows: 71vw auto 25vw;
	grid-template-columns: 1fr 1fr;
	gap: 16px 10px;
	grid-template-areas:
		 "TITLE SIKATA"
		 "WORDS WORDS"
		 "AFF AFF";
}
/*PC*/body:not(.spView) #user_contents #message .grid_box{
	grid-template-rows: 220px 1fr 260px;
	grid-template-columns: 330px 1fr;
	gap: 20px 20px;
	grid-template-areas:
		 "TITLE TITLE"
		 "SIKATA WORDS"
		 "AFF AFF";
}
#user_contents #message .sec_title{ grid-area: TITLE}
#user_contents #message .sikata{ grid-area: SIKATA;}
#user_contents #message .words{ grid-area: WORDS;}
#user_contents #message .affineurs{ grid-area: AFF;}



#user_contents #message .sikata{
	position: relative;
}

#user_contents #message .sikata::before{
	content: "";
	position: absolute; bottom: 0; left: 50%; transform: translateX( -50% );
	display: block; width: 26vw; height: 45vw;
	background: url(/5hc00/img/message/message_sikata_name.png) center bottom / 100% auto no-repeat;
}
/*PC*/body:not(.spView) #user_contents #message .sikata::before{
	width: 230px; height: 135px; bottom: unset; top: 393px;
}


#user_contents #message .words{ color: #fff;}

/*PC*/body:not(.spView) #user_contents #message .words{ padding-bottom: 1em;}

#user_contents #message .aco_menu .box_item .title{
	background: -webkit-linear-gradient(top, rgb(255, 255, 255) 0%, rgb(247, 239, 173) 20%, rgb(237, 172, 6) 75%, rgb(218, 142, 0) 90%, rgb(247, 222, 5) 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
}

/*sp*/body.spView #user_contents #message .aco_menu .box_item{
	padding-bottom: 16px;
}
/*sp*/body.spView #user_contents #message .aco_menu .box_item .aco_contents{
	padding-top: 30px;
}
/*sp*/body.spView #user_contents #message .aco_menu .box_item .title{
	padding: 10px 0 30px;
	font-size: 6vw; line-height: 1.2em; letter-spacing: -1px; text-align: center;
}
#user_contents #message input[type="checkbox"].aco_on_off:checked + .aco_label + .aco_contents{
	animation-timing-function: ease-out;
}

/*PC*/body:not(.spView) #user_contents #message .aco_menu .box_item .title{
	margin: 25px 0 15px;
	padding: 0 0 10px;
	font-size: 30px; line-height: 1.3em;
	
}

/*PC側aco_menu 無効化*/
body:not(.spView) #user_contents #message .aco_menu .aco_contents{ font-size: unset; padding-top: 70px;}
body:not(.spView) #user_contents #message .aco_menu input[type="checkbox"].aco_on_off + .aco_label + .aco_contents{
	max-height: unset; overflow: unset;
}
body:not(.spView) #user_contents #message input[type="checkbox"].aco_on_off + .aco_label + .aco_contents::before,
body:not(.spView) #user_contents #message input[type="checkbox"].aco_on_off:checked + .aco_contents::before{
	content: unset;
}




/*▼▼#badge 商品バッジ*********************/
#user_contents #badge{
	color: #eee;
	background: #000;
}
#user_contents #badge .badge_title{
	margin-bottom: 20px;
	text-align: center;
}

#user_contents #badge .badge_list .flex_box{ margin-bottom: 10px;}
#user_contents #badge .badge_list .badge_sample{
	margin-right: 0.5em; width: 3em; float: left; 
}


/*▼▼#item 商品*********************/
#user_contents #item{
	color: #fff;
	background: #000;
	padding-bottom: 30px;
}
/*PC*/body:not(.spView) #user_contents #item{
	padding-bottom: 80px;
}


#user_contents #item .sec_hd.month_hd{
	color: #e9c870;
	background: #000;
	background: linear-gradient(to right, rgb(197, 134, 23) 0%, rgb(246, 224, 145) 5px, #000 5px, #000 calc( 100% - 5px ), rgb(246, 224, 145) calc( 100% - 5px ), rgb(197, 134, 23) 100% );
}
/*PC*/body:not(.spView)  #user_contents .sec_hd.month_hd{
	margin-top: 80px;
	padding: 20px 0;
}


#user_contents #item .detail{
	position: relative;
}
#user_contents #item .detail .catch{
	margin-bottom: 10px;
}
/*sp*/body.spView #user_contents #item .detail .item_desc:nth-of-type(n+2){
	margin-top: 1em;
}
#user_contents #item .detail .item_desc,
#user_contents #item .detail .item_desc .item_icon{
	position: relative;
}

#user_contents #item .detail .item_desc .item_name{
	margin-bottom: 8px;
}
#user_contents #item .detail .item_desc .text{
	font-size: 14px; line-height: 1.1em;
}

	/* ▼バッジ(共通部分)******* */
#user_contents #item .detail .item_desc .badge_box{
	position: absolute; z-index: 100; top: 21vw; left: 0;
	height: 26px;
}

/*PC*/body:not(.spView) #user_contents #item .detail .item_desc .badge_box{
	top: 76px; height: 40px;
}
#user_contents #item .detail .item_desc .badge_box .badge{
	height: 100%; margin-right: -7px;
}





	/* ▼商品内容(初回)******* */
#user_contents #item .item_firsttime{
	margin-top: 40px;
}
/*PC*/body:not(.spView) #user_contents #item .item_firsttime{
	margin-top: 80px;
}

/*sp*/body.spView #user_contents #item .icon.firsttime{
	display: none;
}

/*PC*/body:not(.spView) #user_contents #item .icon.firsttime{
	position: absolute; z-index: 10; top: 0; left: 0; width: 170px;
}

/*PC*/body:not(.spView) #user_contents #item .item_firsttime .catch{
	position: relative;
	padding: 30px 30px 40px 196px;
	font-size: 32px; line-height: 1.3em;
}



/*PC*/body:not(.spView) #user_contents #item .item_firsttime .detail .inner{
	margin-top: 40px;
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr 1fr 1fr ;
	gap: 10px 10px;
	grid-template-areas: "DESC1 DESC2 DESC3";
}

/*PC*/body:not(.spView) #user_contents #item .detail .inner .item_desc:nth-of-type(1){ grid-area: DESC1;}
/*PC*/body:not(.spView) #user_contents #item .detail .inner .item_desc:nth-of-type(2){ grid-area: DESC2;}
/*PC*/body:not(.spView) #user_contents #item .detail .inner .item_desc:nth-of-type(3){ grid-area: DESC3;}


#user_contents #item .item_firsttime .detail .item_desc .badge_box{
	top: 5px; left: 2px; height: 50px;
}
/*PC*/body:not(.spView) #user_contents #item .item_firsttime .detail .item_desc .badge_box{
	height: 66px; top: 2px;
}

#user_contents #item .item_firsttime .detail .item_desc .badge_box .badge{
	margin-right: -10px;
}


	/* ▼商品内容(これまで)******* */



#user_contents #item .item_monthly_image{
	margin-top: 1.5em;
}


#user_contents #item .item_monthly_image .month:nth-of-type(n+2){
	margin-top: 1.5em;
}

/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .month .detail{
	margin: 60px 0;
	display: grid;
	grid-template-rows: 60px 1fr;
	grid-template-columns: 1fr 1fr;
	gap: 10px 20px;
	grid-template-areas: "PHOTO CATCH" "PHOTO DESC";
}
/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .month .detail:last-of-type{
	margin-bottom: 0;
}

/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .month .detail .photo{ grid-area: PHOTO;}
/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .month .detail .catch{ grid-area: CATCH;}
/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .month .detail .inner{ grid-area: DESC;}

/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .inner{
	display: grid;
	grid-template-rows: 3fr;
	grid-template-columns: 1fr;
	gap: 5px;
	grid-template-areas: "DESC1" "DESC2" "DESC3";
}


#user_contents #item .item_monthly_image .item_desc .item_icon{
	margin-right: 0.5em;
	width: 30%;
	float: left;
}
/*PC*/body:not(.spView) #user_contents #item .item_monthly_image .item_desc .item_icon{
	width: 116px;
}

#user_contents #item .item_monthly_image .item_desc::after{
	content: ""; display: block; clear: both;
}




	/* ▼添え書き******* */
#user_contents .caution_text{ text-align: left;}
/*sp*/body.spView #user_contents .caution_text{ width: 96vw; margin: 5px auto;}
/*PC*/body:not(.spView) #user_contents #item .caution_text{ padding-left: 290px;}




/*▼▼#fun お楽しみ*********************/
#user_contents #fun{
	color: #000;
	background: #fff;
}
#user_contents #fun .sec_hd{
	background: #F6E091;
	border-radius: 170px;
}

/*PC*/body:not(.spView) #user_contents #fun{
	padding: 80px 0;
}

#user_contents #fun .catch{
	margin: 1em 0;
	text-align: center;
}
/*PC*/body:not(.spView) #user_contents #fun .catch{
	font-size: 32px;
}

/*PC*/body:not(.spView) #user_contents #fun .caution_text{ padding-left: 620px;}



/*▼▼#maker 熟成士*********************/
#user_contents #maker{
	color: #000;
	background: #fbf6eb;
}
#user_contents #maker .sec_hd{}

#user_contents #maker .about_affinere{}
#user_contents #maker .about_affinere .title{
	margin: 10px auto; padding: 10px;
	text-align: center;
}
/*PC*/body:not(.spView) #user_contents #maker .about_affinere .title{
	padding: 60px 20px; font-size: 40px;
}
#user_contents #maker .about_affinere .photo{}
#user_contents #maker .about_affinere .catch{
	margin: 16px;
	text-align: center;
}
/*PC*/body:not(.spView) #user_contents #maker .about_affinere .catch{
	padding: 20px;
	font-size: 20px;
}
/*PC*/body:not(.spView) #user_contents #maker .about_affinere .text{
	padding: 10px 69px; line-height: 1.5em;
}



	/*MOFとは*/

/*sp*/body.spView #user_contents #maker .about_mof{ padding: 0.2em 0.8em;}
/*PC*/body:not(.spView) #user_contents #maker .about_mof{ margin-bottom: 0; padding: 10px 80px;}
#user_contents #maker .about_mof::after{ content:"";clear: both;display: block;}

#user_contents #maker .about_mof .catch{
	margin: 5px auto; padding: 5px 10px;
	color: #eee; text-align: center;
	background: #130902; border-radius: 10em;
}
/*PC*/body:not(.spView) #user_contents #maker .about_mof .catch{
	margin: 10px auto 30px; padding: 15px; width: 60%;
	font-size: 140%;
}
#user_contents #maker .about_mof .graph{
	margin: 10px 0px 10px 10px;
	width: 30%; float: right;
}

/*PC*/body:not(.spView) #user_contents #maker .about_mof .text{
	width: 64%;
	line-height: 1.5em;
}
/*sp*/body.spView #user_contents #maker .about_mof .aco_box .aco_inner{ height: 50vw;}
/*sp*/body.spView #user_contents #maker .about_mof .aco_box label:after{ background: #e6ca60;}



	/*熟成士共通*/
#user_contents #maker .affineur{
	padding: 10px;
	color: #eee; background: #444;
}
#user_contents #maker .affineur .aco_box{
	background: url( /comimg/svg/null.svg ) 10px 10px / 50px auto no-repeat;
}
/*PC*/body:not(.spView) #user_contents #maker .affineur .aco_box{ background-size: 80px auto;}
/*sp*/body.spView #user_contents #maker .affineur .aco_inner{ height: 105vw;}
/*sp*/body.spView #user_contents #maker .affineur .aco_box label:after{ color: #000; background: rgba(255,255,255,0.5);}

#user_contents #maker .affineur .text{ margin-bottom: 1.5em;}

/*PC*/body:not(.spView) #user_contents #maker .affineur .profile{
	position: relative;
}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile::before{
	content: "";
	position: relative; top: 0px; left: 0px;
	display: block; width: 40%; height: 369px; float: left;
}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile::after{ content:"";clear: both;display: block;}
#user_contents #maker .affineur .profile .appearance{ width: 60%; margin: 5px auto;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .appearance{
	position: absolute; left: 67px; top: 0px;
	width: 33%;
}


#user_contents #maker .affineur .profile .catch,
#user_contents #maker .affineur .profile .name{ margin: 10px auto 10px; text-align: center; line-height: 1.3em;}

/*sp*/body.spView #user_contents #maker .affineur .profile .catch{ font-size: 4.2vw;}
/*sp*/body.spView #user_contents #maker .affineur .profile .name{ font-size: 6.5vw;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .catch,
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .name,
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .text{ width: 58%; float: right;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .catch{ margin-top: 30px; font-size: 20px;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .name{ margin-bottom: 30px; font-size: 40px;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .profile .text{ line-height: 1.5em;}



/*PC*/body:not(.spView) #user_contents #maker .affineur .desc{ position: relative; margin: 20px 0px; min-height: 230px;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .desc::after{ content:"";clear: both;display: block;}

#user_contents #maker .affineur .desc .catch{ margin-bottom: 0.8em; font-size: 120%;}
#user_contents #maker .affineur .desc .text{}
#user_contents #maker .affineur .desc .photo{}

/*PC*/body:not(.spView) #user_contents #maker .affineur .desc .catch,
/*PC*/body:not(.spView) #user_contents #maker .affineur .desc .text{
	padding: 5px 20px 5px 68px; width: 55%;
}
/*PC*/body:not(.spView) #user_contents #maker .affineur .desc .catch{ font-size: 20px;}
/*PC*/body:not(.spView) #user_contents #maker .affineur .desc .photo{
	position: absolute; top: 0px; right: 10px;
	width: 40%;
}


	/*熟成士個別*/
#user_contents #maker .affineur.alleosse{
	background: #AF3325;
	background: linear-gradient(to right,rgb(87,25,18) 0%,rgb(140,40,29) 30%,rgb(175,51,37) 100%);
}
#user_contents #maker .affineur.alleosse .aco_box{ background-image: url(/5hc00/img/maker/maker_alleosse_name.png);}

#user_contents #maker .affineur.alleosse .aco_box label{
	background: linear-gradient(to right,rgba(87,25,18,0.8) 0%,rgba(140,40,29,0.8) 30%,rgba(175,51,37,0.8) 100%);
}

#user_contents #maker .affineur.rodolphe{
	background: #003D7E;
	background: linear-gradient(to right,rgb(0,30,63) 0%,rgb(0,48,100) 30%,rgb(0,61,126) 100%);
}
#user_contents #maker .affineur.rodolphe .aco_box{ background-image: url(/5hc00/img/maker/maker_rodolphe_name.png);}


#user_contents #maker .affineur.rodolphe .aco_box label{
	background: linear-gradient(to right,rgba(0,30,63,0.8) 0%,rgba(0,48,100,0.8) 30%,rgba(0,61,126,0.8) 100%);
}
#user_contents #maker .affineur.bourgon{
	background: #008138;
	background: linear-gradient(to right,rgb(0,64,28) 0%,rgb(0,103,44) 30%,rgb(0,129,56) 100%);
}
#user_contents #maker .affineur.bourgon .aco_box{ background-image: url(/5hc00/img/maker/maker_bourgon_name.png);}

#user_contents #maker .affineur.bourgon .aco_box label{
	background: linear-gradient(to right,rgba(0,64,28,0.8) 0%,rgba(0,103,44,0.8) 30%,rgba(0,129,56,0.8) 100%);
}


/*▼▼#benefit 利用シーンのご提案*********************/
#user_contents #benefit{
	padding: 20px 0;
	color: #000;
	background: #FCF3EC;
}
/*PC*/body:not(.spView) #user_contents #benefit{
	padding: 70px 0 40px;
}

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.sp,
/*sp*/body.spView #user_contents #benefit .sec_box.pc{ display: none;}

	/**sp**/
/*sp*/body.spView #user_contents #benefit .sec_box.sp{ padding: 20px 2vw;}

/*sp*/body.spView #user_contents #benefit .sec_box.sp .catch,
/*sp*/body.spView #user_contents #benefit .sec_box.sp .catch_sub{ text-align: center;}

/*sp*/body.spView #user_contents #benefit .sec_box.sp .catch{
	margin-bottom: 3vw;
	font-size: 8vw; line-height: 1.3em;
}
/*sp*/body.spView #user_contents #benefit .sec_box.sp .catch_sub{
	font-size: 5vw; line-height: 1.3em;
}
/*sp*/body.spView #user_contents #benefit .sec_box.sp .photo{
	position: relative;
	margin: 7vw auto 7vw; width: 70%;
	transform: rotate(-3deg);
	box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.4);
}
/*sp*/body.spView #user_contents #benefit .sec_box.sp .photo::before{
	position: absolute; z-index: 100; top: -2vw; left: 31vw;
	content: "　";
	width: 8vw;
	height: 8vw;
	background: url(/5hc00/img/benefit/benefit_photo4_pin.png) center center / 100% auto no-repeat;
}

	/**PC**/

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc{
	margin-bottom: 70px; padding: 40px 0;
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 600px 1fr;
	gap: 20px 8px;
}

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .content .benefit_box:nth-of-type(n+2){
	margin-top: 70px;
}


/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .content .catch{
	margin: 30px 0 20px;
	font-size: 40px;
	font-family: "NSCJKjp-Black";font-weight: normal;letter-spacing: -1.2px;
}

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .content .text{
	position: relative;
	padding: 16px 16px 40px 36px;
	line-height: 1.4em;
}
/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .content .text::after {
	content: "　";
	position: absolute; bottom: -5px; left: 0px;
	display: block; width: 100%; height: 1px;
	background-image: linear-gradient(to right, rgb(194, 170, 36) 0%, rgb(217, 203, 120) 38%, rgb(252, 251, 246) 100%);
	background-repeat: no-repeat;
}

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .image{
	position: relative;
}

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .image .photo{
	position: absolute; 
	display: block;width: 400px;
	box-shadow: 0.1rem 0.1rem 1rem 0rem rgba(0,0,0,0.2);
}

/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .image .photo:nth-of-type(1){
	z-index:130; left: 70px: top: -35px; transform: rotate(7deg);
}
/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .image .photo:nth-of-type(2){
	z-index:120; top: 270px; transform: rotate(-4deg);

}
/*PC*/body:not(.spView) #user_contents #benefit .sec_box.pc .image .photo:nth-of-type(3){
	z-index:110; left: 70px; top: 490px; transform: rotate(4deg);
}


/*▼▼#voice お客様の声*********************/
#user_contents #voice{
	padding: 20px 0;
	background: #FCF3EC;
}
/*PC*/body:not(.spView) #user_contents #voice{
	padding: 40px 0 40px;
}



/*sp*/body.spView #user_contents #voice .customer .many_customer .voices .voice_box{
	margin-bottom: 1em;
}
#user_contents #voice .customer .many_customer .voices .text{
	letter-spacing: -3px; font-size: 18px;
}

#user_contents #voice .customer .many_customer .voices .text .name{
	font-family: 'Noto Serif JP', serif;
	font-weight: 400; font-size: 16px;
}


#user_contents #voice .customer .many_customer .voices .with_img::after{
	content: ""; clear: both; display: block;
}
#user_contents #voice .customer .many_customer .voices .photo{
	float: left; margin-right: 0.5em;
}

/*PC*/body:not(.spView) #user_contents #voice .customer .many_customer .voices{
	display: grid;
	grid-template-rows: 1fr 1fr;
	grid-template-columns: 1fr 1fr;
	gap: 20px 20px;
	grid-template-areas: "VOICE1 VOICE2" "VOICE1 VOICE3";
}
/*PC*/body:not(.spView) #user_contents #voice .customer .many_customer .voices .voice_box{}


/*PC*/body:not(.spView) #user_contents #voice .customer .many_customer .voices .voice_box:nth-of-type(1){ grid-area: VOICE1;}
/*PC*/body:not(.spView) #user_contents #voice .customer .many_customer .voices .voice_box:nth-of-type(2){ grid-area: VOICE2;}
/*PC*/body:not(.spView) #user_contents #voice .customer .many_customer .voices .voice_box:nth-of-type(3){ grid-area: VOICE3;}




/*▼▼#faq FAQ*********************/
#user_contents #faq{
	padding: 20px 0;
	background: #FCF3EC;
}
/*PC*/body:not(.spView) #user_contents #faq{
	padding: 40px 0 50px;
}


#user_contents #faq .faq_box .question{ color: #7d5709;}
#user_contents #faq .faq_box .answer::before{ color: #d5b064;}
#user_contents #faq .faq_box .answer b{ color: #b00;}


/*▼▼#closing*********************/
#user_contents #closing{
	padding-bottom: 20px;
}





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

/*美人字 (#voice 必要文字のみ)*/
@font-face {
  font-family: "sub_bijin_hc01";
  src: url("/5hc00/img/voice/sub_bijin_hc00.woff")  format('woff');
}

#user_contents #voice .customer .many_customer .voices.bijin .text{
	font-family: "sub_bijin_hc01";
}


/*NSCJK 極太 Black*/
@font-face {
  font-family: "NSCJKjp-Black";
  src: url("/comfont/NotoSerifCJKjpSub-Black.woff2") format('woff2'),
       url("/comfont/NotoSerifCJKjpSub-Black.woff")  format('woff');
}


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


/*sp*/body.spView #user_contents.hc5aoc2025 #main{
	height: 164vw;
	background-position: 69% 12%;
}
/*PC*/body:not(.spView) #user_contents.hc5aoc2025 #main{
	height: 1635px;
	background-position: center 24px;
	background-color: #fff;
}


/*sp*/body.spView #user_contents.hc5aoc2025 #main .three_points{
	bottom: unset; top: 97vw; width: 56vw; z-index: 20;
}
/*PC*/body:not(.spView) #user_contents.hc5aoc2025 #main .three_points{
	bottom: unset; top: 1010px; z-index: 20;
}

#user_contents.hc5aoc2025 #main .comte_5hcaoc{
	position: absolute; bottom: 13px;
}
/*PC*/body:not(.spView) #user_contents.hc5aoc2025 #main .comte_5hcaoc{
	padding: 0 calc( ( (100% - 1100px) / 2 ) + 50px );
}
#user_contents.hc5aoc2025 #main .comte_5hcaoc_badge{
	position: absolute; top: 45vw; right: 2vw; z-index: 20;
	width: 30%;
}
/*PC*/body:not(.spView) #user_contents.hc5aoc2025 #main .comte_5hcaoc_badge{
	top: 360px; right: calc( ( ( 100% - 1100px ) / 2 ) - 50px ) ;
	width: 320px;
}



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