@charset "UTF-8";

/*------------------------------------------------------------
common
------------------------------------------------------------ */
#suntory_contents .dakara_index img {
	width: 100%;
	vertical-align: bottom;
}

/*------------------------------------------------------------
[SP]
------------------------------------------------------------ */
@media screen and (max-width:767px){
	#suntory_contents .pc_item{
		display: none;
	}

	#suntory_contents .dakara_index {
		padding: 8vw 0 4vw;
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3", sans-serif;
		font-weight: normal;
		font-feature-settings: "palt";
	}
	#suntory_contents .dakara_index .inner {
		margin: 0 4vw;
	}
	#suntory_contents .dakara_index h1 {
		display: block;
		margin: 0 auto 8vw;
		width: 32vw;
		height: 32vw;
		background: url(../img/img_idx_mainlogo.svg) no-repeat center top / 32vw;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#suntory_contents .dakara_index .product {
		margin-bottom: 16vw;
	}
	#suntory_contents .dakara_index .product h2 {
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#suntory_contents .dakara_index .product a {
		display: block;
		width: 88.8vw;
		height: 88vw;
		border: 1.6vw solid #b9d3ea;
		border-radius: 3.2vw;
		position: relative;
	}
	#suntory_contents .dakara_index .product a::after {
		content: "";
		display: block;
		position: absolute;
		width: 88.8vw;
		height: 12vw;
		bottom:-13.6vw;
		background: url(../img/img_idx_click.svg) no-repeat center top / auto 12vw;
	}
	#suntory_contents .dakara_index .product#dakara_fresh a {
		background: #f1f2f4 url(../img/img_fresh.jpg) no-repeat center top / 88.8vw;
	}
	#suntory_contents .dakara_index .product#dakara_fresh .lead {
		position: absolute;
		display: block;
		width: 48vw;
		top: 52.8vw;
		left:36vw;
		color: #14439a;
		font-size: 3.73333333vw;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_mineral a {
		background: #3382c6 url(../img/img_mineral.jpg) no-repeat center top / 88.8vw;
	}
	#suntory_contents .dakara_index .product#dakara_mineral .catch {
		margin-top: 4vw;
		line-height: 1;
		font-size: 4.8vw;
		font-weight: bold;
		color: #005BAB;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_mineral .lead {
		position: absolute;
		display: block;
		width: 51.2vw;
		top: 52.8vw;
		left:34.4vw;
		color: #fff;
		font-size: 3.73333333vw;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_mineral .note {
		position: absolute;
		width: 100%;
		line-height: 1;
		font-size: 2.66666667vw;
		color: #fff;
		text-align: center;
		bottom: 5.6vw;
		left: 0;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin a {
		border: 1.6vw solid #000;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin a::after {
		content: "";
		display: block;
		position: absolute;
		width: 88.8vw;
		height: 12vw;
		bottom:-13.6vw;
		background: url(../img/img_idx_click_wvitamin.svg) no-repeat center top / auto 12vw;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin a {
		background: #cacaca url(../img/img_wvitamin.jpg) no-repeat center top / 88.8vw;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin .catch {
		margin-top: 4vw;
		line-height: 1;
		font-size: 4.8vw;
		font-weight: bold;
		color: #000;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin .lead {
		position: absolute;
		display: block;
		width: 56.2vw;
		top: 52.8vw;
		left: 31vw;
		color: #000;
		font-size: 3.73333333vw;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin .note {
		position: absolute;
		width: 100%;
		line-height: 1.2;
		font-size: 2.66666667vw;
		color: #000;
		text-align: center;
		bottom: 4.6vw;
		left: 0;
	}
	#suntory_contents .dakara_index .product#dakara_spcider a {
		border: 1.6vw solid #ed7200;
	}
	#suntory_contents .dakara_index .product#dakara_spcider a::after {
		content: "";
		display: block;
		position: absolute;
		width: 88.8vw;
		height: 12vw;
		bottom:-13.6vw;
		background: url(../img/img_idx_click_spcider.svg) no-repeat center top / auto 12vw;
	}
	#suntory_contents .dakara_index .product#dakara_spcider a {
		background: #fff180 url(../img/img_spcider.jpg) no-repeat center top / 88.8vw;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .catch {
		margin-top: 4vw;
		line-height: 1;
		font-size: 4vw;
		font-weight: bold;
		color: #000;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .lead {
		position: absolute;
		display: block;
		width: 56.2vw;
		top: 50.8vw;
		left: 31vw;
		color: #000;
		font-size: 3.73333333vw;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .note {
		position: absolute;
		width: 100%;
		line-height: 1.2;
		font-size: 2.66666667vw;
		color: #000;
		text-align: center;
		bottom: 0.3vw;
		left: 0;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater a {
		border: 1.6vw solid #1c98d5;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater a::after {
		content: "";
		display: block;
		position: absolute;
		width: 88.8vw;
		height: 12vw;
		bottom:-13.6vw;
		background: url(../img/img_idx_click_vitaminwater.svg) no-repeat center top / auto 12vw;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater a {
		background: #a2e3ff url(../img/img_vitaminwater.jpg?202405) no-repeat center top / 88.8vw;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .catch {
		margin-top: 4vw;
		line-height: 1;
		font-size: 4.8vw;
		font-weight: bold;
		color: #000;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .lead {
		position: absolute;
		display: block;
		width: 56.2vw;
		top: 52.8vw;
		left: 31vw;
		color: #000;
		font-size: 3.73333333vw;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .note {
		position: absolute;
		width: 100%;
		line-height: 1.2;
		font-size: 2.66666667vw;
		color: #000;
		text-align: center;
		bottom: 4.6vw;
		left: 0;
	}




}
/*------------------------------------------------------------
[PC]
------------------------------------------------------------ */
@media print, screen and (min-width:768px) {

	#suntory_contents .sp_item{
		display: none;
	}

	#suntory_contents .dakara_index {
		width: 920px;
		margin: 0 auto 100px;
		vertical-align: bottom;
	}
	#suntory_contents .dakara_index h1 {
		display: block;
		margin: 20px auto;
		width: 130px;
		height: 130px;
		background: url(../img/img_idx_mainlogo.svg) no-repeat center top / 130px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#suntory_contents .dakara_index .inner {
		display:flex;
		flex-flow: row wrap;
		justify-content: space-between;
		align-items: flex-start;
    	width: 920px;
    	margin: 0 auto;
	}
	#suntory_contents .dakara_index .product {
		width: 450px;
		margin-top: 80px;
	}
	#suntory_contents .dakara_index .product:nth-of-type(1),
	#suntory_contents .dakara_index .product:nth-of-type(2) {
		margin-top: 0;
	}
	#suntory_contents .dakara_index .product h2 {
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#suntory_contents .dakara_index .product a {
		display: block;
		width: 440px;
		height: 420px;
		border: 5px solid #b9d3ea;
		border-radius: 15px;
		position: relative;
	}
	#suntory_contents .dakara_index .product a::after {
		content: "";
		display: block;
		position: absolute;
		width: 450px;
		height: 45px;
		bottom: -50px;
		background: url(../img/img_idx_click.svg) no-repeat center top / auto 45px;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin a::after {
		content: "";
		display: block;
		position: absolute;
		width: 450px;
		height: 45px;
		bottom: -50px;
		background: url(../img/img_idx_click_wvitamin.svg) no-repeat center top / auto 45px;
		color: #ffffff;
	}
	#suntory_contents .dakara_index .product#dakara_spcider a::after {
		content: "";
		display: block;
		position: absolute;
		width: 450px;
		height: 45px;
		bottom: -50px;
		background: url(../img/img_idx_click_spcider.svg) no-repeat center top / auto 45px;
		color: #ffffff;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater a::after {
		content: "";
		display: block;
		position: absolute;
		width: 450px;
		height: 45px;
		bottom: -50px;
		background: url(../img/img_idx_click_vitaminwater.svg) no-repeat center top / auto 45px;
		color: #ffffff;
	}
	#suntory_contents .dakara_index .product a:hover {
		opacity: .75;
	}
	#suntory_contents .dakara_index .product#dakara_fresh a {
		background: #f1f2f4 url(../img/img_fresh.jpg) no-repeat center top / 440px;
	}
	#suntory_contents .dakara_index .product#dakara_fresh .lead {
		position: absolute;
		display: block;
		width: 250px;
		top: 260px;
		left:180px;
		color: #14439a;
		font-size: 15px;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_mineral a {
		background: #3382c6 url(../img/img_mineral.jpg) no-repeat center top / 440px;
	}
	#suntory_contents .dakara_index .product#dakara_mineral .catch {
		margin-top: 18px;
		line-height: 1;
		font-size: 22px;
		font-weight: bold;
		color: #005BAB;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_mineral .lead {
		position: absolute;
		display: block;
		width: 250px;
		top: 260px;
		left: 172px;
		color: #fff;
		font-size: 15px;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_mineral .note {
		position: absolute;
		width: 100%;
		line-height: 1;
		font-size: 12px;
		color: #fff;
		text-align: center;
		bottom: 25px;
		left: 0;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin a {
		background: #cacaca url(../img/img_wvitamin.jpg) no-repeat center top / 440px;
		border: 5px solid #000;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin .catch {
		margin-top: 18px;
		line-height: 1;
		font-size: 22px;
		font-weight: bold;
		color: #000;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin .lead {
		position: absolute;
		display: block;
		width: 250px;
		top: 260px;
		left: 153px;
		color: #000;
		font-size: 15px;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_wvitamin .note {
		position: absolute;
		width: 100%;
		line-height: 1.2;
		font-size: 12px;
		color: #000;
		text-align: center;
		bottom: 10px;
		left: 0;
	}
	#suntory_contents .dakara_index .product#dakara_spcider a {
		background: #fff180 url(../img/img_spcider.jpg) no-repeat center top / 440px;
		border: 5px solid #ed7200;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .catch {
		margin-top: 18px;
		line-height: 1;
		font-size: 20px;
		font-weight: bold;
		color: #000;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .catch .annotation {
		display: inline-block;
		transform: translateY(-3px);
		font-size: 13px;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .lead {
		position: absolute;
		display: block;
		width: 270px;
		top: 260px;
		left: 153px;
		color: #000;
		font-size: 15px;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_spcider .note {
		position: absolute;
		width: 100%;
		line-height: 1.2;
		font-size: 12px;
		color: #000;
		text-align: center;
		bottom: 2px;
		left: 0;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater a {
		background: #a2e3ff url(../img/img_vitaminwater.jpg?202405) no-repeat center top / 440px;
		border: 5px solid #1c98d5;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .catch {
		margin-top: 18px;
		line-height: 1;
		font-size: 22px;
		font-weight: bold;
		color: #000;
		text-align: center;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .catch .annotation {
		display: inline-block;
		transform: translateY(-6px);
		font-size: 13px;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .lead {
		position: absolute;
		display: block;
		width: 270px;
		top: 260px;
		left: 153px;
		color: #000;
		font-size: 15px;
		line-height: 1.5;
		font-weight: bold;
	}
	#suntory_contents .dakara_index .product#dakara_vitaminwater .note {
		position: absolute;
		width: 100%;
		line-height: 1.2;
		font-size: 12px;
		color: #000;
		text-align: center;
		bottom: 9px;
		left: 0;
	}

}