@charset "utf-8";

/*==================================================
事業内容
================================================== */

/*==================================================
[sp] #jihanki_mv
================================================== */
#jihanki_mv {
	margin-bottom: 16vw;
}

/*#jihanki_mv .deco.vending_img {
	width: 24vw;
	height: 37.33333333vw;
	top: 24vw;
	right: var(--value-sp20);
}

#jihanki_mv .deco.vending_img img {
	border-radius: 0;
}*/

/*==================================================
[sp] #buz_vending
================================================== */
#buz_vending .deco.manbou {
	right: calc(var(--value-sp10) * -1);
	top: 18.13333333vw;
}

/*==================================================
[sp] #buz_btob
================================================== */
#buz_btob .deco.shell {
	left: calc(var(--value-sp10) * -1);
	top: 9.6vw;
}

/*業務内容リスト 共通*/
#buz_tasklist ol li {
	list-style: decimal;
	margin: 0 0 0 1.5em;
	font-size: var(--value-sp20);
	font-weight: 600;
	line-height: 1.5;
}

#buz_tasklist ol li+li {
	margin-top: var(--value-sp32);
}

#buz_tasklist ol li p.summary_txt {
	font-size: var(--font-base);
	font-weight: 300;
	line-height: 1.75;
	margin: 2.133333333vw 0 0;
}

/*==================================================
[sp] #buz_setupflow
================================================== */
#buz_setupflow .deco.kumanomi {
	right: calc(var(--value-sp10) * -1);
	top: 9.6vw;
}

#buz_setupflow .crown_txt {
	text-align: center;
	color: var(--color-primary);
	font-size: 6.4vw;
	font-weight: 600;
	line-height: 1;
	padding: 0 0 6.4vw;
	margin: 0 0 1.333333333vw;
	background: url(/okinawa/business/img/bg_baloon.svg) no-repeat center bottom /38.4vw;
}

#buz_setupflow ol.flowchart {
	margin: 8vw 0 0;
}

#buz_setupflow ol.flowchart li {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: center;
	height: 18.13333333vw;
	padding: 0 0 0 33.6vw;
	font-size: 4vw;
	line-height: 1.5;
	font-weight: 600;
	position: relative;
	margin-bottom: 17.06666667vw;
	background: no-repeat left 8vw center / contain;
}

#buz_setupflow ol.flowchart li::after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 17.06666667vw;
	bottom: -17.06666667vw;
	right: 0;
	background: url(/okinawa/business/img/set_arrow.svg) no-repeat center center /7.466666667vw;
}

#buz_setupflow ol.flowchart li.flow01 {
	background-image: url(/okinawa/business/img/set_flow01.svg);
}

#buz_setupflow ol.flowchart li.flow02 {
	background-image: url(/okinawa/business/img/set_flow02.svg);
}

#buz_setupflow ol.flowchart li.flow03 {
	background-image: url(/okinawa/business/img/set_flow03.svg);
}

#buz_setupflow ol.flowchart li.flow04 {
	background-image: url(/okinawa/business/img/set_flow04.svg);
}

#buz_setupflow ol.flowchart li.flow05 {
	margin: 0;
	background-image: url(/okinawa/business/img/set_flow05.svg);
}

#buz_setupflow ol.flowchart li.flow05::after {
	content: none;
}

#buz_setupflow h3.bluebg .num {
	display: block;
	float: left;
	margin-right: 0.25em;
}

#buz_setupflow h3.bluebg .txt {
	display: block;
	overflow: hidden;
}

#buz_setupflow .img_right {
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: center;
	gap: var(--value-sp32);
}

#buz_setupflow .img_right .fig {
	width: 63.2vw;
}


/*==================================================
[sp] #buz_interest
================================================== */
#buz_interest .deco.turtle {
	left: calc(var(--value-sp10) * -1);
	top: 21.06666667vw;
}

#buz_interest .summary_txt {
	font-weight: 600;
	font-size: 4.8vw;
}

#buz_interest .horizontal_flex {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: flex-end;
	gap: var(--value-sp24);
	margin: var(--value-sp32) 0 0;
}

#buz_interest .horizontal_flex .vending {
	width: 23.73333333vw;
}

#buz_interest .horizontal_flex .dispenser_wh {
	width: 18.66666667vw;
	padding: 0 0 2.4vw;
}


/*==================================================
[sp] #fountain_mv
================================================== */
#fountain_mv {
	margin-bottom: 16vw;
}

