@charset "UTF-8";
/* for FD 4AC (basefont16px) 202405 sz css */
/*▼▼▼▼▼▼▼▼▼5ac00.css********************▼▼▼▼▼▼▼▼▼*/

/*************************************************************************/
/*▼システムオーバーライド(配色+特設)▼***/
/*************************************************************************/
#contents .order-form .order-submit button{ background-color: #3f861c;}
/*sp*/ body.spView #gnav .tel,
/*sp*/ body.spView #gnav .mail{ color: #fff; border-right: 1px solid #212121; background: #212121;}
/*sp*/ body.spView #gnav .pagetop { background-color: #212121;}
/*sp*/ body.spView #footer #foot_info { background: #1E1316;}
/*sp*/ body.spView #footer #foot_info .info_tel .area-txt{ color: #fcfcfc;}

/*PC*/ body:not(.spView) #header .orderNav .orderNav_link a{ background-color: #E00000;}
/*PC*/ body:not(.spView) #footer,
/*PC*/ body:not(.spView) #contents{ padding-bottom: 20px;}
/*PC*/ body:not(.spView) #contents .order > .inner{ margin-top: unset; padding-top: 35px; background: rgba( 255,255,255,0.8);}
/*PC*/ body:not(.spView) #footer #foot_info { background: #222224;}
/*PC*/ body:not(.spView) #footer #foot_info .company .logo{ filter: invert(0);}
/*PC*/ body:not(.spView) #footer #foot_info .info_tel{ border-color: #fff;}
/*PC*/ body:not(.spView) #footer #foot_info { color: #fff; background: #212121;}
/*PC*/ body:not(.spView) #footer #foot_info .lead,
/*PC*/ body:not(.spView) #footer #foot_info .info_tel .area-txt{ color: #fcfcfc;}

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

/*▼jquery.bxslider.css スライダー周り(配色限定!)************************/
/*sp*/ body.spView .bx-wrapper { background: #1e0807; border-bottom: 1px solid #4d2827;}
/*sp*/ body.spView .bx-wrapper .bx-controls-direction a{ top: 5%;}
/*sp*/ body.spView .bx-wrapper .bx-pager.bx-default-pager a { background: #e1e1e1;}
/*sp*/ body.spView .bx-wrapper .bx-pager.bx-default-pager a:hover,
/*sp*/ body.spView .bx-wrapper .bx-pager.bx-default-pager a.active,
/*sp*/ body.spView .bx-wrapper .bx-pager.bx-default-pager a:focus { background: #ee4;}




/* common ****/
/*PC*/ body:not(.spView) #user_contents .box_com{
	font-size: 24px; line-height: 1.3em;
}

#contents,
#user_contents{
	background:
		linear-gradient(to right,rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 100%) center center / 94vw 100% no-repeat,
		#fff url( /comimg/svg/bg_tile_da_new0301_white.svg ) center center / 64px auto repeat;
}
/*PC*/ body:not(.spView) #footer,
/*PC*/ body:not(.spView) #contents,
/*PC*/ body:not(.spView) #user_contents{
	background:
		linear-gradient(to right,rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 100%) center center / 1100px 100% no-repeat,
		#fff url( /comimg/svg/bg_tile_da_new0301_white.svg ) center center / 128px auto repeat;
}




/*▼▼#mainメインイメージ/ファーストビュー*******************/
#user_contents  #main{
	position: relative;
	height: 118vw;
	background: url( /5ac00/img/main/main_bg.jpg) center top / 100% auto no-repeat ;
}

/*PC*/ body:not(.spView) #user_contents  #main{
	height: 1300px;
	background-size: auto 100%;
}


	/*esinfo*/
#user_contents  #main .esinfo{ text-align: center; color: #ccc;}
/*sp*/ body.spView #user_contents  #main .esinfo{ font-size: 10px; letter-spacing: -1px;}
/*PC*/ body:not(.spView) #user_contents  #main .esinfo{ padding: 9px; font-size: 20px; text-align: center;}

	/*内部*/
