@charset "UTF-8";

/* =============================================
common style
============================================= */
@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';
  font-style: normal;
  font-weight: 700;
  src: url("/common/fonts/SoDoSans/SoDoSans-Bold.woff") format("woff2")
}

@font-face {
  font-family: 'SoDoSans SemiBold';
  font-style: normal;
  font-weight: 900;
  src: url("/common/fonts/SoDoSans/SoDoSans-SemiBold.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");
}

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

@font-face {
  font-family: 'Lander Tall';
  font-style: normal;
  font-weight: 900;
  src: url("/common/fonts/Lander/LanderTall-Black.woff") format("woff");
}


body {
  max-width: 100%;
  width: 100%;
  font-family: 'Noto Sans JP';
  overflow: hidden;
}
.bgBox01,
.bgBox02 {
  color: #fff;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

a:hover {
  cursor: pointer;
}

/* --------------------------------------------
Common
--------------------------------------------- */
._btn {
  font-size: calc(25 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(27.2 / 25);
  color: #1E0000;
  background-color: #FFFDEB;
  padding: calc(19 / 1440 * 100vw) calc(70 / 1440 * 100vw);
  border-radius: calc(37 / 1440 * 100vw);
  position: relative;
  top: calc(57 / 1440 * 100vw);
  left: calc(-5 / 1440 * 100vw);
  opacity: 1;
  transition: .3s ease;
}
._btn:hover {
  opacity: 0.8;
  transition: .3s ease;
}
._other_btn {
  font-size: calc(25 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(27.2 / 25);
  color: #1E0000;
  border: calc(1.5 / 1440 * 100vw) solid #1E0000;
  padding: calc(22 / 1440 * 100vw) calc(88 / 1440 * 100vw);
  border-radius: calc(37 / 1440 * 100vw);
  white-space: nowrap;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  opacity: 1;
  transition: .3s ease;
}
._other_btn:hover {
  opacity: 0.8;
  transition: .3s ease;
}
._link {
  font-size: calc(15 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(27 / 15);
  color: #1E0000;
  position: absolute;
  white-space: nowrap;
  top: calc(87 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
}
._link:before {
  content: "";
  position: absolute;
  bottom: calc(-7 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(267.68 / 1440 * 100vw);
  height: calc(1.25 / 1440 * 100vw);
  background-color: #1E0000;
}

.sp_only {
  display: none;
}

._content_title {
  position: absolute;
  transform: translateX(-50%);
  font-size: calc(120 / 1440 * 100vw);
  font-weight: 700;
  line-height: calc(120 / 120);
  text-align: center;
  font-family: 'SoDoSans Condensed';
  letter-spacing: calc(12/ 1440 * 100vw);
  color: #231815;
  white-space: nowrap;
}
._name {
  font-size: calc(35/ 1440 * 100vw);
  font-weight: 500;
  line-height: calc(40.3/ 35);
  color: #1E0000;
  opacity: 1;
  transition: .3s ease;
  white-space: nowrap;
}
._name a {
  color: #1E0000;
  font-weight: 500;
}
._name span {
  font-size: calc(22/ 1440 * 100vw);
  font-weight: 500;
  line-height: calc(33/ 22);
  color: #1E0000;
  display: block;
  margin-bottom: calc(14 / 1440 * 100vw);
}
._name:hover {
  opacity: 0.8;
  transition: .3s ease;
}
._kind {
  color: #1E0000;
  font-size: calc(15 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(27 / 15);
  margin-top: calc(3 / 1440 * 100vw);
}
._price {
  font-size: calc(35 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(40.3 / 35);
  font-family: "SoDoSans";
  color: #1E0000;
}

@media all and (max-width: 1023px) {
  .sp_only {
    display: block;
  }

  .pc_only {
    display: none;
  }

  ._btn {
    white-space: nowrap;
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(19.2 / 16);
    padding: calc(28 / 750 * 100vw) calc(151 / 750 * 100vw);
    border-radius: calc(55 / 750 * 100vw);
    top: calc(57 / 750 * 100vw);
    left: calc(-5 / 750 * 100vw);
  }
  ._other_btn {
    white-space: nowrap;
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    border: calc(2 / 750 * 100vw) solid #1E0000;
    padding: calc(19 / 750 * 100vw) calc(84 / 750 * 100vw);
    border-radius: calc(55 / 750 * 100vw);
  }
  ._link {
    font-size: calc(26 / 750 * 100vw);
    line-height: calc(16.8 / 13);
    top: calc(130 / 750 * 100vw);
  }
  ._link:before {
    bottom: calc(-12 / 750 * 100vw);
    width: calc(466 / 750 * 100vw);
    height: calc(2 / 750 * 100vw);
  }

  ._content_title {
    font-size: calc(120 / 750 * 100vw);
    font-family: 'SoDoSans Condensed SemiBold';
    font-weight: 600;
    line-height: calc(16.8 / 60);
    letter-spacing: calc(-2 / 750 * 100vw);
  }
  ._name {
    font-size: calc(40/ 750 * 100vw);
    line-height: calc(28/ 20);
  }
  ._name span {
    font-size: calc(22/ 750 * 100vw);
    line-height: calc(33/ 22);
    margin-bottom: calc(14 / 750 * 100vw);
  }
  ._kind {
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(28 / 12);
    margin-top: calc(-7 / 750 * 100vw);
  }
  ._price {
    font-size: calc(40 / 750 * 100vw);
    line-height: calc(28 / 20);
    position: relative;
    top: calc(-10 / 750 * 100vw);
  }
  
}

/* =============================================
Hover
============================================= */
.pc_only._hover {
  display: none;
}

._product_image:hover .pc_only._default {
  display: none;
}
._product_image:hover .pc_only._hover {
  display: block;
}
._image:hover .pc_only._default {
  display: none;
}
._image:hover .pc_only._hover {
  display: block;
}
@media all and (max-width: 1023px) {
  ._product_image:hover .pc_only._default {
    display: none;
  }
  ._product_image:hover .pc_only._hover {
    display: none;
  }
  ._image:hover .pc_only._default {
    display: none;
  }
  ._image:hover .pc_only._hover {
    display: none;
  }
}

/* =============================================
bg
============================================= */
.bgBox01 {
  position: relative;
  width: 100%;
  height: calc(1225/1440*100vw);
}
.bgBox02 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg02.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(552/1440*100vw);
}
.bgBox03 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg03.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(4241/1440*100vw);
} 
.bgBox04 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg04.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(977/1440*100vw);
}
.bgBox05 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg05.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(2800/1440*100vw);
}
.bgBox06 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg06.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(2162/1440*100vw);
}
.bgBox07 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg07.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(1778/1440*100vw);
}
.bgBox08 {
  position: relative;
  background-image: url(/cafe/hojicha-yakiimo/images/bg/bg08.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc(2062/1440*100vw);
}
@media all and (max-width: 1023px) {
  .bgBox01 {
    height: calc(1358/750*100vw);
  }
  .bgBox02 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg02_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(752/750*100vw);
  }
  .bgBox03 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg03_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(5919 / 750 * 100vw);
  }
  .bgBox04 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg04_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(1334/750*100vw);
  }
  .bgBox05 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg05_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(3578/750*100vw);
  }
  .bgBox06 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg06_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(3658/750*100vw);
  }
  .bgBox07 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg07_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(4052/750*100vw);
  }
  .bgBox08 {
    position: relative;
    background-image: url(/cafe/hojicha-yakiimo/images/bg/bg08_sp.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(3042/750*100vw);
  }
}