#fountain_mv .deco.machine_img {
	width: 19.2vw;
	height: 29.06666667vw;
	top: 32vw;
	right: var(--value-sp20);
}

#fountain_mv .deco.machine_img img {
	border-radius: 0;
}

/*==================================================
[sp] #buz_syrup
================================================== */
#buz_syrup h3.subhead {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 52vw;
	height: 14.4vw;
	margin: 0 auto var(--value-sp32);
	padding: 0;
	line-height: 1;
	font-weight: 600;
	font-size: 6.4vw;
	background: var(--color-water-down);
	border-radius: 7.2vw;
}

#buz_syrup .img_label+h3.subhead {
	margin-top: 14.4vw;
}

#buz_syrup .lineup_note {
	font-weight: 600;
	text-align: center;
}

#buz_syrup .img_label {
	width: 100%;
	margin: var(--value-sp32) auto 0;
}

#buz_syrup .img_label#lu_noshugar {
	width: 64.8vw;
}

/*==================================================
[sp] #buz_setup
================================================== */
#buz_setup .img_left {
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: var(--value-sp32);
}

#buz_setup .img_left .fig {}

#buz_setup .img_left .text .small_title {
	display: block;
	padding: 2.133333333vw;
	background: var(--color-primary);
	color: var(--color-white);
	font-size: 4.8vw;
	line-height: 1.5;
	font-weight: 600;
}

#buz_setup .img_left .text ol {
	list-style: none;
	counter-reset: item;
}

#buz_setup .img_left .text li {
	position: relative;
	padding-left: 2em;
	margin: 3.2vw 0 0;
	font-size: var(--font-base);
	line-height: 1.5;
	font-weight: 600;
}

#buz_setup .img_left .text li::before {
	counter-increment: item;
	content: counter(item);
	position: absolute;
	left: 0;
	top: 0;
	width: var(--value-sp24);
	height: var(--value-sp24);
	background: var(--color-primary);
	border-radius: 50%;
	color: var(--color-white);
	font-size: 3.733333333vw;
	font-weight: 600;
	line-height: var(--value-sp24);
	text-align: center;
}

#buz_setup .img_left .text li .notes {
	display: block;
	font-size: 3.733333333vw;
	line-height: 1.75;
	font-weight: 300;
}

#buz_setup .img_left .text .cautions {
	display: block;
	padding: 4.266666667vw;
	margin: var(--value-sp10);
	border: 1px solid var(--color-red);
}

#buz_setup .img_left .text .cautions p {
	color: var(--color-red);
	font-size: 3.733333333vw;
	line-height: 1.75;
	font-weight: 600;
	text-indent: -3em;
	margin-left: 3em;
}

/*==================================================
[sp] #buz_conditions
================================================== */
#buz_conditions .horizontal_flex {
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: var(--value-sp24);
	margin-top: var(--value-sp32);
}

#buz_conditions .summary_txt {
	text-align: center;
}

#buz_conditions dl {
	border: 1px solid var(--color-light-gray);
	border-radius: var(--value-sp24);
	overflow: hidden;
}

#buz_conditions dt {
	padding: var(--value-sp20);
	font-size: var(--value-sp24);
	color: var(--color-primary);
	font-weight: 600;
	line-height: 1.75;
	background: var(--color-water-down);
}

#buz_conditions dd {
	padding: var(--value-sp32) var(--value-sp20);
	font-size: var(--font-base);
	line-height: 1.75;
}

#buz_conditions dd strong {
	font-weight: 600;
	color: var(--color-primary);
}

#buz_conditions .not_met {
	display: block;
	margin: var(--value-sp32) 0 0;
	padding: 0 0 0 12.8vw;
	position: relative;
}

#buz_conditions .not_met::before {
	content: "";
	display: block;
	position: absolute;
	width: var(--value-sp32);
	height: var(--value-sp32);
	top: 0;
	left: 0;
	background: url(/okinawa/assets/img/icon_exclamation.svg) no-repeat right center / var(--value-sp32);
}

#buz_conditions .not_met .line-highlight {
	background-image: linear-gradient(transparent 45%, var(--color-water-down) 45%, var(--color-water-down) 100%);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	padding: 0.1em 0;
	font-size: var(--value-sp20);
	font-weight: 600;
	line-height: 1.75;
}

/*==================================================
[sp] #md_mv 量販事業
================================================== */
#md_mv {
	margin-bottom: var(--value-sp32);
}

/*==================================================
[sp] #buz_md
================================================== */
#buz_md .deco.seahorse {
	right: -1.066666667vw;
	top: 21.86666667vw;
}