#user_contents  #main .title,
#user_contents  #main .medal,
#user_contents  #main .price{ position: absolute;}


#user_contents  #main .title{ top: 5vw; left: 50%; transform: translateX(-50%); width: 90%;}
#user_contents  #main .medal{ top: 35vw; left: 50%; transform: translateX(-50%); width: 51%;}
#user_contents  #main .price{ bottom: 0; right: 4%; width: 42%;}


/*PC*/ body:not(.spView) #user_contents  #main .title{ top: 36px; width: 1010px;}
/*PC*/ body:not(.spView) #user_contents  #main .medal{ top: 380px; width: 580px;}
/*PC*/ body:not(.spView) #user_contents  #main .price{ bottom: 11px; left: calc(50% + 49px); width: 474px;}


/*▲▲#mainメインイメージ/ファーストビュー*******************/
/*▼▼#maker .A_appealアレオスアピール*******************/
#user_contents #maker,
#user_contents #maker .sec_hd{ margin-top: 0; padding-top: 0;}
#user_contents #maker .sec_hd rt{ text-align: center; letter-spacing: 0.2em;}

body.spView #user_contents #maker .sec_hd{
	width: 100%; max-width: 100%;
	padding-left: 0; padding-right: 0;
}




#user_contents #maker .alleosse_image{ margin-bottom: 20px;}
/*PC*/ body:not(.spView) #user_contents #maker .alleosse_image{
	margin-bottom: 50px; padding: 0 5%;
}

/*本文***/
	/*共通*/
#user_contents #maker .desc{
	margin: 20px 0;
	display: grid;
	gap: 10px;
}

/*PC*/ body:not(.spView) #user_contents #maker .desc{ margin-bottom: 70px;}


#user_contents #maker .desc .message_title{ grid-area: TITLE; justify-self: center;}
#user_contents #maker .desc .message_text{ grid-area: TEXT;}
#user_contents #maker .desc .message_img{ grid-area: IMG;}

#user_contents #maker .desc .message_img{ overflow: hidden;}
#user_contents #maker .desc .message_title{
	margin: 10px auto 15px; padding: 5px 10px;
	line-height: 1.4em; letter-spacing: -1px; color: #fff; text-align: center;
	background: #960000; border-radius: 80px;
}
/*PC*/ body:not(.spView) #user_contents #maker .desc .message_title{
	padding: 8px 20px; font-size: 30px; width: 25.5em;
}


	/*個別*/
		/*アレオス*/
#user_contents #maker .desc.alleosse{
	grid-template-columns: 1fr;
	grid-template-rows: auto auto auto;
	grid-template-areas: "TITLE" "TEXT" "IMG";
}
#user_contents #maker .desc.alleosse .message_title{ margin-bottom: unset;}
#user_contents #maker .desc.alleosse .message_text{ width: 100%;}


		/*巨匠*/
#user_contents #maker .desc.maitre{ display: block;}
/*PC*/ body:not(.spView) #user_contents #maker .desc.maitre{ margin-bottom: 20px;}
#user_contents #maker .desc.maitre .message_title{
	display: block; width: 15em;
}
#user_contents #maker .desc.maitre .message_img{ width: 27%; float: right;}
/*PC*/ body:not(.spView) #user_contents #maker .desc.maitre .message_text{ padding-top: 1.3em;}

		/*圧倒的実力*/
#user_contents #maker .desc.ability{ display: block;}
#user_contents #maker .desc.ability .message_title{ display: block; width: 15em;}
/*PC*/ body:not(.spView) #user_contents #maker .desc.ability .message_title{ width: 25.5em; margin-bottom: 30px;}
#user_contents #maker .desc.ability .message_img{ margin: 0 1em 0.5em 0; width: 50%; float: left;}
/*PC*/ body:not(.spView) #user_contents #maker .desc.ability .message_img{ width: 35%; float: left;}

		/*旨さ*/
