@charset "utf-8";

* {
	box-sizing: border-box;
}

img {
	height: auto;
}

.for_sp {
	display: none;
}
@media screen and (max-width: 767px) {
	.for_pc {
		display: none;
	}
	.for_sp {
		display: block;
	}
}

/*メインビジュアル*/
.mv-area {
	position: relative;
  padding: 4.685vw 40px 9.81vw;
  margin-bottom: -7.71vw;
  font-size: 0;
  text-align: center;
  background: url(../../images/hokkaido-milk/kv_bg_pc.png) 50% 0 / 100% auto no-repeat;
}
.mv-txt {
	position: relative;
  max-width: 1087px;
  margin: 0 auto;
  z-index: 1;
}
.mv-item {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

@media screen and (max-width: 767px) {
	.mv-area {
	  padding: 19.733vw 2vw 35.667vw 3.667vw;
	  margin-bottom: -16.667vw;
	  background-image: url(../../images/hokkaido-milk/kv_bg_sp.png);
	}
}

/*紹介*/
.sec-wrap.sec1 {
  position: relative;
  padding: 6.149vw 40px 13.177vw;
  margin-bottom: -8vw;
  background: url(../../images/hokkaido-milk/sec_bg01_pc.png) 50% 0 / 100% auto no-repeat;
  z-index: 1;
}
.sec-title.sec4_title {
  margin-bottom: 1.757vw;
}
.sec1_item {
  position: relative;
  max-width: 1016px;
  margin: 0 auto;
  text-align: left;
  z-index: 1;
}
.sec1_item img {
	max-width: 909px;
}
.decoration-item.item1 {
  position: absolute;
  top: 10%;
  left: -2%;
}
.decoration-item.item2 {
  position: absolute;
  right: 8%;
  bottom: 32%;
}
@media screen and (max-width: 767px) {
	.sec-wrap.sec1 {
	  padding: 17.867vw 4vw 33.333vw;
	  margin-bottom: -9vw;
	  background-image: url(../../images/hokkaido-milk/sec_bg01_sp.png);
	}
	.sec1_item {
  	padding: 0;
	}
	.decoration-item.item1 {
	  top: 5.533vw;
	  left: -3.5vw;
	  width: 30.667vw;
  	transform: rotate(-37deg);
	}
	.decoration-item.item2 {
  	right: 5.733vw;
    bottom: 25.267vw;
    width: 16.533vw;
    transform: rotate(35deg);
    z-index: 2;
	}
}

/*成分*/
.sec-wrap.sec2 {
	position: relative;
  padding: 10.615vw 40px 9.517vw;
  margin-bottom: -9vw;
  background: url(../../images/hokkaido-milk/sec_bg02_pc.png) 50% 0 /  100% 100% no-repeat;
  z-index: 1;
}
.sec-title {
  width: auto;
  height: 95px;
}
#ProductWrap .sec-title img {
  width: auto;
  height: 100%;
}
.sec2_item.item1 {
  max-width: 1106px;
  margin: 0 auto 4.1vw;
}
.sec2_item.item2 {
  max-width: 1072px;
  margin: 0 auto -1vw;
}
.sec2_item.item3 {
  max-width: 880px;
  margin: 0 auto 1vw;
}
.sec2_item.item4 {
  max-width: 902px;
  margin: 0 auto 6.735vw;
}
.sec2_item_other {
  max-width: 723px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
	.sec-wrap.sec2 {
	  padding: 23.067vw 1.333vw 26.267vw;
	  margin-bottom: -11.76vw;
	  background: url(../../images/hokkaido-milk/sec_bg02_sp.png) 50% 0 / 100% auto no-repeat;
	}
	.sec-title {
  	height: 24.533vw;
	}
	.sec-title.sec2_title {
  	margin-bottom: -3.2vw;
	}
	.sec2_item_list {
  	padding: 0 1.333vw;
	}
	.sec2_item.item1 {
  	margin-bottom: 24vw;
	}
	.sec2_item.item2 {
  	margin-bottom: 12.267vw;
	}
	.sec2_item.item3 {
  	margin-bottom: 20vw;
	}
	.sec2_item.item4 {
  	margin-bottom: 30.933vw;
	}
	.sec2_item_other {
  	padding: 0 1.733vw;
	}
}

/*手入れ方法*/
.sec-wrap.sec3 {
  position: relative;
  padding: 10.761vw 40px;
  margin-bottom: -11.34vw;
  background: url(../../images/hokkaido-milk/sec_bg03_pc.png) 50% 0 /  100% 100% no-repeat;
  z-index: 1;
}
.sec-title.sec3_title {
  margin-bottom: 2.489vw;
}
.sec3_item {
  max-width: 992px;
  margin: 0 auto 3.66vw;
}
.sec-flow-inner {
  max-width: 953px;
  margin: 0 auto;
  overflow-x: auto;
}
.flow-title {
  max-width: 240px;
  margin: 0 auto 2.635vw;
}
@media screen and (max-width: 767px) {
	.sec-wrap.sec3 {
  	padding: 28.667vw 0 29.333vw;
  	margin-bottom: -20.654vw;
  	background: url(../../images/hokkaido-milk/sec_bg03_sp.png) 50% 0 / 100% auto no-repeat;
	}
	.sec-title.sec3_title {
  	height: 19.733vw;
  	margin-bottom: 3.2vw;
	}
	.sec3_item {
  	margin-bottom: 13.067vw;
	}
	.flow-title {
  	max-width: 70vw;
  	margin-bottom: 16.667vw;
	}
	.sec-flow-inner {
  	padding: 0 22.667vw;
	}
	.sec-flow-inner img {
  	min-width: 953px;
	}
}

/*商品*/
.sec-wrap.sec4 {
  position: relative;
  padding: 10.615vw 40px 17.57vw;
  background: url(../../images/hokkaido-milk/sec_bg04_pc.png) 50% 0 / 100% 100% no-repeat;
  z-index: 1;
}
.product-item {
  display: flex;
  max-width: 860px;
  margin: 0 auto;
  gap: 0 40px;
  justify-content: space-between;
  align-items: center;
}
.product-name {
  max-width: 275px;
  margin: 0 auto 2.05vw;
}
.product-link {
  margin-bottom: 1.977vw;
}
.product-more {
  max-width: 75px;
  margin: 0 auto;
  cursor: pointer;
}

@media screen and (max-width: 767px) {
	.sec-wrap.sec4 {
	  padding: 25.067vw 1.333vw 43.733vw;
	  background-image: url(../../images/hokkaido-milk/sec_bg04_sp.png);
	}
	.sec-title.sec4_title {
  	height: 19.733vw;
  	margin-bottom: 3.2vw;
	}
	.product-item {
  	flex-wrap: wrap;
	}
	.product-img {
  	max-width: 79.733vw;
  	margin: 0 auto 8.8vw;
	}
	.product-info {
  	max-width: 65.333vw;
  	margin: 0 auto;
  	order: 1;
	}
	.product-name {
  	max-width: 100%;
  	margin-bottom: 8vw;
	}
	.product-link {
  	margin-bottom: 6.4vw;
	}
	.product-more {
  	max-width: 22.667vw;
	}
}

/*地域エリア*/
#ProductWrap .box_area {
  margin-top: -17.2vw;
}
@media screen and (max-width: 767px) {
	#ProductWrap .box_area {
  	margin-top: -11.2vw;
	}
}