@charset "utf-8";

/* ---------------------------------------------
- 宗田鰹（BS）index 
- 宗田鰹（BS）CBL 
- 宗田鰹（BS）BPL 
--------------------------------------------- */

/* ---------------------------------------------
- 宗田鰹（BS）index 
--------------------------------------------- */

/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#BS #wrap::before {
	content: "";
  display: block;
	margin: auto calc(50% - 50vw);
	width: 100vw;
	height: 100vh;
  background-color: var(--gray);
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
}

/* --- TOP --- */
.BS_TOP {
	margin: auto;
  padding: 5%;
  width: 100%;
  background-color: var(--black);
	position: relative;
}

/* --- TITLE --- */
.BS_TTL {
	margin: 23% auto auto;
  padding-bottom: 20%;
  position: relative;
}

.BS_TTL h2 {
  margin: auto auto 13%;
  width: 90%;
	font-family: "ShipporiMin", serif;
  font-weight: 400;
  font-size: var(--fs_20);
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: left;
  position: relative;
}

.BS_TTL h2 span.f1 {
  display: inline-block;
  margin-bottom: 5%;
  font-size: 165%;
  position: relative;
}

.BS_TTL h2 span.f2 {
  display: inline-block;
  margin-top: 3%;
  font-size: 165%;
  position: relative;
}

.BS_TTL h2 span.f2::before {
  content: "";
  width: 105%;
  height: min(0.3vw,2.25px);
  background-color: var(--black);
  position: absolute;
  top: 55%;
  right: -115%;
}

.BS_TTL p {
  margin: auto;
  width: 90%;
	font-family: "ShipporiMin", serif;
  font-weight: 400;
  font-size: var(--fs_15);
  line-height: 2.2;
  letter-spacing: 0.075em;
  text-align: left;
}

.BS_TTL .BS_ins-img {
  display: inline-block;
  width: 20%;
  position: absolute;
  bottom: 0%;
  right: 5%;  
}

/* --- BS_LINE-UP --- */
.BS_LINE-UP {
  padding-bottom: 25%;
}

#CBL {
  padding-top: 10%;
}

#BPL {
  padding-top: 15%;
}

/* image_wrap */
.image_wrap {
  margin: auto;
  width: 90%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
}

#CBL .imagePHOTO,
#CBL .imageTEXT,
#BPL .imagePHOTO,
#BPL .imageTEXT {
  width: 47.222222%;
}

/* text */
.imageTEXT h3 {
  margin-top: 28%;
	font-family: "GenjyuuGLP", sans-serif;
	font-weight: 700;
  font-style: italic;
  font-size: min(52.5px, max(7vw, 25.2px));
  letter-spacing: 0.02em;
	line-height: 1;
  text-align: left;
  white-space: nowrap;
  transform: translate(0,-10%);
}

.imageTEXT h3 span.f1 {
  display: inline-block;
  font-weight: 500;
  font-size: 60%;
}

/* LINK */
.imageTEXT .linkbox {
  width: 100%;
  position: relative;
  margin-top: 45%;
}

.imageTEXT .linkbox .link {
  width: fit-content;
  position: absolute;
  top: 50%;
  right: 40%;
  transform: translate(0,-50%);
}

.imageTEXT .linkbox .link a p {
  width: 100%;
  font-family: "CrInfant", serif;
  font-family: "CrSC", serif;
  font-weight: 500;
  font-size: min( 5.5vw, 41.25px);
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: right;
  white-space: nowrap;
  position: relative;
  transform: translate(-14%,0);
}

/* リンク矢印 */
.imageTEXT .linkbox .link a::before {
  content: "";
  width: 160%;
  height: 1px;
  transform: scale(1,0.5);
  background-color: var(--black);
  position: absolute;
  top: 125%;
  left: -15%;
}

