@charset "UTF-8";
/**
 * 数値計算
 * ---------------------------------------- */
/**
 * ブレイクポイント
 * ---------------------------------------- */
/**
 * フォント
 * ---------------------------------------- */
/**
 * カラー
 * ---------------------------------------- */
/**
 * カラー以外の変数を定義
 * ---------------------------------------- */
/**
 * 改行
 * ---------------------------------------- */
/**
 * ホバー
 * ---------------------------------------- */
#suntory_contents .knowledgeMvTop {
  backdrop-filter: blur(8px);
  background-color: rgba(177, 177, 177, 0.2);
  padding-top: 48px;
  padding-right: 30px;
  padding-bottom: 48px;
  padding-left: 40px;
  border: 2px solid #9fc5d9;
  border-radius: 40px;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeMvTop {
    padding-top: 100px;
    padding-right: 16px;
    padding-bottom: 38px;
    padding-left: 16px;
  }
}
#suntory_contents .knowledgeMvTop .cImage.-first {
  position: absolute;
  top: -52px;
  left: 64px;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeMvTop .cImage.-first {
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeMvTop .cImage.-first img {
    width: 107px;
    height: 139px;
  }
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeMvTop .cImage.-second img {
    width: 277px;
    height: 131px;
  }
}
#suntory_contents .knowledgeTop {
  backdrop-filter: blur(8px);
  background-color: rgba(177, 177, 177, 0.2);
  padding-top: 54px;
  padding-right: 28px;
  padding-bottom: 41px;
  padding-left: 40px;
  border: 2px solid #9fc5d9;
  border-radius: 40px;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop {
    grid-template-columns: 1fr;
    padding-top: 37px;
    padding-right: 16px;
    padding-bottom: 37px;
    padding-left: 16px;
  }
}
#suntory_contents .knowledgeTop .cFlex {
  grid-area: 2/1/3/2;
}
#suntory_contents .knowledgeTop .cTitle {
  grid-area: 3/1/4/2;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop .cTitle {
    grid-area: 4/1/5/2;
  }
}
#suntory_contents .knowledgeTop .cText {
  grid-area: 4/1/5/2;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop .cText {
    grid-area: 5/1/6/2;
    padding-bottom: 0;
  }
}
#suntory_contents .knowledgeTop .cImage.-title {
  grid-area: 1/1/2/2;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop .cImage.-title img {
    width: 158px;
    height: 29px;
  }
}
#suntory_contents .knowledgeTop .cImage.-icon {
  grid-area: 1/2/5/3;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop .cImage.-icon {
    grid-area: 3/1/4/2;
  }
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop .cImage.-icon img {
    width: 60px;
    height: 79px;
  }
}
#suntory_contents .knowledgeTop .cImage {
  grid-area: 1/2/5/3;
}
@media screen and (max-width: 767px) {
  #suntory_contents .knowledgeTop .cImage {
    grid-area: 3/1/4/2;
  }
}