@charset "UTF-8";
/*common*/
@media screen and (max-width: 750px) {
  header {
    background: none !important; } }

@media screen and (max-width: 750px) {
  main {
    padding-top: 0 !important; } }

.cap {
  position: relative;
  font-weight: 400;
  color: #333333;
  letter-spacing: 0.0em; }
  @media screen and (min-width: 751px) {
    .cap {
      line-height: 1.6em;
      font-size: 1.3rem;
      /*padding-left:divceil(13, 10, rem); 
      text-indent:divceil(-13, 10, rem); */ } }
  @media screen and (max-width: 750px) {
    .cap {
      line-height: 1.6em;
      font-size: 2.6rem; } }

.under_cap {
  position: relative;
  font-weight: 400;
  color: #cc0000;
  letter-spacing: 0.0em; }
  @media screen and (min-width: 751px) {
    .under_cap {
      line-height: 2em;
      font-size: 1.3rem;
      padding-left: 1.3rem;
      text-indent: -1.3rem;
      margin-top: 5rem; } }
  @media screen and (max-width: 750px) {
    .under_cap {
      line-height: 1.852em;
      font-size: 2.7rem;
      padding-left: 2.7rem;
      text-indent: -2.7rem;
      margin-top: 6rem; } }

@media screen and (min-width: 751px) {
  #diz .under_cap {
    margin-top: 8rem; } }
@media screen and (max-width: 750px) {
  #diz .under_cap {
    margin-top: 6rem; } }

/**/
#kv {
  position: relative;
  width: 100%;
  background: #fff;
  z-index: 3; }
  @media screen and (min-width: 751px) {
    #kv {
      height: 42rem; } }
  @media screen and (max-width: 750px) {
    #kv {
      height: 40rem; } }

#kv_bg_img {
  position: relative;
  width: 100%; }
  @media screen and (min-width: 751px) {
    #kv_bg_img {
      height: 42rem; } }
  @media screen and (max-width: 750px) {
    #kv_bg_img {
      height: 40rem; } }

#kv_bg_img img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; }

#kv_product {
  position: absolute;
  display: block;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%; }
  @media screen and (min-width: 751px) {
    #kv_product {
      width: 108rem; } }
  @media screen and (max-width: 750px) {
    #kv_product {
      width: 71rem; } }

#kv_product p {
  position: absolute;
  display: block; }
  @media screen and (min-width: 751px) {
    #kv_product p {
      right: 0rem;
      bottom: -4rem; } }
  @media screen and (max-width: 750px) {
    #kv_product p {
      right: 0rem;
      bottom: -4rem; } }

#milkdaizu #kv_product p {
  position: absolute;
  display: block; }
  @media screen and (min-width: 751px) {
    #milkdaizu #kv_product p {
      width: 23.8rem; } }
  @media screen and (max-width: 750px) {
    #milkdaizu #kv_product p {
      width: 23.8rem; } }

#diz #kv_product p {
  position: absolute;
  display: block; }
  @media screen and (min-width: 751px) {
    #diz #kv_product p {
      width: 33.2rem; } }
  @media screen and (max-width: 750px) {
    #diz #kv_product p {
      width: 33.2rem; } }

#kv h1 {
  position: absolute;
  display: block;
  left: 0; }
  @media screen and (max-width: 750px) {
    #kv h1 {
      bottom: 4.5rem; } }

@media screen and (min-width: 751px) {
  #milkdaizu #kv h1 {
    width: 46.2rem;
    bottom: 6rem; } }
@media screen and (max-width: 750px) {
  #milkdaizu #kv h1 {
    width: 44rem; } }

@media screen and (min-width: 751px) {
  #diz #kv h1 {
    width: 36.7rem;
    bottom: 8rem; } }
@media screen and (max-width: 750px) {
  #diz #kv h1 {
    width: 34.4rem; } }

#product_ttl {
  position: relative;
  width: 100%;
  background: url("../../product/img/tonyu_img.png") center center no-repeat;
  margin: 0;
  padding: 0; }
  @media screen and (min-width: 751px) {
    #product_ttl {
      height: 41rem;
      background-size: 100% 100%; } }
  @media screen and (max-width: 750px) {
    #product_ttl {
      height: 37rem;
      background-size: auto 100%; } }