#user_contents #maker .desc.taste{ display: block;}
#user_contents #maker .desc.taste .message_title{ display: block; width: 15em;}
/*PC*/ body:not(.spView) #user_contents #maker .desc.taste .message_title{ width: 25.5em; margin-bottom: 30px;}
#user_contents #maker .desc.taste .message_img{ margin: 0 0 1em 0.5em; width: 50%; float: right;}
/*PC*/ body:not(.spView) #user_contents #maker .desc.taste .message_img{ width: 35%; float: right;}

		/*ブランド*/
#user_contents #maker .desc.brand{ display: block;}
/*sp*/ body.spView #user_contents #maker .desc.brand .message_title{ width: 15.6em;}

#user_contents #maker .desc.brand .shop_img{
	margin: 0 0 0.5em 1em;
}

/*PC*/ body:not(.spView) #user_contents #maker .desc.brand .shop_img{
	float: right; width: 35%; 
}


#user_contents #maker .desc.brand .shop_info{ font-size: 80%; line-height: 1.1em;}





/*▲▲#A_appealアレオスアピール*******************/



/*▼▼#product商品前説/#item商品説明 見出し装飾*******************/
#user_contents .sec_hd.deco_gold{
	position: relative;
}


/*PC*/body:not(.spView) #user_contents .sec_hd.deco_gold{
	margin-bottom: 40px;
	width: calc( 1100px - 0 );
	background: #1e0706;
}
#user_contents .sec_hd.deco_gold::before,
#user_contents .sec_hd.deco_gold::after{
	content: "";
	position: absolute;
	width: calc( 100% - 26vw ); height: 15vw;
	background: url( /comimg/svg/ornament_corner02_gold.svg ) left top / auto 100% no-repeat;
}
/*PC*/body:not(.spView) #user_contents .sec_hd.deco_gold::before,
/*PC*/body:not(.spView) #user_contents .sec_hd.deco_gold::after{ height: 180px;}

#user_contents .sec_hd.deco_gold::before{ top: 0; left: 10vw;}
#user_contents .sec_hd.deco_gold::after{ bottom: 0; right: 10vw; transform: scale(-1,-1);}
/*PC*/body:not(.spView) #user_contents .sec_hd.deco_gold::before{ left: 0;}
/*PC*/body:not(.spView) #user_contents .sec_hd.deco_gold::after{ right: 0;}



/*▼▼#product商品前説*******************/
#user_contents #product{
	padding-bottom: 10px; color: #fff; background: #1e0807;
}

#user_contents #product .desc_box{ padding-top: 1em;}


/*PC*/body:not(.spView) #user_contents #product .sec_hd.deco_gold{
	width: calc(1100px - 30px);
}


/*▲▲#product商品前説*******************/

/*▼▼#item商品説明*******************/
#user_contents #item{
	padding-bottom: 10px; color: #fff; background: #1e0807;
}
/*PC*/body:not(.spView) #user_contents #item{ padding-bottom: 50px;}

/*sp*/ body.spView #user_contents #item .sec_hd{ margin-bottom: 20px;}


	/*アイテム外枠*/
#user_contents #item .month_box{}
/*PC*/ body:not(.spView) #user_contents #item .month_box{
	margin: 10px auto 50px;
	width: 1100px;
	display: grid;
	grid-template-columns: 1fr 1fr; 
	gap: 35px;
}

	/*アイテム内側*/
#user_contents #item .month_box .month{}
#user_contents #item .month_box .month{
	position: relative;
}