/* CSS Hacks : Firefox */
_:lang(x)::-moz-placeholder, .imageTEXT .linkbox .link a::before {
  content: "";
  width: 160%;
  height: 1px;
  transform: scale(1,0.8);
  background-color: var(--black);
  position: absolute;
  top: 125%;
  left: -15%;
}



.imageTEXT .linkbox .link a::after {
  content: "";
  width: 15%;
  height: 1px;
  background-color: var(--black);
  border-left: solid 1px var(--black);
  transform: rotate(25deg) scale(1,0.5);
  transform-origin: 100% 100%;
  position: absolute;
  top: 125%;
  left: auto;
  right: -46%;
}

/* リンクマーク */
.imageTEXT .linkbox .link a p::after {
  content: "";
  width: 1.3em;
  height: 1.3em;
  background-image: url(../site_images/parts/icon_img/link-in_thin-333.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: auto;
  bottom: -30%;
  left: auto;
  right: -95%;
}

/* text */
#CBL .CBL_TXT,
#BPL .BPL_TXT {
  margin: auto;
  padding: 8% 0;
  width: 90%;
  border-bottom: solid min(0.2vw,1.5px) #999;
}

#CBL .CBL_TXT p,
#BPL .BPL_TXT p {
	font-family: "GenjyuuGLP", sans-serif;
	font-weight: 300;
  font-size: var(--fs_14);
	line-height: 1.6;
  letter-spacing: 0.06em;
  text-align: justify;
}

/* --- link対策(PC・SP)@media制御 --- */
/* for PC */
@media (hover: hover) {
  .imageTEXT .linkbox .link a:hover {
    opacity: 0.6;
  }

}

/* for SP */
@media (hover: none) {
  .imageTEXT .linkbox .link a:active {
    opacity: 0.6;
  }

}



/* ---------------------------------------------
- 宗田鰹（BS）CBL 
--------------------------------------------- */
/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#bs-cbl #wrap::before {
  content: "";
  display: block;
  margin: auto calc(50% - 50vw);
  width: 100vw;
  height: 100vh;
  background: url( ../site_images/prodCAT/aomono_BS/bs-cbl/bs_cbl_bg.jpg);
  background: image-set( url( ../site_images/prodCAT/aomono_BS/bs-cbl/bs_cbl_bg.webp));
  background-size: cover;
  background-position: 5% 50%;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

.bs-cbl {
  margin: auto;
  padding: 25% 0 0;
  color: var(--white);
}

/* --- TOP --- */
.cbl-TOP  {
  margin: auto;
}

/* TEXT */
.cbl-TOP-TXT {
  margin: auto;
}

.cbl-TOP-TXT p {
  margin-bottom: 4.5%;
  font-family: "ShipporiMin", sans-serif;
  font-weight: 400;
  font-size: min(46px, max(6.133333vw, 22.08px));
  line-height: 1;
  letter-spacing: 0.1em;
  text-align: center;
  white-space: nowrap;
}

.cbl-TOP-TXT h1 {
  margin: auto;
  font-family: "ShipporiMin", sans-serif;
  font-weight: 400;
  font-size: min(70px, max(9.333333vw, 33.6px));
  line-height: 1;
  letter-spacing: 0.1em;
  text-align: center;
  white-space: nowrap;
}

/* logo */
.cbl-TOP-logo {
  margin: 12% auto 25%;
  display: flex;
  width: 53%;
  justify-content: space-between;
  align-items: center;
}

.cbl-TOP-logo img {
  display: inline-block;
  width: 46%;
}

.cbl-TOP-logo a img {
  display: inline-block;
  width: 82%;
}

/* --- link対策(PC・SP)@media制御 --- */
/* for PC */
@media (hover: hover) {
  .cbl-TOP-logo a:hover {
    opacity: 0.6;
  }

}

/* for SP */
@media (hover: none) {
  .cbl-TOP-logo a:active {
    opacity: 0.6;
  }

}