#product_logo {
  position: relative;
  display: block;
  margin: 0 auto; }
  @media screen and (min-width: 751px) {
    #product_logo {
      padding: 5rem 0 0; } }
  @media screen and (max-width: 750px) {
    #product_logo {
      padding: 6rem 0 0; } }

#product_logo {
  position: relative;
  display: block; }
  @media screen and (min-width: 751px) {
    #product_logo {
      width: 25rem; } }
  @media screen and (max-width: 750px) {
    #product_logo {
      width: 25rem; } }

/**/
main section .inner {
  position: relative;
  margin: 0 auto; }
  @media screen and (min-width: 751px) {
    main section .inner {
      width: 108rem; } }
  @media screen and (max-width: 750px) {
    main section .inner {
      width: 71rem; } }

#point {
  position: relative;
  margin: 0;
  width: 100%;
  overflow: hidden; }
  @media screen and (min-width: 751px) {
    #point {
      padding: 10rem 0 6rem; } }
  @media screen and (max-width: 750px) {
    #point {
      padding: 10rem 0 8rem; } }

#milkdaizu #point h2 {
  position: relative;
  font-weight: 400;
  font-family: "IwaUDGoDspPro-Bd" !important;
  letter-spacing: 0.075em;
  text-align: center; }
  @media screen and (min-width: 751px) {
    #milkdaizu #point h2 {
      line-height: 1.6em;
      font-size: 3.6rem; } }
  @media screen and (max-width: 750px) {
    #milkdaizu #point h2 {
      line-height: 1.6em;
      font-size: 5rem; } }

#diz #point h2 {
  position: relative;
  font-weight: 400;
  font-family: "IwaUDGoDspPro-Bd" !important;
  letter-spacing: 0.075em;
  color: #000000;
  text-align: center; }
  @media screen and (min-width: 751px) {
    #diz #point h2 {
      line-height: 1.6em;
      font-size: 3.6rem; } }
  @media screen and (max-width: 750px) {
    #diz #point h2 {
      line-height: 1.6em;
      font-size: 5rem; } }

/*
#diz #point h2::after{
	content: "";
	display: inline-block;
	position:absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	background: $key_color;
  @include mq(pc) {
	width: divceil(45, 10, rem);
	height: divceil(5, 10, rem);
	transition:.6s ease-out;
  }
  @include mq(sp) {
	width: divceil(100, 10, rem);
	height: divceil(4, 10, rem);
	transition:.6s ease-out;
  }
}
*/
#point .set {
  position: relative;
  display: flex; }
  @media screen and (min-width: 751px) {
    #point .set {
      margin: 0 auto;
      justify-content: space-between;
      align-items: flex-start; } }
  @media screen and (max-width: 750px) {
    #point .set {
      width: 100%;
      flex-direction: column;
      gap: 4rem; } }

@media screen and (min-width: 751px) {
  #diz #point .set {
    width: 104rem; } }

@media screen and (min-width: 751px) {
  #milkdaizu #point .set {
    width: 96rem; } }

#point .set > div {
  position: relative;
  display: flex;
  flex-direction: column; }
  @media screen and (min-width: 751px) {
    #point .set > div {
      width: 53rem;
      padding-top: 10rem;
      gap: 4rem; } }
  @media screen and (max-width: 750px) {
    #point .set > div {
      width: 100%;
      padding-top: 11rem;
      gap: 9rem; } }

#diz #point .set > div {
  position: relative;
  display: flex;
  flex-direction: column; }
  @media screen and (min-width: 751px) {
    #diz #point .set > div {
      width: 70rem; } }

#milkdaizu #point .set > div {
  position: relative;
  display: flex;
  flex-direction: column; }
  @media screen and (min-width: 751px) {
    #milkdaizu #point .set > div {
      width: 53rem;
      margin-left: 3rem; } }

#point .set dl {
  position: relative; }
  @media screen and (min-width: 751px) {
    #point .set dl {
      padding-left: 6.5rem; } }
  @media screen and (max-width: 750px) {
    #point .set dl {
      padding-top: 11rem;
      text-align: center; } }