/*PC*/body:not(.spView) #user_contents #item .month_box .month{
	padding: 15px;
	background: #140404;
	border: 1px solid #4b4742;
	border-radius: 20px;
	overflow: hidden;
}
#user_contents #item .month_box .month::before,
#user_contents #item .month_box .month::after{
	content: "";
	position: absolute; top: 14vw; left: 0;
	width: 100%; height: 6vw;
	background: url( /comimg/svg/wing_left_01.svg ) 27% center / auto 100%  no-repeat;
}
#user_contents #item .month_box .month::after{ transform: scaleX( -1 );}
/*PC*/body:not(.spView) #user_contents #item .month_box .month::before,
/*PC*/body:not(.spView) #user_contents #item .month_box .month::after{
	top: 80px; height: 40px; background-position: 23% center;
}



#user_contents #item .month_box .month .detail{
	position: relative; padding-top: calc( 10px + 24vw );
}
/*PC*/body:not(.spView) #user_contents #item .month_box .month .detail{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	padding-top: calc( 140px );
}



#user_contents #item .month_box .month .detail .mois{
	position: absolute; top: 0px; left: 50%; transform: translateX( -50% );
	width: 24%;
}
/*PC*/body:not(.spView) #user_contents #item .month_box .month .detail .mois{
	width: 130px;
}


#user_contents #item .month_box .month .detail .photo{ display: none;}

	/*商品説明 外枠*/
#user_contents #item .month_box .month .detail .item_group{
	display: grid;
	grid-template-rows: repeat(3, auto);
	grid-template-columns: 1fr;
	gap: 16px;
}
/*PC*/body:not(.spView) #user_contents #item .month_box .month .detail .item_group{
	grid-template-rows: repeat(3, calc((540px - ( 16px * 2 ) ) / 3));
}
	/*アイテム内側(細かい)*/
#user_contents #item .month_box .month .detail .item_group .catch{
	display: none;
	padding: 5px 10px;
}
#user_contents #item .month_box .month .item_group .item_desc{
	position: relative;
	display: grid;
	grid-template-columns: 30% 1fr;
	grid-template-rows: min-content min-content;
	grid-template-areas:
	"ITEM_ICON ITEM_NAME"
	"ITEM_ICON ITEM_TEXT";
}
/*PC*/body:not(.spView) #user_contents #item .month_box .month .item_group .item_desc{
	grid-template-columns: 170px 1fr;
	grid-template-rows: 74px 1fr;
	gap: 5px 10px;
}


#user_contents #item .month_box .month .item_group .item_desc.cow{}
#user_contents #item .month_box .month .item_group .item_desc.sheep{}
#user_contents #item .month_box .month .item_group .item_desc.goat{}
#user_contents #item .month_box .month .item_group .item_desc.buffalo{}

#user_contents #item .month_box .month .item_group .item_desc .item_icon{
	grid-area: ITEM_ICON;
}

/*sp*/ body.spView #user_contents #item .month_box .month .item_group .item_desc .item_icon .item_icon_img{ width: 100%;}
/*PC*/body:not(.spView) #user_contents #item .month_box .month .item_group .item_desc .item_icon .item_icon_img{ height: 170px; width: auto;}


#user_contents #item .month_box .month .item_group .item_desc .item_name{
	grid-area: ITEM_NAME;
	padding: 0 5px 10px 10px;
}
/*PC*/body:not(.spView) #user_contents #item .month_box .month .item_group .item_desc .item_name{
	font-size: 24px; line-height: 1.1em;
}

#user_contents #item .month_box .month .item_group .item_desc .text{
	grid-area: ITEM_TEXT;
	padding: 0 5px 10px 10px;

}
#user_contents #item .month_box .month .item_group .item_desc .item_badge{
	position: absolute; left: 1px; top: 1px; width: 10%;
	
}


#user_contents #item .month_box .month .item_group .item_desc .volume{ font-size: 70%;}

/*annotation_list*/
body:not(.spView) #user_contents .annotation_list{ padding-left: 520px;}

/*▲▲#item商品説明*******************/
/*▼▼#instruct説明書・手紙*******************/
#user_contents #instruct{
	padding-bottom: 20px;
	color: #fff;
	background: url( /5ac00/img/instruct/instruct_bg.jpg ) center center / cover no-repeat;
}
/*PC*/body:not(.spView) #user_contents #instruct{
	padding-bottom: 50px;
}

