@charset "utf-8";
/*==============================================================

 ■ aclist

===============================================================*/
/*
.font-serif(){
	//font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝";
	font-family: "Noto Serif JP", "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
.font-serif-bold(){
	.font-serif();
	font-weight: bold;
}
*/
.abswh100 {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.wh100 {
  width: 100%;
  height: 100%;
}
.center {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
}
.abscenter {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.hv_center {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
}
.h_center {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
}
.v_center {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.hover_scale {
  transition: all 200ms 0s ease;
}
.hover_scale:hover {
  transform: scale(1.03);
}
/*==============================================================
  ■ (PC)
==============================================================*/
.topkv {
  width: 100%;
  height: 528px;
  border-bottom: 1px solid #333;
}
.topkv__container {
  width: 100%;
}
.topkv__swiper {
  width: 100%;
  height: 472px;
}
.topkv__list__detail {
  position: relative;
  width: 460px;
  height: 472px;
}
.topkv__list__detail__img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.topkv__list__detail__img img {
  width: 460px;
  height: 472px;
  object-fit: cover;
}
.topkv__list__detail__link {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.topkv__list__detail__txt {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 0 40px 23px;
  pointer-events: none;
}
.topkv__list__detail__txt__info {
  width: 100%;
  position: relative;
  margin-bottom: 6px;
}
.topkv__list__detail__txt__info__category {
  font-size: 16px;
  color: black;
  background-color: #CCC;
  display: inline-block;
  height: 24px;
  line-height: 23px;
  padding: 0 5px;
}
.topkv__list__detail__txt__info__category.cat_monthly {
  background-color: #d7d089;
}
.topkv__list__detail__txt__info__category.cat_report {
  background-color: #8db59d;
}
.topkv__list__detail__txt__info__category.cat_donabelab {
  background-color: #b1b7b9;
}
.topkv__list__detail__txt__info__category.cat_donabelife {
  background-color: #fdedc5;
}
.topkv__list__detail__txt__info__category.cat_event {
  background-color: #fccfc4;
}
.topkv__list__detail__txt__info__date {
  display: none;
}
.topkv__list__detail__txt__title {
  font-size: 28px;
  font-weight: bold;
  line-height: 110%;
  color: white;
  margin-bottom: 10px;
  pointer-events: none;
}
.topkv__list__detail__txt__tags {
  font-size: 16px;
  color: white;
}
.topkv__list__detail__txt__tags a {
  color: white;
  display: inline-block;
  margin-right: 10px;
}
.topkv__list__detail__txt__tags a:before {
  content: '#';
}
.about {
  padding-top: 75px;
  padding-bottom: 80px;
  /*
	&__title{
		.bg2("../img/top/pc_top_monthly_title.png");
		margin: 0 auto;
	}
	*/
}
.about__catch {
  font-size: 28px;
  font-weight: bold;
  line-height: 150%;
  text-align: center;
  margin-top: 80px;
}
.about__title {
  display: block;
  position: relative;
  width: 357px;
  height: 196px;
  background-image: url("../img/top/pc_top_monthly_title.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  background: none;
  overflow: visible;
  margin: 0 auto;
}
.about__title a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accl {
  width: 58.65px;
  height: 152.95px;
  background-image: url("../img/top/mlogo_l.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 0px;
  top: 42px;
}
.about__title__accl a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accr {
  width: 58.075px;
  height: 155.25px;
  background-image: url("../img/top/mlogo_r.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: 0px;
  top: 42px;
}
.about__title__accr a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accl1 {
  width: 23px;
  height: 35.65px;
  background-image: url("../img/top/mlogo_l1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 35px;
  top: 160px;
}
.about__title__accl1 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accl2 {
  width: 31.05px;
  height: 50.025px;
  background-image: url("../img/top/mlogo_l2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 13px;
  top: 108px;
}
.about__title__accl2 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accl3 {
  width: 34.5px;
  height: 66.7px;
  background-image: url("../img/top/mlogo_l3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 0px;
  top: 42px;
}
.about__title__accl3 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accr1 {
  width: 28.75px;
  height: 38.525px;
  background-image: url("../img/top/mlogo_r1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: 30px;
  top: 157px;
}
.about__title__accr1 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accr2 {
  width: 23px;
  height: 52.325px;
  background-image: url("../img/top/mlogo_r2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: 11px;
  top: 107px;
}
.about__title__accr2 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__accr3 {
  width: 32.775px;
  height: 67.275px;
  background-image: url("../img/top/mlogo_r3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: 0px;
  top: 43px;
}
.about__title__accr3 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__txt1 {
  width: 47.15px;
  height: 47.15px;
  background-image: url("../img/top/mlogo_t1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 92px;
  top: 0px;
}
.about__title__txt1 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__txt2 {
  width: 48.875px;
  height: 47.15px;
  background-image: url("../img/top/mlogo_t2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 157px;
  top: 0px;
}
.about__title__txt2 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__txt3 {
  width: 43.125px;
  height: 47.15px;
  background-image: url("../img/top/mlogo_t3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 225px;
  top: 0px;
}
.about__title__txt3 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__txt4 {
  width: 44.85px;
  height: 47.15px;
  background-image: url("../img/top/mlogo_t4.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 92px;
  top: 76px;
}
.about__title__txt4 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__txt5 {
  width: 36.225px;
  height: 47.15px;
  background-image: url("../img/top/mlogo_t5.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 163px;
  top: 76px;
}
.about__title__txt5 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__txt6 {
  width: 23.575px;
  height: 47.15px;
  background-image: url("../img/top/mlogo_t6.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 235px;
  top: 76px;
}
.about__title__txt6 a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__title__read {
  width: 176.525px;
  height: 23.575px;
  background-image: url("../img/top/mlogo_read.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  left: 91px;
  top: 153px;
}
.about__title__read a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__read {
  font-size: 16px;
  line-height: 200% ;
  margin-top: 25px;
}
.about__link {
  position: relative;
  display: block;
  width: 140px;
  height: 140px;
  margin: 80px auto 0;
}
.about__link p {
  display: block;
  width: 34px;
  height: 22px;
  background-image: url("../img/top/pc_top_monthly_arrow.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  transition: all 300ms 0s ease;
}
.about__link p a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
@keyframes aboutlinkanime {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-359deg);
  }
}
.about__link:after {
  content: '';
  display: block;
  width: 138.5px;
  height: 136.5px;
  background-image: url("../img/top/pc_top_monthly_linktext.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  animation: aboutlinkanime 20s linear 0s infinite normal none running;
}
.about__link:after a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.about__link:hover p {
  transform: translateX(3px);
}
.about:after {
  content: '';
  display: block;
  width: 960px;
  height: 1px;
  background-color: #333;
  position: absolute;
  margin: auto;
  bottom: 0;
  left: 0;
  right: 0;
}
.newarticle {
  padding-top: 68px;
  padding-bottom: 100px;
}
.newarticle:after {
  content: '';
  display: block;
  width: 960px;
  height: 1px;
  background-color: #333;
  position: absolute;
  margin: auto;
  bottom: 0;
  left: 0;
  right: 0;
}
.newarticle__title {
  font-size: 67px;
  font-family: "Outfit", "游ゴシック体", 'Yu Gothic', "YuGothic", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', "メイリオ", "Meiryo", "Osaka", 'ＭＳ Ｐゴシック', 'MS PGothic', "sans-serif";
  font-weight: 200;
  line-height: 110%;
  margin: 0 auto;
}
.newarticle__subtitle {
  margin-top: 7px;
}
.newarticle__list {
  position: relative;
  margin-top: 43px;
  padding-left: 510px;
}
.newarticle__list:after {
  content: '';
  display: block;
  background-color: #c1c1c1;
  width: 1px;
  height: 580px;
  position: absolute;
  left: 470px;
  top: 10px;
}
.newarticle__list__detail {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  padding: 20px 10px;
  width: 370px;
  border-bottom: 1px solid #c1c1c1;
}
.newarticle__list__detail:hover {
  opacity: 0.9;
}
.newarticle__list__detail:hover .newarticle__list__detail__img img {
  transform: scale(1.05);
}
.newarticle__list__detail__link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.newarticle__list__detail__img {
  min-width: 105px;
  width: 105px;
  height: 105px;
  overflow: hidden;
}
.newarticle__list__detail__img img {
  width: 105px;
  height: 105px;
  object-fit: cover;
  transition: all 300ms 0s ease;
}
.newarticle__list__detail__txt {
  padding-left: 23px;
  width: 100%;
}
.newarticle__list__detail__txt__info {
  position: relative;
  width: 100%;
  margin-top: -10px;
}
.newarticle__list__detail__txt__info__category {
  display: inline-block;
  font-size: 11px;
  font-weight: bold;
  color: #333;
  height: 20px;
  line-height: 19px;
  padding: 0 6px;
  background-color: #CCC;
}
.newarticle__list__detail__txt__info__category.cat_monthly {
  background-color: #d7d089;
}
.newarticle__list__detail__txt__info__category.cat_report {
  background-color: #8db59d;
}
.newarticle__list__detail__txt__info__category.cat_donabelab {
  background-color: #b1b7b9;
}
.newarticle__list__detail__txt__info__category.cat_donabelife {
  background-color: #fdedc5;
}
.newarticle__list__detail__txt__info__category.cat_event {
  background-color: #fccfc4;
}
.newarticle__list__detail__txt__info__date {
  font-size: 14px;
  font-weight: bold;
  color: #909195;
  position: absolute;
  right: 0;
  top: 0;
}
.newarticle__list__detail__txt__title {
  font-size: 18px;
  font-weight: bold;
  line-height: 150%;
}
.newarticle__list__detail__txt__tags {
  display: none;
}
.newarticle__list__detail__txt__disc {
  display: none;
}
.newarticle__list__detail:nth-child(1) {
  position: absolute;
  left: 0px;
  top: 10px;
  display: block;
  width: 430px;
  padding: 10px 0;
  border: none;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__img {
  width: 430px;
  height: 430px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__img img {
  width: 430px;
  height: 430px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__txt {
  padding: 0;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__txt__info {
  margin-top: 11px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__category {
  font-size: 16px;
  height: 25px;
  line-height: 24px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__title {
  font-size: 24px;
  line-height: 125%;
  margin-top: 5px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__tags {
  display: block;
  margin-top: 8px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__tags a {
  font-size: 14px;
  color: #909195;
  margin-right: 5px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__tags a:before {
  content: '#';
}
.newarticle__list__detail:nth-child(1) .aclist__detail__date {
  font-size: 16px;
}
.newarticle__list__detail:nth-child(1) .aclist__detail__disc {
  display: block;
  width: 100%;
  margin-top: 10px;
}
.newarticle__link {
  display: block;
  width: 220px;
  text-align: center;
  font-size: 18px;
  color: #333;
  margin: 352px auto 0;
}
.newarticle__link p {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
.newarticle__link .arrow {
  display: inline-block;
  vertical-align: middle;
  width: 44px;
  height: 44px;
  background-image: url("../img/top/pc_btn_ar.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  transition: all 300ms 0s ease;
  pointer-events: none;
}
.newarticle__link .arrow a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.newarticle__link:hover p {
  opacity: 0.8;
}
.newarticle__link:hover .arrow {
  transform: scale(1.1);
}
.life {
  height: 800px;
  padding-top: 80px;
  padding-bottom: 100px;
}
.life .inner {
  padding-top: 109.86667vw;
}
.life__title {
  display: none;
}
.life__bg {
  display: block;
  width: 880px;
  height: 648px;
  background-image: url("../img/top/pc_top_donabe_bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  position: absolute;
  left: 40px;
  top: 0;
}
.life__read {
  width: 310px;
  position: absolute;
  left: 570px;
  top: 195px;
}
.life__plink {
  display: block;
  width: 390px;
  height: 390px;
  position: absolute;
  left: 140px;
  top: 194px;
}
.life__link {
  display: block;
  width: 310px;
  text-align: center;
  font-size: 18px;
  color: #333;
  position: absolute;
  left: 570px;
  top: 380px;
}
.life__link p {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
.life__link .arrow {
  display: inline-block;
  vertical-align: middle;
  width: 44px;
  height: 44px;
  background-image: url("../img/top/pc_btn_ar.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  transition: all 300ms 0s ease;
  pointer-events: none;
}
.life__link .arrow a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.life__link:hover p {
  opacity: 0.8;
}
.life__link:hover .arrow {
  transform: scale(1.1);
}
.receipe {
  padding-top: 20px;
  padding-bottom: 74px;
}
.receipe__title {
  font-size: 67px;
  font-family: "Outfit", "游ゴシック体", 'Yu Gothic', "YuGothic", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', "メイリオ", "Meiryo", "Osaka", 'ＭＳ Ｐゴシック', 'MS PGothic', "sans-serif";
  font-weight: 200;
  line-height: 110%;
  margin: 0 auto;
}
.receipe__subtitle {
  margin-top: 5px;
}
.receipe__list {
  position: relative;
  margin-top: 825px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
}
.receipe__list__detail {
  position: relative;
  width: 200px;
  margin: 0 10px;
}
.receipe__list__detail:hover .receipe__list__detail__img img {
  transform: scale(1.05);
}
.receipe__list__detail__img {
  width: 200px;
  height: 200px;
  overflow: hidden;
}
.receipe__list__detail__img img {
  width: 200px;
  height: 200px;
  object-fit: cover;
  transition: all 300ms 0s ease;
}
.receipe__list__detail__txt {
  margin-top: 8px;
}
.receipe__list__detail__txt__date {
  display: none;
}
.receipe__list__detail__txt__title {
  line-height: 150%;
}
.receipe__list__detail__link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.receipe__list__detail:nth-child(1) {
  position: absolute;
  margin: auto;
  width: 640px;
  top: -774px;
  left: 0;
  right: 0;
}
.receipe__list__detail:nth-child(1) .receipe__list__detail__img {
  width: 640px;
  height: 640px;
}
.receipe__list__detail:nth-child(1) .receipe__list__detail__img img {
  width: 640px;
  height: 640px;
}
.receipe__list__detail:nth-child(1) .receipe__list__detail__txt {
  margin-top: 28px;
}
.receipe__list__detail:nth-child(1) .receipe__list__detail__txt__date {
  display: block;
}
.receipe__list__detail:nth-child(1) .receipe__list__detail__txt__title {
  font-size: 24px;
}
.event {
  height: 720px;
  padding-bottom: 100px;
}
.event .inner {
  padding-top: 109.86667vw;
}
.event__title {
  display: none;
}
.event__bg {
  display: block;
  width: 880px;
  height: 580px;
  background-image: url("../img/top/pc_top_event_bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  position: absolute;
  left: 40px;
  top: 0;
}
.event__read {
  width: 310px;
  position: absolute;
  left: 570px;
  top: 114px;
}
.event__plink {
  display: block;
  width: 390px;
  height: 390px;
  position: absolute;
  left: 140px;
  top: 124px;
}
.event__link {
  display: block;
  width: 310px;
  text-align: center;
  font-size: 18px;
  color: #333;
  position: absolute;
  left: 570px;
  top: 290px;
}
.event__link p {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
.event__link .arrow {
  display: inline-block;
  vertical-align: middle;
  width: 44px;
  height: 44px;
  background-image: url("../img/top/pc_btn_ar.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  transition: all 300ms 0s ease;
  pointer-events: none;
}
.event__link .arrow a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.event__link:hover p {
  opacity: 0.8;
}
.event__link:hover .arrow {
  transform: scale(1.1);
}
.link {
  padding-top: 132px;
  padding-bottom: 102px;
  background-color: #e7e9f4;
}
.link__logo {
  width: 186px;
  height: 239px;
  background-image: url("../img/top/pc_link_logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 auto;
}
.link__logo a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.link__know {
  margin-top: 82px;
}
.link__know__title {
  text-align: center;
  font-size: 40px;
  font-weight: bold;
}
.link__know__read {
  text-align: center;
  margin-top: 34px;
}
.link__know__link {
  display: block;
  position: relative;
  width: 140px;
  height: 140px;
  margin: 45px auto 0;
}
.link__know__link span {
  display: block;
  width: 34px;
  height: 22px;
  background-image: url("../img/top/pc_top_monthly_arrow.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  transition: all 300ms 0s ease;
  pointer-events: none;
}
.link__know__link span a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.link__know__link:after {
  content: '';
  display: block;
  width: 135px;
  height: 135px;
  background-image: url("../img/top/pc_top_link_linktext.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  animation: aboutlinkanime 20s linear 0s infinite normal none running;
}
.link__know__link:after a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.link__know__link:hover span {
  transform: translateX(3px);
}
.link .title {
  font-size: 24px;
  line-height: 150%;
  font-weight: bold;
  color: #333;
}
.link .title span {
  font-size: 18px;
}
.link .read {
  font-size: 16px;
  text-align: left;
  margin-top: 33px;
}
.link__container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  margin-top: 64px;
}
.link__container a {
  position: relative;
  display: block;
  width: 270px;
  height: 355px;
  padding-top: 47px;
  text-align: center;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  margin: 0 30px;
  transition: all 300ms 0s ease;
}
.link__container a:after {
  content: '';
  display: block;
  width: 44px;
  height: 44px;
  background-image: url("../img/top/pc_btn_ar.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  bottom: 38px;
  transition: all 300ms 0s ease;
}
.link__container a:after a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.link__container a:hover {
  opacity: 0.7;
}
.link__container a:hover:after {
  transform: scale(1.1);
}
.link__container .link__shop {
  padding-top: 30px;
}
.link__container .link__shop .read {
  margin-top: 15px;
}
.link__container .link__story {
  padding-top: 30px;
}
.link__container .link__story .read {
  margin-top: 15px;
}
/*
.link__container .link__qa {
  display: none;
}
*/
.news {
  padding-top: 58px;
  padding-bottom: 58px;
}
.news__title {
  font-size: 67px;
  font-family: "Outfit", "游ゴシック体", 'Yu Gothic', "YuGothic", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', "メイリオ", "Meiryo", "Osaka", 'ＭＳ Ｐゴシック', 'MS PGothic', "sans-serif";
  font-weight: 200;
  line-height: 110%;
  margin: 0 auto;
}
.news__subtitle {
  margin-top: 10px;
}
.news__list {
  margin-top: 66px;
}
.news__list__detail {
  position: relative;
  border-bottom: 1px solid #c1c1c1;
  padding-top: 29px;
  padding-bottom: 41px;
  padding-left: 10px;
}
.news__list__detail:hover {
  opacity: 0.9;
}
.news__list__detail:hover:after {
  right: 4px;
}
.news__list__detail:first-child {
  border-top: 1px solid #c1c1c1;
}
.news__list__detail__date {
  font-size: 14px;
  font-weight: bold;
  color: #909195;
}
.news__list__detail__title {
  font-size: 16px;
  color: #2b2c2e;
  line-height: 150%;
  padding-right: 80px;
  margin-top: 5px;
}
.news__list__detail__link {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.news__list__detail:after {
  content: "";
  display: block;
  width: 26px;
  height: 26px;
  background-image: url("../img/top/pc_btn_ar_small.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 8px;
  transition: all 300ms 0s ease;
  pointer-events: none;
}
.news__list__detail:after a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.news__link {
  display: block;
  width: 310px;
  text-align: center;
  font-size: 18px;
  color: #333;
  margin: 50px auto 0;
}
.news__link p {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
.news__link .arrow {
  display: inline-block;
  vertical-align: middle;
  width: 44px;
  height: 44px;
  background-image: url("../img/top/pc_btn_ar.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  margin-left: 10px;
  transition: all 300ms 0s ease;
}
.news__link .arrow a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.news__link:hover p {
  opacity: 0.8;
}
.news__link:hover .arrow {
  transform: scale(1.1);
}
.recommend {
  padding-top: 55px;
  padding-bottom: 58px;
}
.recommend__title {
  font-size: 67px;
  font-family: "Outfit", "游ゴシック体", 'Yu Gothic', "YuGothic", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', "メイリオ", "Meiryo", "Osaka", 'ＭＳ Ｐゴシック', 'MS PGothic', "sans-serif";
  font-weight: 200;
  line-height: 110%;
  margin: 0 auto;
}
.recommend__subtitle {
  margin-top: 10px;
}
.recommend__listcontainer {
  margin: 55px auto 0;
  width: 860px;
}
.recommend__list {
  width: 100%;
}
.recommend__list__detail {
  position: relative;
  width: 200px;
  overflow: hidden;
}
.recommend__list__detail:hover {
  opacity: 0.9;
}
.recommend__list__detail:hover img {
  transform: scale(1.05);
}
.recommend__list__detail__img {
  width: 200px;
  height: 200px;
  overflow: hidden;
}
.recommend__list__detail__img img {
  width: 200px;
  height: 200px;
  object-fit: cover;
  transition: all 300ms 0s ease;
}
.recommend__list__detail__link {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}
.recommend__list__detail__txt {
  padding-top: 14px;
}
.recommend__list__detail__txt__title {
  font-size: 16px;
  color: #2b2c2e;
  width: 200px;
  line-height: 130%;
  white-space: normal;
}
.recommend__list__detail__txt__read {
  font-size: 16px;
  color: #2b2c2e;
  line-height: 150%;
  margin-top: 13px;
}
.recommend__list__detail__txt__price {
  font-size: 14px;
  color: #909195;
  line-height: 150%;
  margin-top: 15px;
}
.recommend__list__detail__txt__link {
  font-size: 14px;
  color: #333;
  display: inline-block;
  border-bottom: 1px solid #333;
  margin-top: 15px;
}
.recommend__list__detail__title {
  font-size: 16px;
  color: #2b2c2e;
  width: 200px;
  line-height: 130%;
  white-space: normal;
  margin-top: 5px;
}
.recommend__swipernav {
  margin-top: 30px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
}