/* TEXT2 */
.cbl-TOP-TXT2 {
  margin: 25% auto;
  width: fit-content;
}

.cbl-TOP-TXT2 p {
  margin-bottom: 5%;
  font-family: "ShipporiMin", sans-serif;
  font-weight: 400;
  font-size: var(--fs_16);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.cbl-TOP-TXT2 p:nth-of-type(2) {
  margin-bottom: 7%;
}

.cbl-TOP-TXT2 p:nth-of-type(3) {
  font-size: min(52.5px, max(7vw, 25.2px));
}


/* --- CBL商品 --- */

.cbl-kimochi,
.cbl-butchigiri {
  margin: auto;
  position: relative;
}

.cbl-hatsuchiizu {
  margin: auto auto 15%;
  position: relative;
}

/* IMG */
.cbl-kimochi-image,
.cbl-butchigiri-image,
.cbl-hatsuchiizu-image {
  padding: 5% 0 32%;
  position: relative;
  overflow: hidden;
}

.cbl-kimochi-image h2 {
  width: 40%;
  height: min(255px, max(34vw, 122.4px));
  position: absolute;
  top: 50%;
  right: -3%;
  z-index: 1;
}

.cbl-butchigiri-image h2 {
  width: 40%;
  height: min(255px, max(34vw, 122.4px));
  position: absolute;
  top: 42%;
  left: 6%;
  z-index: 1;
} 

.cbl-hatsuchiizu-image h2 {
  width: 40%;
  height: min(255px, max(34vw, 122.4px));
  position: absolute;
  top: 40%;
  right: 7%;
  z-index: 1;
}

.cbl-kimochi-image__photo,
.cbl-hatsuchiizu-image__photo {
  margin: auto auto auto 0;
  width: 78%;
}

.cbl-butchigiri-image__photo {
  margin: auto 0 auto auto;
  width: 78%;
}

/* TEXT */
.cbl-kimochi .cbl-text-space {
  margin: auto auto 5%;
  padding: 5% 7%;
  width: 100%;
  background-color: rgba(255,255,255,0.085);
}

.cbl-butchigiri .cbl-text-space {
  margin: -7% auto 5%;
  padding: 5% 7%;
  width: 100%;
  background-color: rgba(255,255,255,0.085);
}

.cbl-hatsuchiizu .cbl-text-space {
  margin: -15% auto 5%;
  padding: 5% 7%;
  width: 100%;
  background-color: rgba(255,255,255,0.085);
}

.cbl-text-space p {
  margin-bottom: 0.5em;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 400;
  font-size: var(--fs_14);
  letter-spacing: 0.08em;
  line-height: 1.6;
  text-align: justify;
}

.cbl-text-space p:last-child {
  margin-bottom: 0;
}

.cbl-text-space p span.f1 {
  display: inline-block;
  transform: scale(0.7);
}

/* --- アイコン --- */
.cbl-hatsuchiizu .icon_LTO {
  margin: auto auto 2.5% 1%;
  width: 19%;
}

.cbl-hatsuchiizu-image {
  padding: 0 0 32%;
}

/* --- 区切り線 --- */

.cbl_div-line {
  margin: -5% auto 25%;
  width: 85%;
  height: min(2px, max(0.266667vw, 0.96px));
  background-color: var(--white);
}

/* 肝血・区切り線 */
.cbl-kimochi .divider-line {
  margin: auto;
  width: 100%;
  height: 1px;
  background-color: var(--white);
  position: absolute;
  bottom: 4.5%;
  left: 0;
  transform: scale(1,0.3);
  opacity: 0.5;
}

/* 肝血・区切り線 */
/* ぶつ血切り・区切り線 */
.cbl-kimochi .divider-line,
.cbl-butchigiri .divider-line {
  margin: auto;
  width: 100%;
  height: 1px;
  background-color: var(--white);
  position: absolute;
  bottom: 4.5%;
  left: 0;
  transform: scale(1,0.3);
  opacity: 0.5;
}



/* ------ Rm:ろうそく(Rousoku Mejika) ------ */
.cbl-rm {
  margin: auto;
  padding: 25% 0 0;
  position: relative;
}


/* --- 1 --- */
.rm_TOP-logo {
  margin: auto;
  position: relative;
}

.rm_TOP-logo h2 {
  margin: auto auto 25%;
  width: 40%;
}

/* icon */
.rm_TOP-logo img.icon {
  width: 18%;  
  position: absolute;
  top: -80%;
  left: 30%;
}


/* --- 2 --- */
.rm_TOP-img {
  margin: auto;
  width: 100%;
}

/* --- 3 --- */
.rm_TTL {
  margin: 20% auto 18%;
}

.rm_TTL p,
.rm_TTL h2 {
  font-family: "ShipporiMin", serif;
	font-weight: 400;
	line-height: 1;
  letter-spacing: 0.05em;
	color: var(--white);
  text-align: center;
  white-space: nowrap;
}

.rm_TTL p:nth-of-type(1) {
  margin: auto;
  font-size: var(--fs_18);
}

.rm_TTL p:nth-of-type(2) {
  margin: 3% auto 6.5%;
  font-size: min(46px, max(6.133333vw, 22.08px));
  letter-spacing: 0.07em;
}

.rm_TTL h2 {
  margin: auto;
  font-size: min(70px, max(9.333333vw, 33.6px));
}

/* --- 4 --- */
.rm_TXT {
  margin: auto;
  width: 82%;
}

.rm_TXT p {
  font-family: "GenjyuuGLP", sans-serif;
	font-weight: 400;
  font-size: var(--fs_14);
	line-height: 1.6;
  letter-spacing: 0.08em;
	color: var(--white);
  text-align: justify;
}

/* --- 5 --- */
.rm_PACK-img {
  margin: 25% auto auto;
  width: 100%;
}

.rm_PACK-img img {
  width: 100%;
}



/* ------ カート上書設定 ------ */
#bs-cbl .bs-cbl .cart_wrap {
  margin-top: 20%;
  padding: 0 0 20%;
  border-top: solid 1px var(--white);
}