#point .set dt {
  position: relative;
  color: #000000;
  font-weight: 400;
  font-family: "IwaUDGoDspPro-Bd" !important;
  letter-spacing: 0.0em; }
  @media screen and (min-width: 751px) {
    #point .set dt {
      line-height: 1em;
      font-size: 3rem; } }
  @media screen and (max-width: 750px) {
    #point .set dt {
      line-height: 1.38em;
      font-size: 5.8rem; } }

#point .set dd {
  position: relative;
  font-weight: 400;
  color: #000000;
  letter-spacing: 0.0em; }
  @media screen and (min-width: 751px) {
    #point .set dd {
      line-height: 1.6em;
      font-size: 1.8rem;
      padding-top: 1.4rem; } }
  @media screen and (max-width: 750px) {
    #point .set dd {
      line-height: 1.6em;
      font-size: 3.2rem;
      padding-top: 2.8rem; } }

#point .set figure {
  position: relative; }
  @media screen and (min-width: 751px) {
    #point .set figure {
      width: 34.5rem;
      padding-top: 5rem; } }
  @media screen and (max-width: 750px) {
    #point .set figure {
      padding-top: 7rem;
      padding-right: 2.5rem; } }

#point .set figure p {
  position: relative;
  margin: 0 0 0 auto; }
  @media screen and (min-width: 751px) {
    #point .set figure p {
      width: 32rem;
      padding-top: 1rem; } }
  @media screen and (max-width: 750px) {
    #point .set figure p {
      width: 65rem;
      padding-top: 2rem;
      padding-left: 1rem; } }

@media screen and (min-width: 751px) {
  #milkdaizu #point .set dl.point1 {
    background: url("../../product/milkdaizu/img/01.png") 0 0 no-repeat;
    background-size: 4.1rem auto; } }
@media screen and (max-width: 750px) {
  #milkdaizu #point .set dl.point1 {
    background: url("../../product/milkdaizu/img/01.png") center top no-repeat;
    background-size: 8.2rem auto; } }

@media screen and (min-width: 751px) {
  #milkdaizu #point .set dl.point2 {
    background: url("../../product/milkdaizu/img/02.png") 0 0 no-repeat;
    background-size: 4.1rem auto; } }
@media screen and (max-width: 750px) {
  #milkdaizu #point .set dl.point2 {
    background: url("../../product/milkdaizu/img/02.png") center top no-repeat;
    background-size: 8.2rem auto; } }

@media screen and (min-width: 751px) {
  #milkdaizu #point .set dl.point3 {
    background: url("../../product/milkdaizu/img/03.png") 0 0 no-repeat;
    background-size: 4.1rem auto; } }
@media screen and (max-width: 750px) {
  #milkdaizu #point .set dl.point3 {
    background: url("../../product/milkdaizu/img/03.png") center top no-repeat;
    background-size: 8.2rem auto; } }

@media screen and (min-width: 751px) {
  #diz #point .set dl.point1 {
    background: url("../../product/diz/img/01.png") 0 0 no-repeat;
    background-size: 4.1rem auto; } }
@media screen and (max-width: 750px) {
  #diz #point .set dl.point1 {
    background: url("../../product/diz/img/01.png") center top no-repeat;
    background-size: 8.2rem auto; } }

@media screen and (min-width: 751px) {
  #diz #point .set dl.point2 {
    background: url("../../product/diz/img/02.png") 0 0 no-repeat;
    background-size: 4.1rem auto; } }
@media screen and (max-width: 750px) {
  #diz #point .set dl.point2 {
    background: url("../../product/diz/img/02.png") center top no-repeat;
    background-size: 8.2rem auto; } }

@media screen and (min-width: 751px) {
  #diz #point .set dl.point3 {
    background: url("../../product/diz/img/03.png") 0 0 no-repeat;
    background-size: 4.1rem auto; } }
@media screen and (max-width: 750px) {
  #diz #point .set dl.point3 {
    background: url("../../product/diz/img/03.png") center top no-repeat;
    background-size: 8.2rem auto; } }

