@charset "UTF-8";

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
dt,
dd,
th,
td,
pre,
caption,
address {
	margin: 0;
}

@font-face {
	font-family: "Pike";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/Pike/Pike-Regular.woff") format("woff");
}

@font-face {
	font-family: "Pike";
	font-style: normal;
	font-weight: 700;
	src: url("/common/fonts/Pike/Pike-bold.woff") format("woff2");
}

@font-face {
	font-family: "SoDoSans";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/SoDoSans/SoDoSans-Regular.woff") format("woff2");
}

@font-face {
	font-family: "SoDoSans SemiBold";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/SoDoSans/SoDoSans-SemiBold.woff") format("woff");
}

@font-face {
	font-family: "SoDoSans Black";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/SoDoSans/SoDoSans-Black.woff") format("woff");
}

@font-face {
	font-family: "SoDoSans Bold";
	font-style: normal;
	font-weight: 700;
	src: url("/common/fonts/SoDoSans/SoDoSans-Bold.woff") format("woff");
}

.ContentsBox img {
  display: block;
}


:root {
	--color-gold: #D5BD69;
  --color-white: #ffffff;
  --color-dark-bg-text: #E8C689;
  --color-pink: #F9D1CB;
  --color-yellow: #EBD56C;
  --color-lightgreen: #EFED72;
  --color-black: rgba(0, 0, 0, 0.87);
  --color-green: #006241;
}



.mainContents {
	overflow-x: hidden;
	overflow-x: clip;
}

.mainContents img {
	width: 100%;
}

h2,
h3 {
	margin: 0;
}

p {
	margin: 0;
	letter-spacing: 0;
}

a {
	opacity: 1;
	transition: all 0.3s ease;
}

a:hover {
	opacity: 0.8;
	transition: all 0.3s ease;
}


.section_inner {
  padding: 0 24px;
}



@media print,
screen and (min-width: 1024px) {
	.is-pc {
		display: block;
	}

	.is-sp {
		display: none;
	}
}

@media screen and (max-width: 911px) {
	.is-pc {
		display: none;
	}

	.is-sp {
		display: block;
	}
}

/* ----------------------------------------------------------
bg
---------------------------------------------------------- */
@media print, screen and (max-width: 911px) {
.pc-left_bg,
.pc-right_bg {
	display: none;
}
}