#buz_md .img_center {
	margin-top: var(--value-sp32);
}

#buz_md .img_center .fig {
	margin: 0;
	width: 100%;
}

/*==================================================
[sp] #buz_headquarters
================================================== */
#buz_headquarters .deco.eagleray {
	left: calc(var(--value-sp10) * -1);
	top: 13.86666667vw;
}

#buz_headquarters .img_center {
	margin-bottom: var(--value-sp32);
}

#buz_headquarters .img_center .fig {
	margin: 0;
	width: 100%;
}

/*==================================================
[sp] #buz_ma
================================================== */
#buz_ma .deco.kumanomi {
	right: calc(var(--value-sp10) * -1);
	top: 24.8vw;
}

#buz_ma .img_center {
	margin-bottom: var(--value-sp32);
}

#buz_ma .img_center .fig {
	margin: 0;
	width: 100%;
}

#buz_ma .horizontal_flex {
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: center;
	gap: var(--value-sp24);
	margin: var(--value-sp32) auto 0;
}

/*==================================================
[sp] #whole_mv
================================================== */
#whole_mv {
	margin-bottom: 16vw;
}

/*==================================================
[sp] #buz_wholesale
================================================== */
#buz_wholesale .deco.coral_a {
	left: calc(var(--value-sp10) * -1);
	top: 24vw;
}

#buz_wholesale .horizontal_flex {
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: center;
	gap: var(--value-sp24);
	margin: var(--value-sp32) auto 0;
}

#buz_wholesale .horizontal_flex .fig {
	width: 63.2vw;
}

@media (min-width: 768px) {

	/*==================================================
[PC] #jihanki_mv
================================================== */
	#jihanki_mv {
		margin-bottom: var(--value-pc80);
	}