/* =============================================
mv
============================================= */
.block-main {
  position: relative;
  width: 100vw;
}
.block-main ._kv_title {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
}
.block-main ._kv_title img {
  width: 100%;
  height: auto;
}
.block-main ._item_title {
  position: absolute;
  top: calc(863 / 1440 * 100vw);
  left: calc(49 / 1440 * 100vw);
}
.block-main ._item_title ._main_title {
  width: calc(586 / 1440 * 100vw);
}
.block-main ._item_name {
  position: absolute;
  top: calc(457 / 1440 * 100vw);
  right: calc(493 / 1440 * 100vw);
}
.block-main ._item_name ._main_name {
  font-size: calc(20 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(25 / 20);
  font-family: 'Noto Sans JP';
  color: #FFF;
  opacity: 1;
  transition: .3s ease;
}
.block-main ._item_name ._main_name:hover {
  opacity: 0.8;
  transition: .3s ease;
}
.block-main ._item_link {
  display: block;
  position: absolute;
  top: calc(180 / 1440 * 100vw);
  right: calc(42.5 / 1440 * 100vw);
  width: calc(429.5 / 1440 * 100vw);
  opacity: 0;
  transition: .3s ease;
}
.block-main ._item_link:hover {
  opacity: 1;
  transition: .3s ease;
}
@media all and (max-width: 1023px) {
  .block-main ._item_title {
    position: absolute;
    top: calc(1055 / 750 * 100vw);
    left: calc(34 / 750 * 100vw);
  }
  .block-main ._item_title ._main_title {
    width: calc(687 / 750 * 100vw);
  }
  .block-main ._item_name {
    position: absolute;
    top: calc(446 / 750 * 100vw);
    right: calc(418 / 750 * 100vw);
    white-space: nowrap;
  }
  .block-main ._item_name ._main_name {
    font-size: calc(18 / 750 * 100vw);
    font-weight: 500;
    line-height: calc(13 / 9);
    font-family: 'Noto Sans JP';
  }
  .block-main ._item_link {
    top: calc(291 / 750 * 100vw);
    right: calc(58.5 / 750 * 100vw);
    width: calc(355 / 750 * 100vw);
    opacity: 0;
  }
  .block-main ._item_link:hover {
    opacity: 0;
  }
}
/* =============================================
block-lead
============================================= */
.block-lead {
  position: absolute;
  top: calc(47 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  color: #1E0000;
}
.block-lead ._lead-title {
  text-align: center;
  font-size: calc(70 / 1440 * 100vw);
  font-weight: 700;
  line-height: 1.2;
  font-family: 'Noto Serif JP';
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
.block-lead ._lead-text {
  text-align: center;
  font-size: calc(30 / 1440 * 100vw);
  font-weight: 500;
  line-height: 1.7;
  margin-top: calc(26 / 1440 * 100vw);
  font-family: 'Noto Serif JP';
}
@media all and (max-width: 1023px) {
  .block-lead {
    top: calc(53 / 750 * 100vw);
  }
  .block-lead ._lead-title {
    font-size: calc(58 / 750 * 100vw);
    line-height: 1.5;
  }
  .block-lead ._lead-text {
    font-size: calc(34 / 750 * 100vw);
    line-height: 1.8;
    margin-top: calc(55 / 750 * 100vw);
  }
}

/* =============================================
block-items
============================================= */
.block-items {
  position: relative;
  width: 100%;
  height: 100%;
}
._item-image-wrap {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
._item-image-wrap._01 {
  top: calc(463 / 1440 * 100vw);
}
._item-image-wrap._02 {
  top: calc(1380 / 1440 * 100vw);
}
._item-image-wrap._03 {
  top: calc(2430 / 1440 * 100vw);
}
._item-image-block {
  position: relative;
}
._item-point {
  position: absolute;
}
._item-point-text {
  font-size: calc(37 / 1440 * 100vw);
  font-weight: 600;
  font-family: 'Noto Serif JP';
  color: #FFF;
  position: absolute;
  z-index: 2;
  text-align: center;
  line-height: 1.15;
}
._item-point-text span {
  font-size: calc(33 / 1440 * 100vw);
  font-weight: 500;
  font-family: 'Noto Serif JP';
  color: #FFF;
}
._item-point._01 {
  width: calc(357 / 1440 * 100vw);
  top: calc(-416 / 1440 * 100vw);
  left: calc(-234 / 1440 * 100vw);
}
._item-point._02 {
  width: calc(357 / 1440 * 100vw);
  top: calc(-82 / 1440 * 100vw);
  left: calc(-467 / 1440 * 100vw);
  z-index: 0;
}
._item-point._03 {
  width: calc(354 / 1440 * 100vw);
  top: calc(-130 / 1440 * 100vw);
  left: calc(70 / 1440 * 100vw);
  z-index: 1;
}
._item-point._04 {
  width: calc(358 / 1440 * 100vw);
  top: calc(-171 / 1440 * 100vw);
  left: calc(-424 / 1440 * 100vw);
  z-index: 1;
}
._item-point._01 ._item-point-text {
  top: calc(156 / 1440 * 100vw);
  left: calc(32 / 1440 * 100vw);
}
._item-point._02 ._item-point-text {
  top: calc(197 / 1440 * 100vw);
  left: calc(52 / 1440 * 100vw);
}
._item-point._03 ._item-point-text {
  top: calc(170 / 1440 * 100vw);
  left: calc(42 / 1440 * 100vw);
  font-size: calc(39 / 1440 * 100vw);
  line-height: 1.3;
}
._item-point._04 ._item-point-text {
  top: calc(179 / 1440 * 100vw);
  left: calc(45 / 1440 * 100vw);
  font-size: calc(39 / 1440 * 100vw);
  line-height: 1.3;
}
._item-image {
  position: absolute;
}
._item-image._01 {
  width: calc(620 / 1440 * 100vw);
  left: calc(-178 / 1440 * 100vw);
  z-index: 1;
}
._item-image._02 {
  width: calc(620 / 1440 * 100vw);
  right: calc(-161 / 1440 * 100vw);
  z-index: 0;
}
._item-image._03 {
  width: calc(621 / 1440 * 100vw);
  left: calc(-186 / 1440 * 100vw);
  z-index: 0;
}

._item-detail-area {
  position: absolute;
  bottom: calc(368 / 1440 * 100vw);
  left: 56.7%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  flex-direction: row;
  width: calc(1075 / 1440 * 100vw);
}
._item-detail-area ._detail-txt {
  position: relative;
  top: calc(21 / 1440 * 100vw);
  font-family: 'Noto Sans JP';
  color: #1E0000;
  width: calc(340 / 1440 * 100vw);
}
._item-detail-area ._btn {
  color: #fff;
  background-color: #4B0D33;
  top: calc(55 / 1440 * 100vw);
  left: calc(-5 / 1440 * 100vw);
}
._item-detail-area ._detail-image {
  width: calc(710 / 1440 * 100vw);
  position: relative;
  left: calc(8 / 1440 * 100vw);
}
._item-detail-area ._detail-image .hover_only  {
  position: absolute;
  width: calc(389/1440 * 100vw);
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: .3s ease;
}
._item-detail-area ._detail-image:hover .hover_only {
  opacity: 1;
  transition: .3s ease;
}
@media all and (max-width: 1023px) {
  ._item-image-wrap._01 {
    top: calc(781 / 750 * 100vw);
  }
  ._item-image-wrap._02 {
    top: calc(2177 / 750 * 100vw);
  }
  ._item-image-wrap._03 {
    top: calc(3517 / 750 * 100vw);
  }
  ._item-point._01 {
    width: calc(430 / 750 * 100vw);
    top: calc(-689 / 750 * 100vw);
    left: calc(-55 / 750 * 100vw);
  }
  ._item-point._02 {
    width: calc(430 / 750 * 100vw);
    top: calc(-324 / 750 * 100vw);
    left: calc(-328 / 750 * 100vw);
  }
  ._item-point._03 {
    width: calc(430 / 750 * 100vw);
    top: calc(-353 / 750 * 100vw);
    left: calc(-90 / 750 * 100vw);
  }
  ._item-point._04 {
    width: calc(430 / 750 * 100vw);
    top: calc(-336 / 750 * 100vw);
    left: calc(-387 / 750 * 100vw);
    z-index: 0;
  }
  ._item-image._01 {
    width: calc(818 / 750 * 100vw);
    left: calc(-282 / 750 * 100vw);
  }
  ._item-image._02 {
    width: calc(800 / 750 * 100vw);
    right: calc(-316 / 750 * 100vw);
  }
  ._item-image._03 {
    width: calc(822 / 750 * 100vw);
    left: calc(-350 / 750 * 100vw);
  }
  
  ._item-detail-area {
    bottom: calc(620 / 750 * 100vw);
    left: 43.7%;
    width: calc(1075 / 750 * 100vw);
  }
  ._item-detail-area ._detail-txt {
    top: calc(555 / 750 * 100vw);
    left: calc(314/ 750 * 100vw);
    width: calc(340 / 750 * 100vw);
  }
  ._item-detail-area ._btn {
    top: calc(45 / 750 * 100vw);
    left: calc(-7 / 750 * 100vw);
  }
  ._item-detail-area ._detail-image {
    width: calc(700 / 750 * 100vw);
    left: calc(8 / 750 * 100vw);
  }
  ._item-detail-area ._detail-image:hover .hover_only {
    opacity: 0;
  }

  ._item-point-text {
    font-size: calc(44 / 750 * 100vw);
    line-height: 1.15;
  }
  ._item-point-text span {
    font-size: calc(38 / 750 * 100vw);
  }
  ._item-point._01 ._item-point-text {
    top: calc(190 / 750 * 100vw);
    left: calc(42 / 750 * 100vw);
  }
  ._item-point._02 ._item-point-text {
    top: calc(239 / 750 * 100vw);
    left: calc(66 / 750 * 100vw);
  }
  ._item-point._03 ._item-point-text {
    top: calc(212 / 750 * 100vw);
    left: calc(53 / 750 * 100vw);
    font-size: calc(46 / 750 * 100vw);
    line-height: 1.3;
  }
  ._item-point._04 ._item-point-text {
    top: calc(216 / 750 * 100vw);
    left: calc(60 / 750 * 100vw);
    font-size: calc(46 / 750 * 100vw);
    line-height: 1.3;
  }
}

/* =============================================
block-chocolate
============================================= */
.block-chocolate {
  position: relative;
  width: 100%;
  height: 100%;
}
.block-chocolate ._content_title {
  position: absolute;
  top: calc(64 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(543.5 / 1440 * 100vw);
}
._chocolate_item {
  position: absolute;
  width: calc(630.5 / 1440 * 100vw);
  top: calc(282 / 1440 * 100vw);
  left: calc(395 / 1440 * 100vw);
  opacity: 0;
  transition: .3s ease;
}
._chocolate_item:hover {
  opacity: 1;
  transition: .3s ease;
}
._chocolate-detail-area {
  position: absolute;
  bottom: calc(190 / 1440 * 100vw);
  left: calc(101 / 1440 * 100vw);
  width: calc(340 / 1440 * 100vw);
}
._chocolate-detail-area ._detail-txt {
  position: relative;
  top: calc(21 / 1440 * 100vw);
  font-family: 'Noto Sans JP';
  color: #FFF;
}
._chocolate-detail-area ._name {
  color: #FFF;
}
._chocolate-detail-area ._kind {
  color: #FFF;
}
._chocolate-detail-area ._price {
  color: #FFF;
}
._chocolate-detail-area ._note {
  font-size: calc(16 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(26 / 16);
  margin-top: calc(3 / 1440 * 100vw);
}
._chocolate-detail-area ._btn {
  color: #1E0000;
  background-color: #FFFFFF;
  top: calc(57 / 1440 * 100vw);
  left: calc(-5 / 1440 * 100vw);
}

._beverage-area {
  position: absolute;
  bottom: calc(-137 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(457.37 / 1440 * 100vw);
  z-index: 1;
}
._beverage-link {
  position: relative;
}
._beverage-area ._other_btn {
  top: calc(-5/1440 * 100vw);
  left: 50%;
}
@media all and (max-width: 1023px) {
  .block-chocolate ._content_title {
    top: calc(93 / 750 * 100vw);
    width: calc(544 / 750 * 100vw);
  }
  ._chocolate-detail-area {
    bottom: calc(167 / 750 * 100vw);
    left: calc(103 / 750 * 100vw);
    width: calc(340 / 750 * 100vw);
  }
  ._chocolate-detail-area ._detail-txt {
    top: calc(21 / 750 * 100vw);
  }
  ._chocolate-detail-area ._price {
    margin-top: calc(10 / 750 * 100vw);
  }
  ._chocolate-detail-area ._note {
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(28 / 12);
    margin-top: calc(-20 / 750 * 100vw);
  }
  ._chocolate-detail-area ._btn {
    top: calc(48 / 750 * 100vw);
    left: calc(-5 / 750 * 100vw);
  }
  
  ._beverage-area {
    bottom: calc(-137 / 750 * 100vw);
    width: calc(457.37 / 750 * 100vw);
  }
  ._beverage-area ._other_btn {
    top: calc(4 / 750 * 100vw);
  }

  ._chocolate_item {
    width: calc(656.5 / 750 * 100vw);
    top: calc(297 / 750 * 100vw);
    left: calc(48 / 750 * 100vw);
    opacity: 0;
  }
  ._chocolate_item:hover {
    opacity: 0;
  }
}

/* =============================================
block-food
============================================= */
.block-food {
  position: relative;
  width: 100%;
  height: 100%;
}
.block-food ._food-anchor {
  position: absolute;
  top: calc(400 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(500 / 1440 * 100vw);
}
.block-food ._content_title {
  top: calc(590 / 1440 * 100vw);
  left: 50.5%;
}
._food-item {
  position: absolute;
  width: calc(954 / 1440 * 100vw);
  transform: translateX(-50%);
  display: flex;
  align-items: center;
}
._food-item._01 {
  top: calc(800 / 1440 * 100vw);
  left: 50%;
}
._food-item._02 {
  top: calc(1382 / 1440 * 100vw);
  left: 50%;
  flex-direction: row-reverse;
}
._food-item._03 {
  top: calc(2005 / 1440 * 100vw);
  left: 50%;
}
._food-item ._item-detail {
  position: relative;
}
._food-item._01 ._item-detail {
  top: calc(-3 / 1440 * 100vw);
  left: calc(93 / 1440 * 100vw);
}
._food-item._02 ._item-detail {
  top: calc(1 / 1440 * 100vw);
  left: calc(-14 / 1440 * 100vw);
}
._food-item._03 ._item-detail {
  top: calc(-14 / 1440 * 100vw);
  left: calc(54 / 1440 * 100vw);
  width: calc(420 / 1440 * 100vw);
  flex: 1;
}
._food-item ._item-image {
  position: relative;
}
._food-item._01 ._item-image {
  width: calc(494.5 / 1440 * 100vw);
  top: calc(13/ 1440 * 100vw);
  left: calc(30/ 1440 * 100vw);
}
._food-item._02 ._item-image {
  width: calc(498.5 / 1440 * 100vw);
  top: calc(26 / 1440 * 100vw);
  left: calc(50 / 1440 * 100vw);
}
._food-item._03 ._item-image {
  width: calc(536 / 1440 * 100vw);
  top: calc(-14 / 1440 * 100vw);
  left: calc(41 / 1440 * 100vw);
}
._food-item ._item-image .hover_only {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: .3s ease;
}
._food-item._01 ._item-image .hover_only {
  width: calc(469.5 / 1440 * 100vw);
  top: calc(52 / 1440 * 100vw);
  left: calc(13 / 1440 * 100vw);
}
._food-item._02 ._item-image .hover_only {
  width: calc(476.5 / 1440 * 100vw);
  top: calc(34 / 1440 * 100vw);
  left: calc(11 / 1440 * 100vw);
}
._food-item._03 ._item-image .hover_only {
  width: calc(486 / 1440 * 100vw);
  top: calc(0.5 / 1440 * 100vw);
  left: calc(0.5 / 1440 * 100vw);
}
._food-item ._item-image:hover .hover_only {
  opacity: 1;
  transition: .3s ease;
}
._food-item ._price {
  margin-top: calc(6 / 1440 * 100vw);
}
._food-item ._btn {
  color: #1E0000;
  background-color: #FFFDEB;
  top: calc(58 / 1440 * 100vw);
  left: calc(-1 / 1440 * 100vw);
}
._food-area {
  position: absolute;
  bottom: calc(291 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(395.54 / 1440 * 100vw);
  z-index: 1;
}
._food-link {
  position: relative;
}
._food-area ._other_btn {
  padding: calc(22 / 1440 * 100vw) calc(84 / 1440 * 100vw);
  width: calc(395.54 / 1440 * 100vw);
  top: calc(-5/1440 * 100vw);
}
@media all and (max-width: 1023px) {
  .block-food ._food-anchor {
    top: calc(400 / 750 * 100vw);
    width: calc(500 / 750 * 100vw);
  }
  .block-food ._content_title {
    top: calc(610 / 750 * 100vw);
    left: 50.5%;
  }
  ._food-item {
    width: 100%;
    flex-direction: column;
  }
  ._food-item._01 {
    top: calc(800 / 750 * 100vw);
    left: 50%;
  }
  ._food-item._02 {
    top: calc(1625 / 750 * 100vw);
    left: 50%;
    flex-direction: column;
  }
  ._food-item._03 {
    top: calc(2492 / 750 * 100vw);
    left: 50%;
  }
  ._food-item._01 ._item-detail {
    top: calc(-14 / 750 * 100vw);
    left: calc(161 / 750 * 100vw);
  }
  ._food-item._02 ._item-detail {
    top: calc(11 / 750 * 100vw);
    left: calc(160 / 750 * 100vw);
  }
  ._food-item._03 ._item-detail {
    top: calc(-1 / 750 * 100vw);
    left: calc(-75 / 750 * 100vw);
    width: calc(420 / 750 * 100vw);
  }
  ._food-item._01 ._item-image {
    width: calc(592 / 750 * 100vw);
    top: calc(-3 / 750 * 100vw);
    left: calc(-54 / 750 * 100vw);
  }
  ._food-item._02 ._item-image {
    width: calc(614 / 750 * 100vw);
    top: calc(26 / 750 * 100vw);
    left: calc(-68 / 750 * 100vw);
  }
  ._food-item._03 ._item-image {
    width: calc(632 / 750 * 100vw);
    top: calc(-17 / 750 * 100vw);
    left: calc(101 / 750 * 100vw);
  }
  ._food-item ._name {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(19.2 / 16);
  }
  ._food-item ._name span {
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(18 / 12);
    margin-bottom: calc(12 / 750 * 100vw);
  }
  ._food-item._01 ._item-detail ._name span {
    letter-spacing: calc(-1.4/750 * 100vw);
  }
  ._food-item ._price {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(19.2 / 16);
    margin-top: calc(13 / 750 * 100vw);
  }
  ._food-item ._btn {
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    padding: calc(19 / 750 * 100vw) calc(47 / 750 * 100vw);
    top: calc(39 / 750 * 100vw);
    left: calc(-5 / 750 * 100vw);
  }
  ._food-area {
    bottom: calc(218 / 750 * 100vw);
    left: 50%;
    width: 100%;
  }
  ._food-area ._other_btn {
    padding: calc(18 / 750 * 100vw) calc(115 / 750 * 100vw);
    width: calc(480 / 750 * 100vw);
    top: calc(5 / 750 * 100vw);
    left: 50.5%;
  }

  ._food-item ._item-image:hover .hover_only {
    opacity: 0;
  }
}

/* =============================================
Coffee
============================================= */
.block-coffee {
  position: relative;
  width: 100%;
  height: 100%;
}
.block-coffee ._content_title {
  top: calc(162 / 1440 * 100vw);
  left: 50.5%;
}
._coffee-item {
  position: absolute;
  width: auto;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}
._coffee-item._01 {
  top: calc(492 / 1440 * 100vw);
  left: calc(422 / 1440 * 100vw);
}
._coffee-item._02 {
  top: calc(488 / 1440 * 100vw);
  left: calc(921 / 1440 * 100vw);
}
._coffee-item ._item-detail {
  position: relative;
}
._coffee-item._01 ._item-detail {
  top: calc(72 / 1440 * 100vw);
  left: calc(53 / 1440 * 100vw);
}
._coffee-item._02 ._item-detail {
  top: calc(76 / 1440 * 100vw);
  left: calc(92 / 1440 * 100vw);
}
._coffee-item ._item-image {
  position: relative;
}
._coffee-item._01 ._item-image {
  width: calc(261.5 / 1440 * 100vw);
  top: calc(13/ 1440 * 100vw);
  left: calc(30/ 1440 * 100vw);
}
._coffee-item._02 ._item-image {
  width: calc(261.5 / 1440 * 100vw);
  top: calc(26 / 1440 * 100vw);
  left: calc(50 / 1440 * 100vw);
}
._coffee-item ._item-image .hover_only {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: .3s ease;
}
._coffee-item._01 ._item-image .hover_only {
  width: calc(223 / 1440 * 100vw);
  top: calc(20 / 1440 * 100vw);
  left: calc(24 / 1440 * 100vw);
}
._coffee-item._02 ._item-image .hover_only {
  width: calc(225 / 1440 * 100vw);
  top: calc(11 / 1440 * 100vw);
  left: calc(19 / 1440 * 100vw);
}
._coffee-item ._item-image:hover .hover_only {
  opacity: 1;
  transition: .3s ease;
}
._coffee-item ._btn {
  color: #1E0000;
  background-color: #FFFDEB;
  top: calc(58 / 1440 * 100vw);
  left: calc(-1 / 1440 * 100vw);
}
._coffee-item._02 ._btn { 
  top: calc(58 / 1440 * 100vw);
  left: calc(-6 / 1440 * 100vw);
}

._coffee-area {
  position: absolute;
  bottom: calc(291 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
._coffee-link {
  position: relative;
}
._coffee-area ._other_btn {
  padding: calc(22 / 1440 * 100vw) calc(70 / 1440 * 100vw);
  width: calc(420 / 1440 * 100vw);
  top: calc(-282 / 1440 * 100vw);
}
._coffee-area ._bnr {
  display: flex;
  background-color: #F2F0EA;
  width: calc(800 / 1440 * 100vw);
  position: absolute;
  bottom: calc(-125 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  border-radius: calc(12 / 1440 * 100vw);
  overflow: hidden;
}
._coffee-area ._bnr img {
  width: calc(190 / 1440 * 100vw);
}
._coffee-area ._bnr ._bnr-text {
  text-align: center;
  margin-top: calc(28 / 1440 * 100vw);
  margin-left: calc(143 / 1440 * 100vw);
}
._coffee-area ._bnr ._bnr-text p {
  color: #2E1107;
  font-size: calc(19.5 / 1440 * 100vw);
  line-height: calc(28 / 19.5);
  font-weight: 700;
  letter-spacing: calc(0.8 / 1440 * 100vw);
}
._coffee-area ._bnr ._bnr-text a {
  color: #00754A;
  font-size: calc(18.5 / 1440 * 100vw);
  line-height: calc(19 / 18.5);
  font-weight: 700;
  margin-top: calc(9 / 1440 * 100vw);
  display: block;
  opacity: 1;
  transition: .3s ease;
}
._coffee-area ._bnr ._bnr-text a:hover {
  opacity: 0.8;
  transition: .3s ease;
}
@media all and (max-width: 1023px) {
  .block-coffee { 
    top: calc(100 / 750 * 100vw);
  }
  .block-coffee ._content_title {
    top: calc(111 / 750 * 100vw);
    left: 50.5%;
    line-height: calc(64 / 60);
  }
  ._coffee-item {
    width: 100%;
    transform: translateX(-50%);
  }
  ._coffee-item._01 {
    top: calc(456 / 750 * 100vw);
    left: calc(337 / 750 * 100vw);
  }
  ._coffee-item._02 {
    top: calc(1592 / 750 * 100vw);
    left: calc(317 / 750 * 100vw);
  }
  ._coffee-item._01 ._item-detail {
    top: calc(59 / 750 * 100vw);
    left: calc(78 / 750 * 100vw);
  }
  ._coffee-item._02 ._item-detail {
    top: calc(73 / 750 * 100vw);
    left: calc(106 / 750 * 100vw);
  }
  ._coffee-item._01 ._item-image {
    width: calc(283 / 750 * 100vw);
    top: calc(13/ 750 * 100vw);
    left: calc(30/ 750 * 100vw);
  }
  ._coffee-item._02 ._item-image {
    width: calc(282 / 750 * 100vw);
    top: calc(26 / 750 * 100vw);
    left: calc(50 / 750 * 100vw);
  }
  ._coffee-item ._btn {
    top: calc(56 / 750 * 100vw);
    left: calc(8 / 750 * 100vw);
  }
  ._coffee-item._02 ._btn { 
    top: calc(56 / 750 * 100vw);
    left: calc(6 / 750 * 100vw);
  }

  ._coffee-item ._name {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(19.2 / 16);
  }
  ._coffee-item ._name span {
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(18 / 12);
    margin-bottom: calc(14 / 750 * 100vw);
  }
  ._coffee-item ._kind {
    font-size: calc(22 / 750 * 100vw);
    line-height: calc(16 / 11);
    margin-top: calc(-2 / 750 * 100vw);
  }
  ._coffee-item ._price {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(19.2 / 16);
    top: calc(4 / 750 * 100vw);
  }
  ._coffee-item ._btn {
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    padding: calc(17 / 750 * 100vw) calc(49 / 750 * 100vw);
  }
  
  ._coffee-area {
    bottom: calc(596 / 750 * 100vw);
    left: 50%;
  }
  ._coffee-area ._other_btn {
    padding: calc(20 / 750 * 100vw) calc(89 / 750 * 100vw);
    width: calc(480 / 750 * 100vw);
    top: calc(-282 / 750 * 100vw);
  }
  ._coffee-area ._bnr {
    width: calc(687 / 750 * 100vw);
    bottom: calc(-340 / 750 * 100vw);
    left: 50%;
    border-radius: calc(16 / 750 * 100vw);
  }
  ._coffee-area ._bnr img {
    width: calc(234 / 750 * 100vw);
  }
  ._coffee-area ._bnr ._bnr-text {
    margin-top: calc(57 / 750 * 100vw);
    margin-left: calc(29 / 750 * 100vw);
  }
  ._coffee-area ._bnr ._bnr-text p {
    color: #2E1107;
    font-size: calc(25 / 750 * 100vw);
    line-height: calc(19 / 12.5);
    font-weight: 700;
    letter-spacing: calc(-0.5 / 750 * 100vw);
  }
  ._coffee-area ._bnr ._bnr-text a {
    color: #00754A;
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(19 / 14);
    font-weight: 700;
    margin-top: calc(9 / 750 * 100vw);
  }

  ._coffee-item ._item-image:hover .hover_only {
    opacity: 0;
  }
}

/* =============================================
Goods
============================================= */
.block-goods {
  position: relative;
  width: 100%;
  height: 100%;
}
.block-goods ._content_title {
  top: calc(167 / 1440 * 100vw);
  left: 50.3%;
}
._goods_lead {
  position: absolute;
  top: calc(405 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
}
._goods_lead-title {
  font-size: calc(39.17 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(111.9 / 39.17);
  color: #1E0000;
  text-align: center;
  letter-spacing: calc(1.1 / 1440 * 100vw);
}
._goods_lead-text {
  position: relative;
  top: calc(-16 / 1440 * 100vw);
  font-size: calc(16 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(26 / 16);
  color: #1E0000;
  text-align: center;
}

._goods-item {
  position: absolute;
  width: calc(410 / 1440 * 100vw);
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}
._goods-item._01 {
  top: calc(509 / 1440 * 100vw);
  left: calc(284 / 1440 * 100vw);
}
._goods-item._02 {
  top: calc(686 / 1440 * 100vw);
  left: calc(753 / 1440 * 100vw);
}
._goods-item._03 {
  top: calc(684 / 1440 * 100vw);
  left: calc(1199 / 1440 * 100vw);
}
._goods-item ._item-detail {
  position: relative;
}
._goods-item._01 ._item-detail {
  top: calc(45 / 1440 * 100vw);
  left: calc(-14 / 1440 * 100vw);
}
._goods-item._02 ._item-detail {
  top: calc(112 / 1440 * 100vw);
  left: calc(-59 / 1440 * 100vw);
}
._goods-item._03 ._item-detail {
  top: calc(61 / 1440 * 100vw);
  left: calc(4 / 1440 * 100vw);
}
._goods-item ._item-detail ._name {
  font-size: calc(24 / 1440 * 100vw);
  line-height: calc(34 / 24);
  font-weight: 500;
}
._goods-item ._item-detail ._price {
  font-size: calc(24 / 1440 * 100vw);
  line-height: calc(32.2 / 24);
  font-weight: 500;
  font-family: "SoDoSans";
  margin-top: calc(6 / 1440 * 100vw);
}
._goods-item ._item-detail ._content_text {
  font-size: calc(17 / 1440 * 100vw);
  line-height: calc(26 / 17);
  font-weight: 500;
  color: #1E0000;
  margin-top: calc(13/ 1440 * 100vw);
}
._goods-item ._item-detail ._recommend {
  font-size: calc(11 / 1440 * 100vw);
  color: #1E0000;
  position: absolute;
  top: calc(-58 / 1440 * 100vw);
  right: calc(38 / 1440 * 100vw);
}
._goods-item ._item-detail ._btn {
  font-size: calc(20 / 1440 * 100vw);
  line-height: calc(21.78 / 20);
  padding: calc(15 / 1440 * 100vw) calc(55 / 1440 * 100vw);
}
._goods-item._01 ._item-detail ._btn {
  top: calc(53 / 1440 * 100vw);
  left: calc(37 / 1440 * 100vw);
}
._goods-item._02 ._item-detail ._btn {
  top: calc(87 / 1440 * 100vw);
  left: calc(53 / 1440 * 100vw);
}
._goods-item._03 ._item-detail ._btn {
  top: calc(87 / 1440 * 100vw);
  left: calc(45 / 1440 * 100vw);
}
._goods-item ._item-image {
  position: relative;
}
._goods-item._01 ._item-image {
  width: calc(196 / 1440 * 100vw);
}
._goods-item._02 ._item-image {
  width: calc(389 / 1440 * 100vw);
}
._goods-item._03 ._item-image {
  width: calc(320 / 1440 * 100vw);
}
._goods-item ._item-image .hover_only {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: .3s ease;
}
._goods-item ._item-image:hover .hover_only {
  opacity: 1;
  transition: .3s ease;
}
._goods-item._01 .hover_only ._item-image {
  width: calc(196 / 1440 * 100vw);
}
._goods-item._02 .hover_only ._item-image {
  width: calc(389 / 1440 * 100vw);
}
._goods-item._03 .hover_only ._item-image {
  width: calc(320 / 1440 * 100vw);
}
._goods-area {
  position: absolute;
  bottom: calc(261 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
._goods-link {
  position: relative;
}
._goods-area ._other_btn {
  padding: calc(22 / 1440 * 100vw) calc(68 / 1440 * 100vw);
  width: calc(490 / 1440 * 100vw);
}
@media all and (max-width: 1023px) {
  .block-goods {
    top: calc(106 / 750 * 100vw);
  }
  .block-goods ._content_title {
    top: calc(97 / 750 * 100vw);
    line-height: calc(64 / 60);
    left: 50.3%;
  }
  ._goods_lead {
    top: calc(352 / 750 * 100vw);
    left: 50%;
  }
  ._goods_lead-title {
    font-size: calc(42 / 750 * 100vw);
    line-height: calc(64 / 21);
    letter-spacing: calc(1.1 / 750 * 100vw);
    white-space: nowrap;
  }
  ._goods_lead-text {
    top: calc(-7 / 750 * 100vw);
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(21 / 14);
    white-space: nowrap;
  }
  
  ._goods-item {
    width: calc(410 / 750 * 100vw);
    transform: translateX(-50%);
  }
  ._goods-item._01 {
    top: calc(656 / 750 * 100vw);
    left: calc(377 / 750 * 100vw);
  }
  ._goods-item._02 {
    top: calc(1843 / 750 * 100vw);
    left: calc(387 / 750 * 100vw);
  }
  ._goods-item._03 {
    top: calc(2701 / 750 * 100vw);
    left: calc(469 / 750 * 100vw);
  }
  ._goods-item._01 ._item-detail {
    top: calc(66 / 750 * 100vw);
    left: calc(14 / 750 * 100vw);
  }
  ._goods-item._02 ._item-detail {
    top: calc(70 / 750 * 100vw);
    left: calc(-9 / 750 * 100vw);
  }
  ._goods-item._03 ._item-detail {
    top: calc(29 / 750 * 100vw);
    left: calc(-71 / 750 * 100vw);
  }
  ._goods-item ._item-detail ._name {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(21 / 16);
  }
  ._goods-item ._item-detail ._price {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(19.2 / 16);
    margin-top: calc(16 / 750 * 100vw);
  }
  ._goods-item ._item-detail ._content_text {
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(18 / 12);
    margin-top: calc(9 / 750 * 100vw);
    letter-spacing: calc(-1 / 750 * 100vw);
    white-space: nowrap;
  }
  ._goods-item ._item-detail ._recommend {
    font-size: calc(18 / 750 * 100vw);
    top: calc(-87 / 750 * 100vw);
    right: calc(3 / 750 * 100vw);
  }
  ._goods-item ._item-detail ._btn {
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    padding: calc(15 / 750 * 100vw) calc(49 / 750 * 100vw);
  }
  ._goods-item._01 ._item-detail ._btn {
    top: calc(42 / 750 * 100vw);
    left: calc(-4 / 750 * 100vw);
  }
  ._goods-item._02 ._item-detail ._btn {
    top: calc(44 / 750 * 100vw);
    left: calc(-6 / 750 * 100vw);
  }
  ._goods-item._03 ._item-detail ._btn {
    top: calc(44 / 750 * 100vw);
    left: calc(-5 / 750 * 100vw);
  }
  ._goods-item._01 ._item-image {
    width: calc(224 / 750 * 100vw);
  }
  ._goods-item._02 ._item-image {
    width: calc(533 / 750 * 100vw);
  }
  ._goods-item._03 ._item-image {
    width: calc(652 / 750 * 100vw);
  }
  ._goods-area {
    bottom: calc(201 / 750 * 100vw);
    left: 50%;
  }
  ._goods-area ._other_btn {
    padding: calc(20 / 750 * 100vw) calc(38 / 750 * 100vw);
    width: calc(480 / 750 * 100vw);
  }

  ._goods-item ._item-image:hover .hover_only {
    opacity: 0;
  }
}

/* =============================================
Card
============================================= */
.block-card {
  position: relative;
  width: 100%;
  height: 100%;
}
.block-card ._content_title {
  top: calc(146 / 1440 * 100vw);
  left: 50.1%;
  letter-spacing: calc(6 / 1440 * 100vw);
}
.block-card ._content_title._digital {
  top: calc(1091.5 / 1440 * 100vw);
  left: 50.2%;
  letter-spacing: calc(4 / 1440 * 100vw);
}
.block-card ._content_lead {
  position: absolute;
  top: calc(297 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(600 / 1440 * 100vw);
  text-align: center;
  font-size: calc(22 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(32 / 22);
  color: #1E0000;
  letter-spacing: calc(0.5 / 1440 * 100vw);
}
.block-card ._content_lead._digital {
  top: calc(1352 / 1440 * 100vw);
  width: calc(710 / 1440 * 100vw);
}
._card-area {
  position: absolute;
  top: calc(450 / 1440 * 100vw);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
}
._card-area._digital {
  top: calc(1470 / 1440 * 100vw);
}
._card-image {
  width: calc(489 / 1440 * 100vw);
  position: relative;
  left: calc(-22 / 1440 * 100vw);
}
._card-image .hover_only {
  width: calc(450 / 1440 * 100vw);
  position: absolute;
  top: calc(13 / 1440 * 100vw);
  left: calc(20 / 1440 * 100vw);
  z-index: 1;
  opacity: 0;
  transition: .3s ease;
}
._card-image:hover .hover_only {
  opacity: 1;
  transition: .3s ease;
}
._card-area._digital ._card-image {
  width: calc(455 / 1440 * 100vw);
  left: calc(-25 / 1440 * 100vw);
}
._card-detail {
  position: relative;
  top: calc(9 / 1440 * 100vw);
  left: calc(24 / 1440 * 100vw);
  width: calc(374 / 1440 * 100vw);
}
._card-area._digital ._card-detail {
  top: calc(-6 / 1440 * 100vw);
  left: calc(36 / 1440 * 100vw);
}
._card-detail ._note {
  font-size: calc(16 / 1440 * 100vw);
  font-weight: 500;
  line-height: calc(26 / 16);
  color: #1E0000;
  margin-top: calc(11 / 1440 * 100vw);
}
._card-btn-area ._btn {
  top: calc(60 / 1440 * 100vw);
}
._card-btn-area ._other_btn {
  padding: calc(22 / 1440 * 100vw) calc(25 / 1440 * 100vw);
  top: calc(255 / 1440 * 100vw);
  font-size: calc(22 / 1440 * 100vw);
  line-height: calc(27.2 / 22);
  left: 44%;
}
._card-area._digital ._card-btn-area ._other_btn {
  padding: calc(11 / 1440 * 100vw) calc(45 / 1440 * 100vw);
  top: calc(203 / 1440 * 100vw);
  font-size: calc(22 / 1440 * 100vw);
  line-height: calc(27.2 / 22);
  left: 45%;
  text-align: center;
  border-radius: calc(40 / 1440 * 100vw);
}
@media all and (max-width: 1023px) {
  .block-card {
    top: calc(112 / 750 * 100vw);
  }
  .block-card ._content_title {
    top: calc(122 / 750 * 100vw);
    left: 50.1%;
    letter-spacing: calc(-2 / 750 * 100vw);
    line-height: calc(64 / 60);
  }
  .block-card ._content_title._digital {
    top: calc(1503.5 / 750 * 100vw);
    left: 50.2%;
    letter-spacing: calc(-3 / 750 * 100vw);
  }
  .block-card ._content_lead {
    top: calc(406 / 750 * 100vw);
    left: 50%;
    width: calc(600 / 750 * 100vw);
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(21 / 14);
    letter-spacing: calc(0.5 / 750 * 100vw);
  }
  .block-card ._content_lead._digital {
    top: calc(1918 / 750 * 100vw);
    width: calc(710 / 750 * 100vw);
  }
  ._card-area {
    top: calc(564 / 750 * 100vw);
    left: 50%;
    flex-direction: column;
  }
  ._card-area._digital {
    top: calc(2086 / 750 * 100vw);
  }
  ._card-image {
    width: calc(550 / 750 * 100vw);
    left: calc(6 / 750 * 100vw);
  }
  ._card-area._digital ._card-image {
    width: calc(544 / 750 * 100vw);
    left: calc(1 / 750 * 100vw);
  }
  ._card-detail {
    top: calc(6 / 750 * 100vw);
    left: calc(24 / 750 * 100vw);
    width: calc(374 / 750 * 100vw);
  }
  ._card-area._digital ._card-detail {
    top: calc(28 / 750 * 100vw);
    left: calc(25 / 750 * 100vw);
  }
  ._card-detail ._name {
    font-size: calc(32 / 750 * 100vw);
    line-height: calc(21 / 16);
  }
  ._card-detail ._note {
    font-size: calc(20 / 750 * 100vw);
    line-height: calc(16 / 10);
    font-weight: 500;
    margin-top: calc(3 / 750 * 100vw);
    white-space: nowrap;
    letter-spacing: calc(2 / 750 * 100vw);
  }
  ._card-btn-area ._btn {
    top: calc(47 / 750 * 100vw);
    left: calc(16 / 750 * 100vw);
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    font-weight: 500;
    padding: calc(18 / 750 * 100vw) calc(129 / 750 * 100vw);
  }
  ._card-btn-area ._other_btn {
    padding: calc(20 / 750 * 100vw) calc(56 / 750 * 100vw);
    top: calc(255 / 750 * 100vw);
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    left: 68%;
  }
  ._card-area._digital ._card-btn-area ._other_btn {
    padding: calc(11 / 750 * 100vw) calc(80 / 750 * 100vw);
    top: calc(273 / 750 * 100vw);
    font-size: calc(28 / 750 * 100vw);
    line-height: calc(16.8 / 14);
    left: 67%;
    border-radius: calc(55 / 750 * 100vw);
  }

  ._card-image:hover .hover_only {
    opacity: 0;
  }
}