.data {
  position: relative;
  margin: 0;
  width: 100%;
  overflow: hidden; }
  @media screen and (min-width: 751px) {
    .data {
      padding: 8rem 0 6rem; } }
  @media screen and (max-width: 750px) {
    .data {
      padding: 10rem 0 8rem; } }

#data_milkdaizu {
  background: rgba(255, 255, 255, 0.5); }

#data_tokunou {
  background: rgba(181, 151, 31, 0.1); }

.data h3 {
  position: relative;
  font-weight: 400;
  color: #000000;
  font-family: "IwaUDGoHonPro-Md" !important;
  letter-spacing: 0.05em;
  text-align: center;
  border-bottom: #aaa 1px solid; }
  @media screen and (min-width: 751px) {
    .data h3 {
      line-height: 1em;
      font-size: 3.4rem;
      width: 96rem;
      margin: 0 auto;
      padding: 0 0 2rem; } }
  @media screen and (max-width: 750px) {
    .data h3 {
      line-height: 1.536em;
      font-size: 5.6rem;
      padding: 0 0 3rem; } }

.data .set {
  position: relative;
  display: flex; }
  @media screen and (min-width: 751px) {
    .data .set {
      width: 108rem;
      padding-left: 4rem;
      margin: 0 auto;
      justify-content: space-between;
      align-items: flex-start; } }
  @media screen and (max-width: 750px) {
    .data .set {
      width: 100%;
      flex-direction: column;
      gap: 4rem; } }

.data .set > div {
  position: relative;
  display: flex;
  flex-direction: column; }
  @media screen and (min-width: 751px) {
    .data .set > div {
      width: 62.5rem;
      padding-top: 7rem;
      gap: 4rem; } }
  @media screen and (max-width: 750px) {
    .data .set > div {
      width: 100%;
      gap: 4rem; } }

.data .set dl {
  position: relative; }
  @media screen and (min-width: 751px) {
    .data .set dl {
      padding-left: 4rem; } }
  @media screen and (max-width: 750px) {
    .data .set dl {
      text-align: center;
      padding-top: 7rem;
      margin-top: 5rem; } }

.data .set dl::after {
  display: block;
  position: absolute;
  color: #000000;
  font-weight: 400;
  font-family: "IwaUDGoHonPro-Md" !important;
  letter-spacing: 0.05em; }
  @media screen and (min-width: 751px) {
    .data .set dl::after {
      top: 0;
      left: 0;
      line-height: 1.786em;
      font-size: 2.8rem;
      width: 4rem;
      height: 5rem; } }
  @media screen and (max-width: 750px) {
    .data .set dl::after {
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      line-height: 1em;
      font-size: 5.8rem;
      width: 5.8rem;
      height: 5.8rem;
      margin: 0 auto; } }

.data .set dl.data1::after {
  content: "1."; }

.data .set dl.data2::after {
  content: "2."; }

.data .set dl.data3::after {
  content: "3."; }

.data .set dt {
  position: relative;
  color: #000000;
  font-weight: 400;
  font-family: "IwaUDGoDspPro-Bd" !important;
  letter-spacing: 0.05em; }
  @media screen and (min-width: 751px) {
    .data .set dt {
      line-height: 1.786em;
      font-size: 2.8rem; } }
  @media screen and (max-width: 750px) {
    .data .set dt {
      line-height: 1.6em;
      font-size: 5.4rem; } }

.data .set dd {
  position: relative;
  font-weight: 400;
  color: #000000;
  letter-spacing: 0.0em; }
  @media screen and (min-width: 751px) {
    .data .set dd {
      line-height: 1.6em;
      font-size: 1.6rem;
      padding-top: 1rem; } }
  @media screen and (max-width: 750px) {
    .data .set dd {
      text-align: justify;
      line-height: 1.8em;
      font-size: 3rem;
      padding-top: 5rem; } }

@media screen and (max-width: 750px) {
  #diz .data .set dd {
    text-align: center !important;
    padding-top: 2rem !important; } }