.cbl-butchigiri,
.cbl-hatsuchiizu {
  margin-top: 20%;
}


#bs-cbl .cbl-rm .cart-SPEC h2.fs1 {
  font-size: min(45px, max(6vw, 21.6px));
}



/* ---------------------------------------------
- 宗田鰹（BS）BPL 
--------------------------------------------- */
/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#bs-bpl #wrap::before {
	content: "";
  display: block;
	margin: auto calc(50% - 50vw);
	width: 100vw;
	height: 100vh;
  background: url( ../site_images/prodCAT/aomono_BS/bs-bpl/BG_BPL.jpg);
  background: image-set( url( ../site_images/prodCAT/aomono_BS/bs-bpl/BG_BPL.webp));
  background-size: cover;
  background-position: 5% 50%;
  background-repeat: no-repeat;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
  
}

/* --- TOP --- */
.bpl-TOP {
  margin: 15% auto auto;
  position: relative;
  z-index: 0;  
}

.bpl-TOP p {
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  font-size: var(--fs_13);
  letter-spacing: 0.05em;
  line-height: 1;
  color: var(--white);
  position: absolute;
  bottom: 3%;
  right: 1%;
}

/* link logo */
.bpl-TOP h2 {
  width: 22%;
  position: absolute;
  top: 7%;
  left: 48%;
  z-index: 0;  
}

.bpl-TOP h2 a {
  display: inline-block;
  position: relative;
}

.bpl-TOP h2 a::before {
  content: "";
  width: 130%;
  height: 1px;
  background-color: var(--white);
  position: absolute;
  top: 109%;
  left: 0;
  transform: scale(1,0.5);
}