#user_contents #instruct .sec_hd{ text-shadow: 4px 4px 2px black;}


/*▲▲#instruct説明書・手紙*******************/
/*▼▼#reco推薦コメント*******************/

#user_contents #reco{}
/*PC*/body:not(.spView) #user_contents #reco{ padding-top: 50px;}

	/*▽見出し*/
#user_contents #reco .reco_box .reco_box_title{
	position: relative;
	margin-bottom: 20px; height: 41vw;
	font-size: 5vw; color: #491a0a;
	background: url( /5ac00/img/reco/sp_reco_box_title_bg.svg ) left center / 100% auto  no-repeat;
}
/*PC*/body:not(.spView) #user_contents #reco .reco_box .reco_box_title{
	padding-top: 45px; height: 194px; font-size: 34px;
	background-image: url( /5ac00/img/reco/reco_box_title_bg.svg );
}


/*sp*/body.spView #user_contents #reco .reco_box .reco_box_title .lead{
	position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	width: 100%;
}


	/*▽推薦*/
#user_contents #reco .praise{ position: relative; display: grid;}
/*sp*/ body.spView #user_contents #reco .praise{
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 46.5vw 24vw 1fr;
	gap: 5px;
	grid-template-areas: "PHOTO CATCH" "PHOTO INTRO" "TEXTBOX TEXTBOX";
}

/*PC*/ body:not(.spView) #user_contents #reco .praise{
	grid-template-columns: 300px 1fr;
	grid-template-rows: 150px 1fr 72px;
	gap: 10px 40px;
	grid-template-areas: "PHOTO CATCH" "PHOTO TEXTBOX" "INTRO TEXTBOX";
}
#user_contents #reco .praise .photo{ grid-area: PHOTO;}
#user_contents #reco .praise .introduction{ grid-area: INTRO;}
#user_contents #reco .praise .catch{ grid-area: CATCH;}
#user_contents #reco .praise .text_box{ grid-area: TEXTBOX;}


/*PC*/body:not(.spView) #user_contents #reco .reco_box{
	padding-bottom: 50px; font-size: 18px;
	/*background: url( /5ac00/img/reco/reco_box_bg.png ) 86% 88% / 184px auto no-repeat;*/
}

#user_contents #reco .praise .photo{ position: relative;}
#user_contents #reco .praise .photo .badge_box{
	position: absolute; bottom: 0; left: 50%; transform: translateX( -50% );
	width: 34vw; text-align: center;
}
/*PC*/ body:not(.spView) #user_contents #reco .praise .photo .badge_box{ width: 219px;}
#user_contents #reco .praise .photo .badge_box .badge{ width: 48%;}

/*sp*/ body.spView #user_contents #reco .praise .catch{ padding-top: 7vw; text-align: center;}
/*PC*/ body:not(.spView) #user_contents #reco .praise .catch{ font-size: 34px; line-height: 1.7em;}

#user_contents #reco .praise .introduction{ text-align: center;}
/*PC*/ body:not(.spView) #user_contents #reco .praise .introduction{ font-size: 20px; line-height: 1.7em;}
/*sp*/ body.spView #user_contents #reco .praise .introduction .name{ margin-bottom: 7px;}
#user_contents #reco .praise .text_box{ line-height: 1.15em;}
/*PC*/ body:not(.spView) #user_contents #reco .praise .text_box{ padding-top: 18px; font-size: 24px;}
/*PC*/ body:not(.spView) #user_contents #reco .praise .text_box .text{ margin-bottom: 0.8em;}



/*▲▲#reco推薦コメント*******************/
/*▼▼#user_voiceお客様の声*******************/
#user_contents #user_voice{
	padding-bottom: 10px;
}

	/*▽見出し*/