.data .set figure {
  position: relative; }
  @media screen and (min-width: 751px) {
    .data .set figure {
      width: 33.8rem;
      padding-top: 5rem; } }
  @media screen and (max-width: 750px) {
    .data .set figure {
      width: 71rem;
      padding-top: 3.5rem; } }

#milkdaizu .data .set figure img {
  position: relative;
  display: block; }
  @media screen and (max-width: 750px) {
    #milkdaizu .data .set figure img {
      width: 66rem; } }

#data_tokunou .set figure img {
  position: relative;
  display: block; }
  @media screen and (max-width: 750px) {
    #data_tokunou .set figure img {
      width: 54rem; } }

#data_diz .set figure img {
  position: relative;
  display: block; }
  @media screen and (max-width: 750px) {
    #data_diz .set figure img {
      width: 58rem;
      margin: 0 auto; } }

.data .set figure p {
  position: relative;
  margin: 0 0 0 auto;
  text-align: center; }
  @media screen and (min-width: 751px) {
    .data .set figure p {
      width: 29rem;
      padding-top: 3rem; } }
  @media screen and (max-width: 750px) {
    .data .set figure p {
      padding-top: 4rem; } }

.detail_btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: .6s ease-out;
  overflow: hidden; }
  @media screen and (min-width: 751px) {
    .detail_btn {
      width: 22.5rem;
      height: 4.2rem;
      border-radius: 2.1rem;
      margin-top: -2rem;
      margin: 0; } }
  @media screen and (max-width: 750px) {
    .detail_btn {
      width: 44rem;
      height: 8.4rem;
      border-radius: 4.2rem;
      margin: 2rem auto 0; } }

.detail_btn p {
  position: relative;
  /*@include fw(Bold);*/
  font-weight: 400;
  font-family: "IwaUDGoHonPro-Md" !important;
  color: #FFFFFF;
  letter-spacing: 0.0em; }
  @media screen and (min-width: 751px) {
    .detail_btn p {
      line-height: 1em;
      font-size: 1.4rem;
      transition: .6s ease-out;
      transform: translateY(-0.2rem); } }
  @media screen and (max-width: 750px) {
    .detail_btn p {
      line-height: 1em;
      font-size: 2.8rem;
      transform: translateY(-0.2rem); } }

.detail_btn p::after {
  content: "";
  display: inline-block;
  position: relative;
  transition: ease-out .4s all;
  background: url("../../product/img/arrow.png") center center no-repeat;
  background-size: contain; }
  @media screen and (min-width: 751px) {
    .detail_btn p::after {
      width: 1.4rem;
      height: 1.4rem;
      transition: .6s ease-out;
      margin-left: 1.4rem;
      transform: translateY(0.2rem); } }
  @media screen and (max-width: 750px) {
    .detail_btn p::after {
      width: 2.8rem;
      height: 2.8rem;
      margin-left: 2.8rem;
      transform: translateY(0.2rem); } }

@media screen and (min-width: 751px) {
  .detail_btn::before {
    content: "";
    display: block;
    position: absolute;
    transition: ease-out .4s all;
    top: 50%;
    left: 0;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    opacity: 0; } }

@media screen and (min-width: 751px) {
  .detail_btn:hover::before {
    top: 0;
    opacity: 1; } }

@media screen and (min-width: 751px) {
  .detail_btn:hover p {
    color: #982235; } }

#milkdaizu #point h2 {
  color: #144a97; }

#milkdaizu .set span {
  color: #144a97;
  font-family: "IwaUDGoHonPro-Md" !important; }

span.cap {
  color: #000000 !important;
  font-family: "IwaUDGoHonPro-Th" !important; }

#milkdaizu .detail_btn {
  background: #144a97; }
  @media screen and (min-width: 751px) {
    #milkdaizu .detail_btn {
      border: #144a97 4px solid; } }

@media screen and (min-width: 751px) {
  #milkdaizu .detail_btn:hover p::after {
    background: url("../../product/img/arrow_hover_2.png") center center no-repeat;
    background-size: contain; } }

@media screen and (min-width: 751px) {
  #milkdaizu .detail_btn:hover p {
    color: #144a97; } }

.set strong {
  font-weight: 400;
  font-family: "IwaUDGoHonPro-Md" !important; }

#milkdaizu .data1 dd img {
  position: relative;
  height: auto; }
  @media screen and (min-width: 751px) {
    #milkdaizu .data1 dd img {
      width: 48.5rem !important; } }
  @media screen and (max-width: 750px) {
    #milkdaizu .data1 dd img {
      width: 71rem; } }