/*	#jihanki_mv .deco.vending_img {
		width: 206px;
		height: 322px;
		top: 118px;
		right: var(--value-pc80);
	}
*/
	/*==================================================
[PC] #buz_vending
================================================== */
	#buz_vending .deco.manbou {
		right: -25px;
		top: 38px;
	}

	/*==================================================
[PC] #buz_btob
================================================== */
	#buz_btob .deco.shell {
		left: -42px;
		top: 36px;
	}

	/*業務内容リスト 共通*/
	#buz_tasklist ol li {
		font-size: 20px;
	}

	#buz_tasklist ol li+li {
		margin-top: 32px;
	}

	#buz_tasklist ol li p.summary_txt {
		margin: 8px 0 0;
	}

	/*==================================================
[PC] #buz_setupflow
================================================== */
	#buz_setupflow .deco.kumanomi {
		right: -22px;
		top: 102px;
	}

	#buz_setupflow .summary_txt {
		width: fit-content;
	}

	#buz_setupflow .crown_txt {
		font-size: 24px;
		padding: 0 0 24px;
		margin: 0 0 5px;
		background-size: 144px;
	}

	#buz_setupflow ol.flowchart {
		margin: 56px 0 0;
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: center;
	}

	#buz_setupflow ol.flowchart li {
		display: block;
		width: 120px;
		height: 120px;
		padding: 75px 0 0;
		font-size: 15px;
		line-height: 1.5;
		text-align: center;
		margin: 0 80px 0 0;
		background-position: center top;
		background-size: 76px;
		position: relative;
	}

	#buz_setupflow ol.flowchart li::after {
		content: "";
		display: block;
		position: absolute;
		width: 80px;
		height: 120px;
		right: -80px;
		bottom: 0;
		background: url(/okinawa/business/img/set_arrow_r.svg) no-repeat center center /16px;
	}

	#buz_setupflow .img_right {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: flex-start;
		gap: 40px;
		width: 912px;
		margin: 0 auto;
	}

	#buz_setupflow .img_right .fig {
		width: 240px;
		height: 160px;
		flex-shrink: 0;
	}

	/*==================================================
[PC] #buz_interest
================================================== */
	#buz_interest .deco.turtle {
		left: 43px;
		top: 57px;
	}

	#buz_interest .summary_txt {
		width: fit-content;
		font-size: 20px;
	}

	#buz_interest .horizontal_flex {
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: flex-end;
		gap: 58px;
		margin: 40px 0 0;
	}

	#buz_interest .horizontal_flex .vending {
		width: 206px;
		height: 322px;
	}

	#buz_interest .horizontal_flex .dispenser_wh {
		width: 163px;
		height: 248px;
		padding: 0 0 20px;
	}

	/*==================================================
[PC] #fountain_mv
================================================== */
	#fountain_mv {
		margin-bottom: var(--value-pc80);
	}

	#fountain_mv .deco.machine_img {
		width: 176px;
		height: 268px;
		top: 172px;
		right: var(--value-pc80);
	}

	/*==================================================
[PC] #buz_syrup
================================================== */
	#buz_syrup h3.subhead {
		width: 240px;
		height: 54px;
		margin-bottom: var(--value-pc32);
		font-size: 24px;
		border-radius: 27px;
	}

	#buz_syrup .img_label+h3.subhead {
		margin-top: var(--value-pc32);
	}

	#buz_syrup .img_label {
		width: 574px;
		margin: var(--value-pc32) auto 0;
	}

	#buz_syrup .img_label#lu_noshugar {
		width: 473px;
	}

	/*==================================================
[PC] #buz_setup
================================================== */
	#buz_setup .img_left {
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: flex-start;
		gap: var(--value-pc40);
	}

	#buz_setup .img_left .fig {
		width: 500px;
		height: 561px;
	}

	#buz_setup .img_left .text .small_title {
		display: block;
		padding: 8px;
		font-size: 18px;
	}

	#buz_setup .img_left .text {
		width: 420px;
	}

	#buz_setup .img_left .text li {
		margin: 10px 0 0;
	}

	#buz_setup .img_left .text li::before {
		width: var(--value-pc24);
		height: var(--value-pc24);
		font-size: 14px;
		line-height: var(--value-pc24);
	}

	#buz_setup .img_left .text li .notes {
		font-size: 14px;
	}

	#buz_setup .img_left .text .cautions {
		padding: 16px;
		margin: var(--value-pc10);
	}

	#buz_setup .img_left .text .cautions p {
		font-size: 14px;
	}

	/*==================================================
[PC] #buz_conditions
================================================== */
	#buz_conditions .horizontal_flex {
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: flex-start;
		gap: var(--value-pc32);
		margin-top: var(--value-pc32);
	}

	#buz_conditions dl {
		border-radius: var(--value-pc24);
		width: 464px;
	}

	#buz_conditions dt {
		padding: var(--value-pc32);
		font-size: var(--value-pc24);
	}

	#buz_conditions dd {
		padding: var(--value-pc32);
	}

	#buz_conditions .not_met {
		width: fit-content;
		margin: var(--value-pc32) auto 0;
		padding: 0 0 0 48px;
		position: relative;
	}

	#buz_conditions .not_met::before {
		width: var(--value-pc32);
		height: var(--value-pc32);
		background-size: var(--value-pc32);
		top: 4px;
	}

	#buz_conditions .not_met .line-highlight {
		font-size: 20px;
	}

	/*==================================================
[PC] #md_mv 量販事業
================================================== */
	#md_mv {
		margin-bottom: var(--value-pc80);
	}

	/*==================================================
[PC] #buz_md
================================================== */
	#buz_md .deco.seahorse {
		right: -10px;
		top: 27px;
	}

	#buz_md .img_center {
		margin-top: 32px;
	}

	#buz_md .img_center .fig {
		margin: 0 auto;
		width: 574px;
	}

	/*==================================================
[PC] #buz_headquarters
================================================== */
	#buz_headquarters .deco.eagleray {
		left: -20px;
		top: -44px;
	}

	#buz_headquarters .img_center {
		margin-bottom: var(--value-pc40);
	}

	#buz_headquarters .img_center .fig {
		margin: 0 auto;
		width: 574px;
	}


	/*==================================================
[PC] #buz_ma
================================================== */
	#buz_ma .deco.kumanomi {
		right: -22px;
		top: 74px;
	}

	#buz_ma .img_center {
		margin-bottom: var(--value-pc32);
	}

	#buz_ma .img_center .fig {
		margin: 0 auto;
		width: 574px;
	}

	#buz_ma .horizontal_flex {
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: flex-start;
		gap: 32px;
		margin: 40px auto 0;
		width: 100%;
	}

	/*==================================================
[sp] #whole_mv
================================================== */
	#whole_mv {
		margin-bottom: 80px;
	}

	/*==================================================
[sp] #buz_wholesale
================================================== */
	#buz_wholesale .deco.coral_a {
		left: -30px;
		top: 42px;
	}

	#buz_wholesale .horizontal_flex {
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: flex-start;
		gap: 30px;
		margin: 40px auto 0;
		width: 100%;
	}

	#buz_wholesale .horizontal_flex .fig {
		width: 300px;
	}



}