#user_contents #user_voice .reco_box .reco_box_title{
	position: relative;
	margin-bottom: 20px; height: 41vw;
	font-size: 5vw; color: #491a0a;
	background: url( /5ac00/img/reco/sp_reco_box_title_bg.svg ) left center / 100% auto  no-repeat;
}
/*PC*/body:not(.spView) #user_contents #user_voice .reco_box .reco_box_title{
	padding-top: 45px; height: 194px; font-size: 34px;
	background-image: url( /5ac00/img/reco/reco_box_title_bg.svg );
}
/*sp*/body.spView #user_contents #user_voice .reco_box .reco_box_title .lead{
	position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	width: 100%;
}

	/*▽voice_box*/
#user_contents #user_voice .voice_box{}
#user_contents #user_voice .voice_box .line{
	margin: 10px 2px; padding: 5px;
	color: #111; background: #fff; border-radius: 5px;
}
#user_contents #user_voice .voice_box .line .title{ font-size: 17px;}
/*PC*/body:not(.spView) #user_contents #user_voice .voice_box .line .title{ font-size: 28px;}
#user_contents #user_voice .voice_box .name{ text-align: right;}


/*▲▲#user_voiceお客様の声*******************/

/*▼▼#faqよくあるご質問*******************/

#user_contents #faq{ margin-bottom: 0; padding-bottom: 0;}

#user_contents #faq .faq_box .question{ color: #fff; background: #1e0807;}
#user_contents #faq .faq_box .answer::before{ color: #1e0807;}
#user_contents #faq .faq_box .answer b{ color: #b00;}

/*▲▲#faqよくあるご質問*******************/
/*▼▼#closingクロージング*******************/
#user_contents #closing,
#user_contents #closing .sec_box{ margin: 0 auto; padding: 0;}



#user_contents #closing .sec_hd{
	position: relative;
	margin: 10vw auto 5vw;
	color: #960000;
	border: 7px double #960000;
	border-width: 7px 0;
}
/*PC*/ body:not(.spView) #user_contents #closing .sec_hd{
	margin: 100px auto 50px; font-size: 36px; border-width: 24px 0;
}



	/*メッセージ*/
#user_contents #closing .letter_box{ position: relative;}
#user_contents #closing .letter_box::before{
	content: "";
	display: inline-block; width: 3.3em; height: 2.8em;
	background: url( /5ac00/img/closing/closing_mail.gif ) center top / 100% auto no-repeat;
	opacity: 0.5;
}
/*sp*/ body.spView #user_contents #closing .letter_box::before{
	margin: 0.5em; float: left; transform: rotate(-18deg);
}

/*PC*/ body:not(.spView) #user_contents #closing .letter_box::before{
	position: absolute; left: 50%; top: 126px; transform: translateX(-530px) rotate(-18deg);
	width: 130px; height: 93px;
}


/*PC*/ body:not(.spView) #user_contents #closing .letter_box .box_com{ padding-left: 180px; font-size: 28px;}
#user_contents #closing .letter_box .signature{ text-align: right;}
/*sp*/ body.spView #user_contents #closing .letter_box .signature{ margin-top: 16px;}
#user_contents #closing .letter_box .signature img{ max-width: 550px;}

	/*金額*/

#user_contents #closing .closing_alleosse img{ vertical-align: bottom;}
#user_contents #closing .closing_box .bg_box{
	background:
		linear-gradient(to right,#ffffff 0%,#ffffff 100%) center bottom / 100% 20vw no-repeat,
		linear-gradient(to right,#e3cf3f 0%,#f5e8ae 50%,#e3cf3f 100%) center center / cover;
}
/*PC*/ body:not(.spView) #user_contents #closing .closing_box .bg_box{
	background-size: 100% 160px,cover;
}


#user_contents #closing .closing_price{ padding: 10px;}




/*PC*/ body:not(.spView) #user_contents #closing .closing_message{ margin: 0 auto; width: 830px;}
/*▲▲#closingクロージング*******************/