#milkdaizu .data2 dd img {
  display: block;
  height: auto; }
  @media screen and (min-width: 751px) {
    #milkdaizu .data2 dd img {
      position: absolute;
      top: 0;
      right: 8rem;
      width: 10rem !important; } }
  @media screen and (max-width: 750px) {
    #milkdaizu .data2 dd img {
      position: relative;
      width: 40rem !important;
      margin: 0 auto 4rem; } }

#diz .set span {
  color: #cc6600;
  font-family: "IwaUDGoHonPro-Md" !important; }

#diz .detail_btn {
  background: #982235; }
  @media screen and (min-width: 751px) {
    #diz .detail_btn {
      border: #982235 4px solid; } }

@media screen and (min-width: 751px) {
  #diz .detail_btn:hover p::after {
    background: url("../../product/img/arrow_hover_1.png") center center no-repeat;
    background-size: contain; } }

@media screen and (min-width: 751px) {
  #diz .detail_btn:hover p {
    color: #982235; } }

#data_tokunou .set figure p {
  position: relative;
  margin: 0 0 0 auto;
  text-align: center; }
  @media screen and (min-width: 751px) {
    #data_tokunou .set figure p {
      width: 20rem;
      padding-top: 3rem; } }
  @media screen and (max-width: 750px) {
    #data_tokunou .set figure p {
      padding-top: 4rem; } }

#product_nav {
  position: relative;
  margin: 0;
  width: 100%;
  overflow: hidden;
  background: rgba(181, 151, 31, 0.1); }
  @media screen and (min-width: 751px) {
    #product_nav {
      padding: 4rem 0 5rem; } }
  @media screen and (max-width: 750px) {
    #product_nav {
      padding: 7rem 0 7rem; } }

#product_nav h4 {
  position: relative;
  font-weight: 400;
  font-family: "IwaUDGoHonPro-Md" !important;
  color: #000000;
  letter-spacing: 0.15em;
  text-align: center; }
  @media screen and (min-width: 751px) {
    #product_nav h4 {
      line-height: 1em;
      font-size: 2.8rem;
      padding: 0 0 3rem; } }
  @media screen and (max-width: 750px) {
    #product_nav h4 {
      line-height: 1.6em;
      font-size: 4rem;
      padding: 0 0 4rem; } }

#product_nav nav {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin: 0 auto;
  transition: ease-out .6s all; }
  @media screen and (min-width: 751px) {
    #product_nav nav {
      width: 52.5rem; } }
  @media screen and (max-width: 750px) {
    #product_nav nav {
      width: 71rem; } }

#product_nav nav a {
  position: relative;
  display: block;
  text-align: center;
  transition: ease-out .6s all; }
  @media screen and (min-width: 751px) {
    #product_nav nav a {
      width: 25rem; } }
  @media screen and (max-width: 750px) {
    #product_nav nav a {
      width: 34rem; } }

@media screen and (min-width: 751px) {
  #product_nav nav a:hover {
    opacity: .7; } }

#product_nav nav a p {
  position: relative;
  font-weight: 400;
  color: #000000;
  letter-spacing: 0.0em;
  text-align: center; }
  @media screen and (min-width: 751px) {
    #product_nav nav a p {
      line-height: 1em;
      font-size: 1.4rem;
      padding: 1.4rem 0 0; } }
  @media screen and (max-width: 750px) {
    #product_nav nav a p {
      line-height: 1em;
      font-size: 2.4rem;
      padding: 2.4rem 0 0; } }

#diz .set dt span,
#milkdaizu .set dt span {
  font-family: "IwaUDGoDspPro-Bd" !important; }

.g {
  font-weight: 700 !important;
  font-family: "ＭＳ Ｐゴシック", "MS PGothic","Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体" !important; }