@media print, screen and (min-width: 910px) {
  /* .ContentsBoxWrap {
    overflow: hidden;
  } */
  .section_inner {
    padding: 0 52px;
  }

  .mainContentsWrap {
    display: flex;
  }
  .ContentsBoxBg {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    height: 100vh;
    z-index: -1;
    background: linear-gradient(180deg, #256E53 0%, #00372F 100%);
  }


	.mainContents .mainContentsIn .is-fixed.is-bottom {
		top: auto;
		bottom: 0;
		position: absolute;
	}
  .pc-left_bg,
	.pc-right_bg {
		position: sticky;
		display: block;
    top: 0;
    left: 0;
    /* width: calc(50vw - 229.33px); */
    height: 0;
		z-index: 0;
    visibility: visible;
    opacity: 1;
	}
  .pc-right_bg {
    width: calc(50vw - 97px);
  }
  .pc-left_bg {
    width: calc(50vw - 96px);
  }



  .pc-left_bgIn {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: calc(50vw - 216px);
    height: 86vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .pc-right_bgIn {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: calc(50vw - 216px);
    height: 86vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 32px;
  }


  .pc-right_bgIn a {
    display: block;
  }

  .pc-left_bgIn img {
    width: 194.93px;
    display: block;
  }
  .pc-right_bgIn img {
    width: min(377px ,calc(377/1440*100vw));
  }

  .ContentsBoxWrap {
    flex-shrink: 0;
  }
	.ContentsBox {
    position: relative;
		max-width: 430px;
		width: 100%;
		margin: 0 auto;
    box-shadow: 0px 8px 16px 0px #0000007A;
    z-index: 1;
	}

  .mainContents .block-banner,
  .mainContents .block-line,
  .mainContents .block-survey,
  footer, footer.footerWrap {
    position: relative;
    z-index: 1;
  }
  
  .pc-left_bg.is-fade,
  .pc-right_bg.is-fade {
    height: auto;
    top: auto;
    bottom: 150px;
    transition-duration: 0.2s;
    /* visibility: hidden;
    opacity: 0;
    transition-duration: 0.2s; */
  }
  .pc-left_bg.is-fade .pc-left_bgIn,
  .pc-right_bg.is-fade .pc-right_bgIn {
    top: auto;
    bottom: 150px;
    transition-duration: 0.2s;
  }

}
@media print, screen and (min-width: 910px) and (max-width: 1100px) {
  .pc-left_bg {
    width: calc(50vw - 150px);
  }
}
/* ----------------------------------------------------------
Kv
---------------------------------------------------------- */
.section_kv {
  background: linear-gradient(180deg, #256E53 0%, #00372F 100%);
}
.section_kv .section_inner {
  padding: calc(24/375*100vw) calc(24/375*100vw) calc(45/375*100vw); 
}
.kv_img {
  position: relative;
}
.kv_ttl {
  position: absolute;
  top: calc(175/375*100vw);
  left: 0;
  right: 0;
  width: calc(279/375*100vw);
  height: calc(200/375*100vw);
  z-index: 1;
  margin: auto;
}

.kv_img_link01 {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(125/375*100vw);
  height: calc(183/375*100vw);
  z-index: 1;
}

.kv_img_link02 {
  position: absolute;
  top: 0;
  left: calc(125/375*100vw);
  width: calc(125/375*100vw);
  height: calc(183/375*100vw);
  z-index: 1;
}

.kv_img_link03 {
  position: absolute;
  top: 0;
  left: calc(250/375*100vw);
  width: calc(125/375*100vw);
  height: calc(183/375*100vw);
  z-index: 1;
}

.kv_img_link04 {
  position: absolute;
  top: calc(183/375*100vw);
  left: 0;
  width: calc(125/375*100vw);
  height: calc(183/375*100vw);
  z-index: 1;
}

.kv_img_link05 {
  position: absolute;
  top: calc(183/375*100vw);
  left: calc(250/375*100vw);
  width: calc(125/375*100vw);
  height: calc(183/375*100vw);
  z-index: 1;
}
.kv_text {
  color: var(--color-gold);
  text-align: center;
}

.kv_text._01 {
  font-family: "Noto Serif JP", serif;
  font-size: calc(24/375*100vw);
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 5%;
  margin-bottom: calc(9/375*100vw);
}
.kv_text._02 {
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: calc(15/375*100vw);
  line-height: 180%;
  letter-spacing: 5%;
  margin-bottom: calc(33/375*100vw);
}
.kv_text._03 {
  font-weight: 400;
  font-size: calc(14/375*100vw);
  line-height: 150%;
  letter-spacing: 0;
  vertical-align: middle;
}

@media print, screen and (min-width: 910px) {
  .section_kv .section_inner {
    padding: 24px 24px 45px;
  }
  .kv_ttl {
    /* top: 175px;
    right: 0;
    left: 0;
    width: 279px;
    height: 200px; */
    top: 203px;
    right: 0;
    left: 0;
    width: 314px;
    height: 200px;
  }
  .kv_img_link01 {
    position: absolute;
    top: 0;
    left: 0;
    width: 143px;
    height: 209px;
    z-index: 1;
  }
  
  .kv_img_link02 {
    position: absolute;
    top: 0;
    left: 125px;
    width: 143px;
    height: 209px;
    z-index: 1;
  }
  
  .kv_img_link03 {
    position: absolute;
    top: 0;
    left: 250px;
    width: 143px;
    height: 209px;
    z-index: 1;
  }
  
  .kv_img_link04 {
    position: absolute;
    top: 183px;
    left: 0;
    width: 143px;
    height: 209px;
    z-index: 1;
  }
  
  .kv_img_link05 {
    position: absolute;
    top: 183px;
    left: 250px;
    width: 143px;
    height: 209px;
    z-index: 1;
  }
  .kv_text._01 {
    font-size: 24px;
    margin-bottom: 9px;
  }
  .kv_text._02 {
    font-size: 15px;
    margin-bottom: 33px;
  }
  .kv_text._03 {
    font-size: 14px;
  }
}

/* ----------------------------------------------------------
frap common
---------------------------------------------------------- */

/* KV部分 */
.frap_kv_ttl {
  width: calc(254/375*100vw);
  height: calc(171/375*100vw);
  margin: calc(49/375*100vw) auto 0;
}
.frap_kv_img {
  display: block;
  position: absolute;
  width: calc(158/375*100vw);
  height: calc(293/375*100vw);
  left: calc(108/375*100vw);
  top: calc(152/375*100vw);
  cursor: pointer;
}
.frap_kv_img img {
  display: block;
}


/* KV下 */
.frap_border {
  width: calc(342.5/375*100vw);
  height: calc(1/375*100vw);
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
  margin: 0 auto;
  opacity: 0.5;
}
.frap_ttl a {
  display: block;
  font-weight: 700;
  font-size: calc(20/375*100vw);
  line-height: 140%;
  text-align: center;
  margin-top: calc(33/375*100vw);
  margin-bottom: calc(16/375*100vw);
}
.frap_ttl a span {
  display: block;
  font-weight: 700;
  font-size: calc(16/375*100vw);
  line-height: 130%;
}
.frap_lead {
  font-weight: 500;
  font-size: calc(15/375*100vw);
  line-height: 180%;
  text-align: center;
  margin-bottom: calc(40/375*100vw);
}
.frap_flex {
  display: flex;
  align-items: center;
  gap: calc(16/375*100vw);
}
.frap_flex._left {
  justify-content: flex-end;
  margin-bottom: calc(24/375*100vw);
}
.frap_flex._right {
  justify-content: flex-start;
  margin-bottom: calc(50/375*100vw);
}
.frap_flex_item_img {
  width: calc(160/375*100vw);
  height: calc(160/375*100vw);
  flex-shrink: 0;
}
.frap_flex_item_text {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 180%;
}
._left .frap_flex_item_text {
  text-align: right;
}
._right .frap_flex_item_text {
  text-align: left;
}

.frap_page_link {
  display: flex;
  gap: calc(25/375*100vw);
}
.frap_page_link_img {
  width: calc(89/375*100vw);
}
.frap_page_link_text_ttl {
  margin-bottom: calc(5/375*100vw);
}
.frap_page_link_text_ttl a {
  font-weight: 700;
  font-size: calc(20/375*100vw);
  line-height: 140%;
}
.frap_page_link_text_ttl a span {
  font-size: calc(13/375*100vw);
  display: block;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.frap_page_link_text_price {
	font-family: "SoDoSans SemiBold";
	font-style: normal;
	font-weight: 400;
  font-size: calc(20/375*100vw);
  line-height: 150%;
}
.frap_page_link_text_price span {
  margin-right: calc(9/375*100vw);
}
.frap_page_link_text_price._noncafe {
  display: flex;
  align-items: center;
}
.frap_page_link_text_price ._noncafe_text {
  border-radius: calc(4/375*100vw);
  border: 1px solid #F9D1CB;
  padding: calc(3/375*100vw) calc(6/375*100vw);
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 100%;
  letter-spacing: 0%;
  margin: 0 0 0 calc(8/375*100vw);
}

.section_yogurt .frap_page_link_text_price ._noncafe_text {
  border-color: #F9D1CB;
}
.section_melon .frap_page_link_text_price ._noncafe_text {
  border-color: #EFED72;
}



.frap_page_link_text_btn {
  width: calc(214/375*100vw);
  height: calc(56/375*100vw);
  background: var(--color-dark-bg-text);
  border-radius: 50px;
  margin-top: calc(17/375*100vw);
}
.frap_page_link_text_btn._cookie {
  background: #E8C689;
}
.frap_page_link_text_btn._yogurt {
  background: #F9D1CB;
}
.frap_page_link_text_btn._hojicha {
  background: #EBD56C;
  margin-top: calc(15/375*100vw);
}
.frap_page_link_text_btn._melon {
  background: #EFED72;
}


.frap_page_link_text_btn a {
  display: block;
  font-weight: 700;
  font-size: calc(16/375*100vw);
  text-align: center;
  line-height: calc(56/375*100vw);
  color: #1C0600;
}
.frap_page_link_text_btn._cookie a {
  color: #490500;
}
.frap_page_link_text_btn._yogurt a {
  color: #9A261F;
}
.frap_page_link_text_btn._hojicha a {
  color: #754C10;
}
.frap_page_link_text_btn._melon a {
  color: #004300;
}

.frap_page_link_btn {
  width: 100%;
  height: calc(56 / 375 * 100vw);
  border: 1px solid var(--color-gold);
  border-radius: calc(100 / 375 * 100vw);
  padding: calc(10 / 375 * 100vw) calc(20 / 375 * 100vw);
  background: transparent;
  margin: calc(48/375*100vw) auto 0;
}
.frap_page_link_btn a {
  line-height: calc(34/375*100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(16/375*100vw);
  font-weight: 700;
  gap: calc(8/375*100vw);
}
.frap_page_link_btn a img {
  width: calc(32 / 375 * 100vw);
  height: calc(32 / 375 * 100vw);
}
.frap_page_link_text_note {
  position: relative;
  font-weight: 400;
  font-size: calc(12/375*100vw);
  line-height: 150%;
  text-align: center;
  margin-top: calc(16/375*100vw);
  /* left: calc(-6 / 375 * 100vw); */
}

.border {
  width: 100%;
  height: calc(2/375*100vw);
  background: linear-gradient(90deg, #B5A14E -1.84%, #CCBC78 9.56%, #DAD191 16.82%, #E5E0A5 25.12%, #E8E4AC 27.19%, #EAE7B0 30.3%, #E8E3AA 34.45%, #E3DCA1 39.63%, #C9B976 57.26%, #C3AF6D 65.56%, #CAB979 71.78%, #CEBE7F 74.89%, #D7CE90 81.11%, #DDD699 87.33%, #D5CB89 90.45%, #D2C783 91.48%, #CBBE76 94.59%, #C1B062 96.67%, #BBA957 98.74%, #B39D46 100.81%);
}
@media print, screen and (min-width: 910px) {
  /* KV部分 */
  .frap_kv_ttl {
    width: 254px;
    height: 171px;
    margin: 49px auto 0;
  }
  .frap_kv_img {
    display: block;
    position: absolute;
    width: 158px;
    height: 293px;
    left: 136px;
    top: 152px;
    cursor: pointer;
  }


  /* KV下 */
  .frap_border {
    width: 342.5px;
    height: 1px;
  }
  .frap_ttl a {
    font-size: 20px;
    margin-top: 33px;
    margin-bottom: 0;
  }
  .frap_ttl a span {
    font-size: 16px;
    line-height: 140%;
  }
  .frap_lead {
    font-size: 15px;
    margin-top: 16px;
    margin-bottom: 40px;
  }
  .frap_flex {
    gap: 16px;
  }
  .frap_flex._left {
    margin-bottom: 24px;
  }
  .frap_flex._right {
    margin-bottom: 48px;
  }
  .frap_flex_item_img {
    width: 160px;
    height: 160px;
  }
  .frap_flex_item_text {
    font-size: 13px;
  }
  .frap_page_link_img {
    width: 89px;
  }
  .frap_page_link_text_ttl {
    margin-bottom: 5px;
  }
  .frap_page_link_text_ttl a {
    font-size: 20px;
  }
  .frap_page_link_text_ttl a span {
    font-size: 13px;
  }
  .frap_page_link_text_price {
    font-size: 20px;
  }
  .frap_page_link_text_price span {
    margin-right: 9px;
  }
  .frap_page_link_text_price ._noncafe_text {
    border-radius: 4px;
    padding: 3px 6px;
    font-size: 13px;
    margin: 0 0 0 8px;
  }
  .frap_page_link {
    gap: 25px;
  }
  .frap_page_link_text_btn {
    width: 214px;
    height: 56px;
    margin-top: 17px;
  }
  .frap_page_link_text_btn a {
    font-size: 16px;
    line-height: 56px;
  }
  .frap_page_link_btn {
    margin-top: 49px;
    height: 56px;
    border-radius: 100px;
    padding: 10px 20px;
    margin: 49px auto 0;
  }
  .frap_page_link_btn a {
    font-size: 16px;
    line-height: 34px;
    gap: 8px;
  }
  .frap_page_link_btn a img {
    width: 32px;
    height: 32px;
  }
  .frap_page_link_text_note {
    font-size: 12px;
    margin-top: 16px;
    /* left: -6px; */
  }
  .border {
    height: 2px;
  } 

  .frap_page_link_text_btn._hojicha {
    margin-top: 17px;
  }
}


/* ----------------------------------------------------------
section_coffeejelly
---------------------------------------------------------- */
.section_coffeejelly_kv {
  position: relative;
  background-image: url(/cafe/the-star-frappuccino/images/frap_coffee/bg.webp);
  height: calc(535/375*100vw);
  background-size: 100%;
  background-repeat: no-repeat;
  overflow: hidden;
}

.section_coffeejelly_kv_bg {
  position: absolute;
  width: calc(383/375*100vw);
  height: calc(624/375*100vw);
  bottom: calc(-114/375*100vw);
  right: calc(-36/375*100vw);
  overflow: hidden;
  z-index: 0;
}

.section_coffeejelly .section_text_wrap {
  background: linear-gradient(180deg, #4E2000 50%, #1C0600 100%);
  color: var(--color-dark-bg-text);
  padding-bottom: calc(95/375*100vw);
}

@media print, screen and (min-width: 910px) {
  .section_coffeejelly_kv {
    height: 535px;
  }
  .section_coffeejelly_kv_bg {
    /* width: 383px;
    height: 624px;
    bottom: -114px;
    right: -36px; */
    width: 383px;
    height: 624px;
    bottom: -115px;
    right: -10px;
  }
  .section_coffeejelly .section_text_wrap {
    padding-bottom: 95px;
  }
}


/* ----------------------------------------------------------
section_cookie
---------------------------------------------------------- */
.section_cookie_kv {
  position: relative;
  background-image: url(/cafe/the-star-frappuccino/images/frap_cookie/bg.webp);
  height: calc(535/375*100vw);
  background-size: 100%;
  background-repeat: no-repeat;
  overflow: hidden;
}
.section_cookie_kv_bg {
  position: absolute;
  width: calc(431/375*100vw);
  height: calc(536.5/375*100vw);
  bottom: calc(-27/375*100vw);
  right: calc(-23/375*100vw);
  overflow: hidden;
  z-index: 0;
}

.section_cookie .section_text_wrap {
  background: linear-gradient(180deg, #9C2600 50%, #490500 100%);
  color: var(--color-dark-bg-text);
  padding-bottom: calc(96/375*100vw);
}

.section_cookie .frap_border {
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
}

@media print, screen and (min-width: 910px) {     
  .section_cookie_kv {
    height: 535px;
  }
  .section_cookie_kv_bg {
    position: absolute;
    width: 431px;
    height: 536.5px;
    bottom: -27px;
    /* right: -23px; */
    right: 5px;
    overflow: hidden;
    z-index: 0;
  }
  .section_cookie .section_text_wrap {
    padding-bottom: 96px;
  }
}


/* ----------------------------------------------------------
section_yogurt
---------------------------------------------------------- */
.section_yogurt_kv {
  position: relative;
  background-image: url(/cafe/the-star-frappuccino/images/frap_yogurt/bg.webp);
  height: calc(535/375*100vw);
  background-size: 100%;
  background-repeat: no-repeat;
  overflow: hidden;
}
.section_yogurt_kv_bg {
  position: absolute;
  width: calc(615.5/375*100vw);
  height: calc(734/375*100vw);
  top: calc(26/375*100vw);
  right: calc(-121/375*100vw);
  overflow: hidden;
  z-index: 0;
}

.section_yogurt .section_text_wrap {
  background: linear-gradient(180deg, #D66D66 0%, #9A261F 100%);
  color: var(--color-pink);
  padding-bottom: calc(96/375*100vw);
}
.section_yogurt .frap_border {
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
}

.section_yogurt .frap_flex._right .frap_flex_item_img {
  width: calc(176/375*100vw);
  height: calc(180/375*100vw);
}
.section_yogurt .frap_flex._right {
  gap: 0;
  align-items: center;
  margin-bottom: calc(28/375*100vw);
}
.section_yogurt .frap_flex._right .frap_flex_item_text {
  margin-top: calc(-22/375*100vw);
}
.section_yogurt .frap_page_link_img {
  margin-top: calc(25/375*100vw);
}
.section_yogurt .frap_page_link_text_ttl {
  margin-bottom: calc(10/375*100vw);
}
.section_yogurt .frap_page_link_btn {
  margin-top: calc(47/375*100vw);
}
@media print, screen and (min-width: 910px) {     
  .section_yogurt_kv {
    height: 535px;
  }
  .section_yogurt_kv_bg {
    position: absolute;
    width: 615.5px;
    height: 734px;
    top: 26px;
    /* right: -121px; */
    right: -93px;
    overflow: hidden;
    z-index: 0;
  }
  .section_yogurt .section_text_wrap {
    padding-bottom: 96px;
  }
  .section_yogurt .frap_flex._right .frap_flex_item_img {
    width: 176px;
    height: 180px;
  }
  .section_yogurt .frap_flex._right .frap_flex_item_text {
    margin-top: -22px;
  }
  .section_yogurt .frap_flex._right {
    margin-bottom: 28px;
  }
  .section_yogurt .frap_page_link_img {
    margin-top: 25px;
  }
  .section_yogurt .frap_page_link_text_ttl {
    margin-bottom: 10px;
  }
  .section_yogurt .frap_page_link_btn {
    margin-top: 47px;
  }
}


/* ----------------------------------------------------------
section_hojicha
---------------------------------------------------------- */
.section_hojicha_kv {
  position: relative;
  background-image: url(/cafe/the-star-frappuccino/images/frap_hojicha/bg.webp);
  height: calc(535/375*100vw);
  background-size: 100%;
  background-repeat: no-repeat;
  overflow: hidden;
}
.section_hojicha_kv_bg {
  position: absolute;
  width: calc(413.5/375*100vw);
  height: calc(624/375*100vw);
  top: calc(25/375*100vw);
  right: calc(-19/375*100vw);
  overflow: hidden;
  z-index: 0;
}
.section_hojicha .frap_lead {
  margin-bottom: calc(30/375*100vw);
}
.section_hojicha .section_text_wrap {
  background: linear-gradient(180deg, #754C10 0%, #3D2D00 100%);
  color: var(--color-yellow);
  padding-bottom: calc(96/375*100vw);
}
.section_hojicha .frap_border {
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
}

.section_hojicha .frap_page_link_text_ttl {
  margin-bottom: calc(8/375*100vw);
}



@media print, screen and (min-width: 910px) {     
  .section_hojicha_kv {
    height: 535px;
  }
  .section_hojicha_kv_bg {
    position: absolute;
    width: 413.5px;
    height: 624px;
    top: 25px;
    /* right: -19px; */
    right: 9px;
    overflow: hidden;
    z-index: 0;
  }
  .section_hojicha .section_text_wrap {
    padding-bottom: 96px;
  }
  .section_hojicha .frap_lead {
    margin-bottom: 30px;
  }
  .section_hojicha .frap_page_link_text_ttl {
    margin-bottom: 8px;
  }
}

/* ----------------------------------------------------------
section_melon
---------------------------------------------------------- */
.section_melon_kv {
  position: relative;
  background-image: url(/cafe/the-star-frappuccino/images/frap_melon/bg.webp);
  height: calc(535/375*100vw);
  background-size: 100%;
  background-repeat: no-repeat;
  overflow: hidden;
}
.section_melon_kv_bg {
  position: absolute;
  width: calc(556.5/375*100vw);
  height: calc(683/375*100vw);
  top: calc(-35/375*100vw);
  right: calc(-119/375*100vw);
  overflow: hidden;
  z-index: 0;
}
.section_melon .section_text_wrap {
  background: linear-gradient(180deg, #2F5C16 0%, #004300 100%);
  color: var(--color-lightgreen);
  padding-bottom: calc(80/375*100vw);
}
.section_melon .frap_border {
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
}

.section_melon .frap_lead {
  margin-top: calc(3/375*100vw);
  margin-bottom: calc(6/375*100vw);
}
.section_melon .frap_lead sup {
  font-size: calc(8/375*100vw);
}
.section_melon .frap_lead_note {
  font-size: calc(12/375*100vw);
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  margin-bottom: calc(41/375*100vw);
}

@media print, screen and (min-width: 910px) {     
  .section_melon_kv {
    height: 535px;
  }
  .section_melon_kv_bg {
    position: absolute;
    width: 556.5px;
    height: 683px;
    top: -35px;
    /* right: -119px; */

  }
  .section_melon .section_text_wrap {
    padding-bottom: 80px;
  }
  .section_melon_kv_bg {
    width: 556.5px;
    height: 683px;
    top: -35px;
    right: -92px;
  }
  .section_melon .frap_lead {
    margin-top: 3px;
    margin-bottom: 6px;
  }
  .section_melon .frap_lead sup {
    font-size: 8px;
  }
  .section_melon .frap_lead_note {
    font-size: 12px;
    margin-bottom: 41px;
    letter-spacing: 0.04em;
  }
}

/* ----------------------------------------------------------
other area common parts
---------------------------------------------------------- */
.bg_green {
  background: linear-gradient(180deg, #006241 0%, #00371E 100%);
}
.other_inner {
  padding: 0 24px;
}

.border_btn {
  width: calc(240/375*100vw);
  height: calc(38/375*100vw);
  border: 1px solid var(--color-gold);
  border-radius: calc(100/375*100vw);
  padding: calc(10/375*100vw) calc(20/375*100vw);
  background: transparent;
  margin: 0 auto;
}
.border_btn._l {
  height: calc(48/375*100vw);
}
.border_btn a {
  display: block;
  font-size: calc(14/375*100vw);
  font-weight: 500;
  color: var(--color-gold);
  text-align: center;
  vertical-align: middle;
}
.border_btn._l a {
  font-size: calc(13/375*100vw);
}

.other_link {
  margin-top: calc(16/375*100vw);
}
.other_link a {
  display: block;
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 170%;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-offset: 0%;
  text-decoration-thickness: 0%;
  text-decoration-skip-ink: auto;
  color: var(--color-gold);
  text-align: center;
}

.other_btn_wrap {
  margin-top: calc(80/375*100vw);
}

.other_ttl {
  position: relative;
  left: calc(2/375*100vw);
	font-family: "Pike";
	font-style: normal;
	font-weight: 700;
  font-size: calc(60/375*100vw);
  line-height: 106%;
  letter-spacing: 10%;
  text-align: center;
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: calc(64/375*100vw);
}


.bev_ttl {
 padding-top: calc(16/375*100vw);
}
.bev_ttl a {
  display: block;
  font-weight: 700;
  font-size: calc(18/375*100vw);
  line-height: 140%;
  text-align: center;
  color: var(--color-gold);
}

.bev_price {
	font-family: "SoDoSans SemiBold";
	font-style: normal;
	font-weight: 400;
  font-size: calc(16/375*100vw);
  line-height: 150%;
  text-align: center;
  color: var(--color-gold);
}

.bev_text {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 180%;
  text-align: center;
  color: var(--color-gold);
  margin-top: calc(8/375*100vw);
}

.bev_btn {
  width: calc(200/375*100vw);
  height: calc(38/375*100vw);
  border-radius: calc(100/375*100vw);
  padding: calc(10/375*100vw) calc(20/375*100vw);
  background: var(--color-gold);
  margin: calc(23/375*100vw) auto 0;
}
.bev_btn a {
  display: block;
  font-size: calc(14/375*100vw);
  font-weight: bold;
  color: var(--color-green);
  text-align: center;
}

.inner_border {
  width: 100%;
  height: calc(2/375*100vw);
  background: linear-gradient(90deg, #B5A14E -1.84%, #CCBC78 9.56%, #DAD191 16.82%, #E5E0A5 25.12%, #E8E4AC 27.19%, #EAE7B0 30.3%, #E8E3AA 34.45%, #E3DCA1 39.63%, #C9B976 57.26%, #C3AF6D 65.56%, #CAB979 71.78%, #CEBE7F 74.89%, #D7CE90 81.11%, #DDD699 87.33%, #D5CB89 90.45%, #D2C783 91.48%, #CBBE76 94.59%, #C1B062 96.67%, #BBA957 98.74%, #B39D46 100.81%);
  margin: 0 auto;
}

.other_sub_ttl {
	font-family: "Pike";
	font-style: normal;
	font-weight: 700;
  font-size: calc(36/375*100vw);
  line-height: 106%;
  letter-spacing: 10%;
  text-align: center;
  background: linear-gradient(90deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.other_lead {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 180%;
  text-align: center;
  color: var(--color-gold);
}
.other_note {
  font-weight: 500;
  font-size: calc(12/375*100vw);
  line-height: 150%;
  text-align: center;
  color: var(--color-gold);
}


@media print, screen and (min-width: 910px) {
  .other_inner {
    padding: 0 52px;
  }
  .border_btn {
    width: 240px;
    height: 38px;
    border-radius: 100px;
    padding: 10px 20px;
  }
  .border_btn._l {
    height: 48px;
  }
  .border_btn a {
    font-size: 14px;
  }
  .border_btn._l a {
    font-size: 13px;
  }
  .other_link {
    margin-top: 16px;
  }
  .other_link a {
    font-size: 13px;
  }
  .other_btn_wrap {
    margin-top: 80px;
  }
  .other_ttl {
    left: 2px;
    font-size: 60px;
    margin-bottom: 64px;
  }
  .bev_ttl {
    padding-top: 16px;
  }
  .bev_ttl a {
    font-size: 18px;
  }
  .bev_price {
    font-size: 16px;
  }
  .bev_text {
    font-size: 13px;
    margin-top: 8px;
  }
  .bev_btn {
    width: 200px;
    height: 38px;
    border-radius: 100px;
    padding: 10px 20px;
    margin-top: 23px;
  }
  .bev_btn a {
    font-size: 14px;
  }
  .inner_border {
    height: 2px;
  }
  .other_sub_ttl {
    font-size: 36px;
  }
  .other_lead {
    font-size: 13px;
  }
  .other_note {
    font-size: 12px;
  }
  
}

/* ----------------------------------------------------------
section_food
---------------------------------------------------------- */
.food_flex {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(64/375*100vw);
}

.section_food {
  padding-top: calc(65/375*100vw);
  padding-bottom: calc(93/375*100vw);
}

.food_flex_item_img a:hover {
  opacity: 1;
}

@media print, screen and (min-width: 910px) {
  .food_flex {
    gap: 64px;
  }
  .section_food {
    padding-top: 65px;
    padding-bottom: 96px;
  }
}

/* ----------------------------------------------------------
section_coffee
---------------------------------------------------------- */
.section_coffee {
  padding-top: calc(64/375*100vw);
  padding-bottom: calc(96/375*100vw);
}
.coffee_flex_item_img {
  width: calc(229.5/375*100vw);
  margin: 0 auto;
}
.coffee_flex_item_img a:hover {
  opacity: 1;
}

.section_coffee .bev_ttl {
  padding-top: calc(20 / 375 * 100vw);
}
.section_coffee .bev_price {
  padding-top: calc(10 / 375 * 100vw);
}
.section_coffee .bev_text {
  margin-top: calc(18 / 375 * 100vw);
}
.section_coffee .bev_btn {
  margin-top: calc(19 / 375 * 100vw);
}


@media print, screen and (min-width: 910px) {
  .section_coffee {
    padding-top: 64px;
    padding-bottom: 96px;
  }
  .coffee_flex_item_img {
    width: 229.5px;
  }
  .section_coffee .bev_ttl {
    padding-top: 20px;
  }
  .section_coffee .bev_price {
    padding-top: 10px;
  }
  .section_coffee .bev_text {
    margin-top: 18px;
  }
  .section_coffee .bev_btn {
    margin-top: 19px;
  }
}

/* ----------------------------------------------------------
section_goods
---------------------------------------------------------- */
.section_goods {
  padding-top: calc(64/375*100vw);
  padding-bottom: calc(96/375*100vw);
}
.section_goods .other_ttl {
  margin-bottom: calc(14/375*100vw);
}
.section_goods .other_ttl span {
  display: block;
  font-family: "Pike";
  font-style: normal;
  font-weight: 700;
  font-size: 36px;
  line-height: 106%;
  letter-spacing: 10%;
  text-align: center;
}

.goods_img {
  width: calc(311/375*100vw);
  margin: calc(63/375*100vw) auto calc(48/375*100vw);
}

@media print, screen and (min-width: 910px) {
  .section_goods {
    padding-top: 64px;
    padding-bottom: 96px;
  }
  .section_goods .other_ttl {
    margin-bottom: 14px;
  }
  .goods_img {
    width: 311px;
    margin: 63px auto 48px;
  }
}

/* ----------------------------------------------------------
section_card
---------------------------------------------------------- */
.section_gift {
  padding-top: calc(64/375*100vw);
}
.section_card {
  padding-bottom: calc(80/375*100vw);
}
.section_card .other_sub_ttl {
  margin-bottom: calc(16/375*100vw);
}
.section_card .other_lead {
  margin-bottom: calc(24/375*100vw);
}

.card_img {
  width: calc(332/375*100vw);
  margin: 0 auto calc(-4/375*100vw);
}
.card_img a:hover {
  opacity: 1;
}
.section_card .other_note {
  margin-top: calc(6/375*100vw);
}
.section_card .other_btn_wrap {
  margin-top: calc(48/375*100vw);
}
.section_card .bev_btn {
  margin-top: calc(16/375*100vw);
}


@media print, screen and (min-width: 910px) {
  .section_gift {
    padding-top: 64px;
  }
  .section_card {
    padding-bottom: 80px;
  }
  .section_card .other_sub_ttl {
    margin-bottom: 16px;
  }
  .section_card .other_lead {
    margin-bottom: 24px;
  }
  .card_img {
    width: 332px;
    margin: 0 auto -4px;
  }
  .section_card .other_note {
    margin-top: 6px;
  }
  .section_card .other_btn_wrap {
    margin-top: 48px;
  }
  .section_card .bev_btn {
    margin-top: 16px;
  }
}

/* ----------------------------------------------------------
section_dscg
---------------------------------------------------------- */
.section_dscg {
  padding-bottom: calc(82/375*100vw);
}
.section_dscg .other_sub_ttl {
  margin-bottom: calc(16/375*100vw);
}
.section_dscg .other_lead {
  margin-bottom: calc(24/375*100vw);
}
.dscg_img {
  width: calc(180/375*100vw);
  margin: 0 auto calc(46/375*100vw);
}
.dscg_img a:hover {
  opacity: 1;
}

@media print, screen and (min-width: 910px) {
  .section_dscg {
    padding-bottom: 80px;
  }
  .section_dscg .other_sub_ttl {
    margin-bottom: 16px;
  }
  .section_dscg .other_lead {
    margin-bottom: 24px;
  }
  .dscg_img {
    width: 180px;
    margin: 0 auto 46px;
  }
}

/* ----------------------------------------------------------
section_egift
---------------------------------------------------------- */
.section_egift {
  padding-bottom: calc(94/375*100vw);
}
.section_egift .other_sub_ttl {
  margin-bottom: calc(24/375*100vw);
}
.egift_img {
  display: flex;
  justify-content: center;
  gap: calc(20/375*100vw);
  margin-bottom: calc(48/375*100vw);
}
.egift_img img {
  display: block;
  width: calc(153/375*100vw);
  height: calc(153/375*100vw);
}

@media print, screen and (min-width: 910px) {
  .section_egift {
    padding-bottom: 94px;
  }
  .section_egift .other_sub_ttl {
    margin-bottom: 24px;
  }
  .egift_img {
    gap: 20px;
    margin-bottom: 48px;
  }
  .egift_img img {
    width: 153px;
    height: 153px;
  }
}
/* ----------------------------------------------------------
section_30years
---------------------------------------------------------- */
.section_30years {
  position: relative;
  content: "";
  background: url(/cafe/the-star-frappuccino/images/30years/bg.webp) no-repeat center top / cover;
  background-color: var(--color-white);
  height: calc(472/375*100vw);
  top: 0;
  left: 0;
  box-sizing: border-box;
  z-index: 1;
}

.section_30years_title {
  width: calc(240/375*100vw);
  padding-top: calc(32/375*100vw);
  margin: 0 auto calc(48/375*100vw);
}

.section_30years_text {
  color: var(--color-black);
  text-align: center;
  font-weight: 700;
  font-size: calc(14/375*100vw);
  line-height: 180%;
  letter-spacing: 10%;
  margin-bottom: calc(24/375*100vw);
}

.section_30years_btn a:hover {
  opacity: 1;
}

@media print, screen and (min-width: 910px) {
  .section_30years {
    height: 472px;
  }
  .section_30years_title {
    width: 240px;
    padding-top: 32px;
    margin-bottom: 48px;
  }
  .section_30years_text {
    font-size: 14px;
    margin-bottom: 24px;
  }
}


/* ----------------------------------------------------------
section_quest
---------------------------------------------------------- */
.section_quest {
  margin-top: calc(110/375*100vw);
}
.quest_kv img {
  border-radius: calc(16/375*100vw) calc(16/375*100vw) 0 0;
}
.quest_text {
  padding: calc(32/375*100vw) calc(16/375*100vw) calc(40/375*100vw);
  background: linear-gradient(0deg, #006241 31.28%, #1E3932 100.01%);
  border-radius: 0 0 calc(16/375*100vw) calc(16/375*100vw);
}

.quest_text_img {
  margin-bottom: calc(24/375*100vw);
}
.quest_text_img img {
  display: block;
}

.quest_text_btn {
  width: 100%;
  background-color: var(--color-white);
  border-radius: calc(100/375*100vw);
  margin-bottom: calc(16/375*100vw);
}
.quest_text_btn a {
  display: block;
  color: #006241;
  font-size: calc(16/375*100vw);
  font-weight: 700;
  text-align: center;
  padding: calc(19/375*100vw) 0;

}
.quest_text_note li {
  color: var(--color-white);
  line-height: 150%;
  text-indent: -1em;
  padding-left: 1em;
  font-size: calc(12/375*100vw);
}


@media print, screen and (min-width: 910px) {
  .section_quest {
    margin-top: 110px;
  }
  .quest_kv img {
    border-radius: 16px 16px 0 0;
  }
  .quest_text {
    padding: 32px 16px 40px;
    border-radius: 0 0 16px 16px;
  }
  .quest_text_img {
    margin-bottom: 24px;
  }
  .quest_text_img img {
    display: block;
  }
  .quest_text_btn {
    border-radius: 100px;
    margin-bottom: 16px;
  }
  .quest_text_btn a {
    font-size: 16px;
    padding: 19px 0;
  }
  .quest_text_note li {
    font-size: 12px;
  }
}



/* ----------------------------------------------------------
section_vote
---------------------------------------------------------- */
.section_vote {
  position: relative;
  background: linear-gradient(180deg, #DEC581 0%, #FBF7CE 50%, #DEC581 100%);
}
.section_vote::before {
  content: "";
  background: url(/cafe/the-star-frappuccino/images/vote/vote_bg.webp) no-repeat center top / cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(280/375*100vw);
  z-index: 1;
  box-sizing: border-box;
}
.vote_kv_img {
  position: relative;
  z-index: 2;
  width: calc(311.5/375*100vw);
  padding-top: calc(10/375*100vw);
  margin: 0 auto;
}
.vote_ttl {
  position: relative;
  z-index: 2;
  width: calc(289/375*100vw);
  margin: calc(28/375*100vw) auto calc(15/375*100vw);
}
.vote_period {
  position: relative;
  width: fit-content;
  text-align: center;
  margin: 0 auto calc(16/375*100vw);
}
.vote_period span {
	font-family: "SoDoSans Bold";
	font-style: normal;
	font-weight: 700;
  color: var(--color-white);
}
.vote_period span._s {
  font-size: calc(12/375*100vw);
}
.vote_period span._m {
  font-size: calc(14/375*100vw);
}
.vote_period span._l {
  font-size: calc(16/375*100vw);
}

.vote_text {
  font-weight: 500;
  font-size: calc(15/375*100vw);
  line-height: 180%;
  text-align: center;
  color: var(--color-black);
  margin-bottom: calc(32/375*100vw);
}
.vote_method {
  border-top: calc(1/375*100vw) solid var(--color-green);
  border-bottom: calc(1/375*100vw) solid var(--color-green);
  padding: calc(6/375*100vw) 0 calc(4/375*100vw);
  gap: calc(8/375*100vw);
  text-align: center;
  font-size: calc(18/375*100vw);
  font-weight: 700;
  line-height: calc(28/375*100vw);  
  color: var(--color-green);
  margin-bottom: calc(16/375*100vw);
}
.vote_method_text {
  font-weight: 500;
  font-size: calc(15/375*100vw);
  line-height: 180%;
  text-align: left;
  color: var(--color-black);
  margin-bottom: calc(40/375*100vw);
}
.vote_method_text span {
  font-weight: 500;
  font-size: calc(15/375*100vw);
  line-height: 180%;
  color: var(--color-black);
  box-decoration-break: clone;  
  -webkit-box-decoration-break: clone;
  background-color: var(--color-white);
  display: ruby;
}
.vote_method_text span._bold {
  font-weight: 700;
}
.vote_note {
  margin: calc(40/375*100vw) 0 calc(40/375*100vw) calc(4/375*100vw);
}
.vote_note li {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: calc(23/375*100vw);
  color: var(--color-black);
  text-indent: -1em;
  padding-left: 1.1em;
}

.vote_result_text {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 180%;
  text-align: center;
}
.vote_result_note {
  font-weight: 500;
  font-size: calc(12/375*100vw);
  line-height: 150%;
  text-align: center;
  color: var(--color-black);
}

/* 投票数ランキングエリア */
.section_vote_ranking_wrap {
  position: relative;
  background-image: url(/cafe/the-star-frappuccino/images/vote/vote_ranking_bg.webp);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: calc(85/375*100vw);
  margin: calc(44.5/375*100vw) 0 calc(39/375*100vw);
  width: 100%;
  height: calc(968/375*100vw);
}
.vote_ranking_text {
  font-weight: 700;
  font-size: calc(32/375*100vw);
  line-height: 28px;
  text-align: center;
  color: var(--color-green);
  margin-bottom: calc(16/375*100vw);
}
.vote_ranking_date {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 180%;
  text-align: center;
  color: var(--color-black);
  margin-bottom: calc(20/375*100vw);
}
.vote_ranking_item {
  display: flex;
  align-items: center;
  gap: calc(16/375*100vw);
  border-top: 1px solid var(--color-gold);
}
.vote_ranking_item:last-of-type {
  border-bottom: 1px solid var(--color-gold);
}
.vote_ranking_item_img {
  width: calc(93.33/375*100vw);
  flex-shrink: 0;
}
.vote_ranking_item_text {
  flex: 1;
}
.vote_ranking_item_text_ttl {
  font-weight: 700;
  font-size: calc(15/375*100vw);
  line-height: 140%; 
  margin-bottom: calc(9/375*100vw);
}
.vote_ranking_item_text_ttl span {
  font-size: calc(12/375*100vw);
  font-weight: 700;
  vertical-align: bottom;
}
._01 .vote_ranking_item_text_ttl {
  color: #964B00; 
}
._02 .vote_ranking_item_text_ttl {
  color: #962000; 
}
._03 .vote_ranking_item_text_ttl {
  color: #E0442C; 
}
._04 .vote_ranking_item_text_ttl {
  color: #8F1F00; 
}
._05 .vote_ranking_item_text_ttl {
  color: #2AA003; 
}
.vote_ranking_item_text_vote {
	font-family: "SoDoSans Bold";
	font-style: normal;
	font-weight: 700;
  font-size: calc(22/375*100vw);
  line-height: 100%;
  color: var(--color-black);
  text-align: right;
}
.vote_ranking_item_text_vote span {
  font-weight: 700;
  font-size: calc(11/375*100vw);
  line-height: 100%;
  color: var(--color-black);
  margin: 0 calc(8/375*100vw);
}

.vote_border {
  margin-bottom: calc(40/375*100vw);
}


.vote_vote_btn {
  width: fit-content;
  position: relative;
  font-weight: 700;
  font-size: calc(18/375*100vw);
  line-height: 140%;
  color: var(--color-green);
  text-align: center;
  margin: 0 auto;
  margin-bottom: calc(13/375*100vw);
}
.vote_vote_btn::before {
  content: "";
  display: inline-block;
  width: calc(1/375*100vw);
  height: calc(24/375*100vw);
  transform: rotate(150deg);
  position: absolute;
  top: 10%;
  left: calc(-16/375*100vw);
  background-color: var(--color-green);
}
.vote_vote_btn::after {
  content: "";
  display: inline-block;
  width: calc(1/375*100vw);
  height: calc(24/375*100vw);
  transform: rotate(-150deg);
  position: absolute;
  top: 10%;
  right: calc(-16/375*100vw);
  background-color: var(--color-green);
}

.vote_x_btn {
  width: calc(47.85/375*100vw);
  height: calc(48/375*100vw);
  margin: 0 auto;
  margin-bottom: calc(18/375*100vw);
}
.vote_result_text {
  font-weight: 500;
  font-size: calc(13/375*100vw);
  line-height: 180%;
  text-align: center;
  color: var(--color-black);
}
.vote_result_note {
  font-weight: 500;
  font-size: calc(12/375*100vw);
  line-height: 150%;
  text-align: center;
  vertical-align: middle;
  color: var(--color-black);
}
.vote_result_wrap {
  padding-bottom: calc(85/375*100vw);
}
@media print, screen and (min-width: 910px) {
  .section_vote::before {
    height: 280px;
  }
  .vote_kv_img {
    width: 311.5px;
    padding-top: 10px;
  }
  .vote_ttl {
    width: 289px;
    margin: 28px auto 15px;
  }
  .vote_period {
    margin: 0 auto 16px;
  }
  .vote_period span._s {
    font-size: 12px;
  }
  .vote_period span._m {
    font-size: 14px;
  }
  .vote_period span._l {
    font-size: 16px;
  }
  .vote_text {
    font-size: 15px;
    margin-bottom: 32px;
  }
  .vote_method {
    border-top: 1px solid var(--color-green);
    border-bottom: 1px solid var(--color-green);
    padding: 6px 0 4px;
    gap: 8px;
    margin-bottom: 16px;
    font-size: 18px;
    line-height: 28px;
  }
  .vote_method_text {
    font-size: 15px;
    margin-bottom: 40px;
  }
  .vote_method_text span {
    font-size: 15px;
  }
  .vote_note {
    margin: 40px 0 40px 4px;
  }
  .vote_note li {
    font-size: 13px;
    line-height: 23px;
  }
  .vote_border {
    margin-bottom: 40px;
  }
  .vote_vote_btn {
    font-size: 18px;
    margin-bottom: 13px;
  }
  .vote_vote_btn::before {
    width: 1px;
    height: 24px;
    left: -16px;
  }
  .vote_vote_btn::after {
    width: 1px;
    height: 24px;
    right: -16px;
  }
  .vote_result_text {
    font-size: 13px;
  }
  .vote_result_note {
    font-size: 12px;
  }

  /* 投票数ランキングエリア */
  .section_vote_ranking_wrap {
    /* height: 968px;
    padding-top: 85px;
    margin: 44.5px 0 39px;
    width: 100%; */
    height: 1108px;
    padding-top: 120px;
    margin: 44.5px 0 39px;
    width: 100%;
    background-position: center;
  }
  .section_vote_ranking_wrap .other_inner {
    padding: 0px 52px;
  }
  .vote_ranking_text {
    font-size: 32px;
    margin-bottom: 25px;
  }
  .vote_ranking_date {
    font-size: 13px;
    margin-bottom: 30px;
  }
  .vote_ranking_item {
    gap: 16px;
  }
  .vote_ranking_item_img {
    width: 93.33px;
  }
  .vote_ranking_item_text_ttl {
    font-size: 15px;
    margin-bottom: 9px;
  }
  .vote_ranking_item_text_ttl span {
    font-size: 12px;
  }
  .vote_ranking_item_text_vote {
    font-size: 22px;
  }
  .vote_ranking_item_text_vote span {
    font-size: 11px;
    margin: 0 8px;
  }

  .vote_vote_btn {
    font-size: 18px;
  }
  .vote_x_btn {
    width: 47.85px;
    height: 48px;
    margin-bottom: 18px;
  }
  .vote_result_text {
    font-size: 13px;
  }
  .vote_result_note {
    font-size: 12px;
  }
  .vote_result_wrap {
    padding-bottom: 85px;
  }
}


/* ----------------------------------------------------------
0402 ver
---------------------------------------------------------- */
._0402 [tabindex="-1"]:hover {
  opacity: 1;
 }
._0402 .frap_page_link_text {
  position: relative;
  top: calc(-2 / 375 * 100vw);
}
._0402 .section_yogurt .frap_page_link_text {
  top: calc(5 / 375 * 100vw);
}
._0402 .section_yogurt .frap_flex._right {
  margin-bottom: calc(17 / 375 * 100vw);
}
._0402 .section_yogurt .frap_page_link_img {
  margin-top: calc(12 / 375 * 100vw);
}
._0402 .frap_page_link_btn {
  margin: calc(46 / 375 * 100vw) auto 0;
}
._0402 .frap_page_link {
  align-items: center;
}
._0402 .food_flex {
  gap: calc(63 / 375 * 100vw);
}
._0402 .section_yogurt .frap_page_link_btn {
  margin: calc(48 / 375 * 100vw) auto 0;
}
._0402 .section_melon .frap_lead {
  margin-top: calc(-2 / 375 * 100vw);
}
._0402 .section_melon .frap_lead_note {
  margin-bottom: calc(39/375*100vw);
}
._0402 .section_food {
  padding-bottom: calc(96/375*100vw);
}
._0402 .section_goods {
  padding-top: calc(67 / 375 * 100vw);
}
._0402 .section_card .other_note {
  margin-top: calc(7/375*100vw);
}
._0402 .section_dscg {
  padding-bottom: calc(33/375*100vw);
}
._0402 .section_egift {
  padding-bottom: calc(48/375*100vw); 
}

@media print, screen and (min-width: 910px) {
  ._0402 .frap_kv_img {
    cursor: default;
  }
  ._0402 .frap_page_link_text {
    top: -2px;
  }
  ._0402 .section_yogurt .frap_page_link_text {
    top: 5px;
  }
  ._0402 .section_yogurt .frap_flex._right {
    margin-bottom: 17px;
  }
  ._0402 .section_yogurt .frap_page_link_img {
    margin-top: 12px;
  }
  ._0402 .frap_page_link_btn {
    margin: 46px auto 0;
  }
  ._0402 .food_flex {
    gap: 63px;
  }
  ._0402 .section_yogurt .frap_page_link_btn {
    margin: 48px auto 0;
  }
  ._0402 .section_melon .frap_lead {
    margin-top: -2px;
  }
  ._0402 .section_melon .frap_lead_note {
    margin-bottom: 39px;
  }
  ._0402 .section_food {
    padding-bottom: 96px;
  }
  ._0402 .section_card {
    padding-bottom: 78px;
  }
  ._0402 .section_goods {
    padding-top: 67px;
  }
  ._0402 .section_card .other_note {
    margin-top: 7px;
  }
  ._0402 .section_dscg {
    padding-bottom: 33px;
  }
  ._0402 .section_egift {
    padding-bottom: 48px;
  }
}
@media print, screen and (min-width: 910px) and (max-width: 1100px) {
  ._0402 .pc-left_bgIn {
    width: calc(50vw - 235px);
  }
  ._0402 .pc-right_bgIn {
    width: calc(50vw - 196px);
  }
}