.bpl-TOP h2 a::after {
  content: "";
  width: 15%;
  height: 1px;
  background-color: var(--white);
  position: absolute;
  top: 109%;
  left: 115%;
  transform: rotate(20deg) scale(1,0.5);
  transform-origin: 100% 100%;
}




/* --- link対策(PC・SP)@media制御 --- */
/* for PC */
@media (hover: hover) {
  .bpl-TOP h2 a:hover {
    opacity: 0.6;
  }

}

/* for SP */
@media (hover: none) {
  .bpl-TOP h2 a:active {
    opacity: 0.6;
  }

}



/* --- TEXT --- */
.bpl-TXT {
  margin: 20% auto 23%;
  width: 80%;
}

.bpl-TXT h2 {
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 900;
  font-size: var(--fs_19);
  font-style: italic;
  letter-spacing: 0.15em;
  line-height: 1;
  text-align: right;
  color: var(--white);
  transform: translate(3%,0);
}

.bpl-TXT h2 span.f1 {
  display: inline-block;
  margin-top: 5%;
  font-size: 150%;
  font-style: italic;
  transform: translate(-2%,0);
}

/* --- INSERT --- */
.bpl-INSERT {
  margin: 15% auto auto;
  width: 80%;
  position: relative;
  z-index: 0;
}

/* photo */
.bpl-INSERT__PHOTO {
  margin: auto;
  position: relative;
  z-index: 0;
}

/* text */
.bpl-INSERT__TXT {
  width: 46%;
  padding-top: 50%;
  position: absolute;
  top: 49%;
  left: 0;
  z-index: 0;
}

.bpl-INSERT__TXT--text {
  position: absolute;
  top: 39%;
  left: 0;
  transform: translate(0,0);
}

.bpl-INSERT__TXT--text p {
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 500;
  font-size: min(45px, max(6vw, 21.6px));
  font-style: italic;
  letter-spacing: 0.05em;
  line-height: 1.3;
  text-align: left;
  color: var(--white);
  white-space: nowrap;
}

.bpl-INSERT__TXT--text p span.f1 {
  display: inline-block;
  margin-bottom: 1%;
}

/* --- TEXT2 --- */
.bpl-TXT2 {
  margin: -12% auto 25%;
  width: 80%;
  padding: 20% 0 5%;
  background-color: rgba(255,255,255,15%);
  position: relative;
  z-index: -1;
}

.bpl-TXT2 p {
  margin: auto;
  width: 90%;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 300;
  font-size: var(--fs_14);
  letter-spacing: 0.05em;
  line-height: 1.8;
  text-align: justify;
  color: var(--white);
}

/* --- INSERT2 --- */
.bpl-INSERT2 {
  margin: auto;
  width: 100%;
}

/* --- TEXT3 --- */
.bpl-TXT3 {
  margin: 5% auto 15%;
  width: 80%;
  position: relative;
}

.bpl-TXT3__TXT {
  margin: auto;
  padding: 5% 0;
  background-color: rgba(255,255,255,20%);
}

.bpl-TXT3__TXT p {
  margin: auto;
  width: 90%;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 300;
  font-size: var(--fs_14);
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: justify;
  color: var(--white);
}

.bpl-TXT3__PHOTO {
  margin: 4% 0 auto auto;
  width: 28.5%;
  position: relative;
  z-index: 0;
}

.bpl-TXT3__PHOTO::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,20%);
  position: absolute;
  top: max( -7vw,-52.5px);
  left: max( -7vw,-52.5px);
  z-index: -1;
}

/* --- 区切り線 --- */
#max-blood .div-line.solid {
  margin: auto;
  width: 80%;
  height: 1px;
  background-color: var(--white);
  transform: scale(1, 0.5);
  border: none;
}

/* --- 7 --- */
.max-blood_7 {
  margin: 15% auto 15%;
}

/* --- BOT --- */
.bpl-BOT {
  margin: 18% auto auto;
  width: 100%;
}

