/*****************************************
*                  index                 *
*****************************************/

.area {
  position: relative;
}

.section {
  position: relative;
}

#custom {
}

#standard {
}

#custom .section {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}

#custom .section .inner {
  height: 100%;
}

#standard .section {
  overflow: hidden;
}

#custom #cut-1 {
  height: 435px;
  /* background-image: url(../images/index/cut-1-bg.jpg); */
  /* background-image: url(../images/index/cut1-title.png); */
  background-repeat: no-repeat;
  overflow: visible;
  z-index: 1;
}

#cut-2 {
  height: 556px;
  /* background-image: url(../images/index/cut-2-bg.jpg); */
  background-repeat: no-repeat;
  position: relative;
}

#cut-3.section {
  /* height: 768px; */
  /* background-image: url(../images/index/cut-3-bg.jpg); */
  height: 634px;
  background-repeat: repeat-y;
  margin-top: 30px;
}

#cut-3.section .inner {
  width: 100%;
}

#cut-4 {
  height: 1124px;
  background-image: url(../images/index/cut-4-main.png?t=230907);
  background-repeat: no-repeat;
  image-rendering: -moz-crisp-edges;
  /* Firefox */
  image-rendering: -o-crisp-edges;
  /* Opera */
  image-rendering: -webkit-optimize-contrast;
  /*Webkit (non-standard naming) */
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor;
  /* IE (non-standard property) */
}

#cut-5 {
  height: 502px;
  background-image: url(../images/index/cut-5-bg.jpg);
  background-repeat: no-repeat;
}

#cut-6 {
  height: 745px;
  /* background-image: url(../images/index/cut-6-bg.jpg); */
  background-repeat: no-repeat;
}

#cut-6 .inner {
  position: relative;
}

#cut-1 .caption {
}

#cut-1 .title {
}

#cut-1 .text {
}

#cut-1 .btn-share {
  top: 15px;
  left: 25px;
  width: 55px;
  height: 55px;
  background: url(../images/index/btn-share.png) 0 0 no-repeat;
  background-size: contain;
}

#cut-2 .title {
}

#custom #cut-2.section .inner {
  width: 100%;
}

#cut-2 .text-up {
  width: 100%;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  color: #000;
  position: absolute;
  left: 3px;
  top: 144px;
}

#cut-2 .text-upper {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 800;
  line-height: 16px;
  color: #000;
  letter-spacing: 0.55px;
  position: absolute;
  top: 167px;
}

#cut-2 .text {
  top: 177px;
  width: 100%;
  height: 142px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  color: #000;
  transform: scale(0.78);
}

#cut-2 .text-lower {
  top: 485px;
  width: 100%;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  color: #000;
  letter-spacing: 1px;
}

/* #cut-2 .text img{
	width: 54.68%;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	image-rendering: auto;
  image-rendering: crisp-edges;
  image-rendering: -webkit-optimize-contrast;
	image-rendering: pixelated;
} */

/* #cut-2 .text > p {
	opacity: 0;
	color: #000;
	user-select: none;
	pointer-events: none;
} */

#cut-3 .title {
  width: 100%;
  height: 596px;
  background: url(../images/index/cut-3-main.png?t=230907) 0 0 no-repeat;
  background-size: contain;
  image-rendering: auto;
  image-rendering: crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  background-position: center top;
}

#cut-3 .text {
}

#cut-4 .title {
  height: 38px;
  /* background: #fff; */
  font-size: 28px;
  font-weight: 700;
  font-style: italic;
  line-height: 38px;
  text-align: center;
  opacity: 0;
  user-select: none;
  pointer-events: none;
}

#cut-4 .title.box1 {
  top: 45px;
  left: 85px;
  width: 205px;
}

#cut-4 .title.box2 {
  top: 88px;
  left: 19px;
  width: 336px;
}

/* #cut-4 .title.box1:before,
#cut-4 .title.box2:before,
#cut-4 .title.box1:after,
#cut-4 .title.box2:after {
	content: '';
	display: block;
	position: absolute;
	left: -4px;
	width: 5px;
	height: 38px;
	background: url(../images/index/cut-4-text-bg.png) no-repeat;
	background-size: 5px auto;
} */

/* #cut-4 .title.box1:after,
#cut-4 .title.box2:after {
	top: 0px;
	left: auto;
	right: -4px;
	background: url(../images/index/cut-4-text-bg.png) 0 -38px no-repeat;
	background-size: 5px auto;
} */

#cut-4 .text {
  top: 141px;
  height: 120px;
  width: 375px;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  font-style: italic;
  line-height: 20px;
  text-align: center;
  letter-spacing: -0.01em;
  opacity: 0;
  user-select: none;
  pointer-events: none;
}

#cut-5 .title {
  height: 38px;
  background: #fff;
  font-size: 28px;
  font-weight: 700;
  font-style: italic;
  line-height: 38px;
  text-align: center;
}

#cut-5 .title.box1 {
  top: 110px;
  left: 117px;
  width: 140px;
}

#cut-5 .title.box2 {
  top: 153px;
  left: 108px;
  width: 158px;
}

#cut-5 .title.box1:before,
#cut-5 .title.box2:before,
#cut-5 .title.box1:after,
#cut-5 .title.box2:after {
  content: "";
  display: block;
  position: absolute;
  left: -4px;
  width: 5px;
  height: 38px;
  background: url(../images/index/cut-4-text-bg.png) no-repeat;
  background-size: 5px auto;
}

#cut-5 .title.box1:after,
#cut-5 .title.box2:after {
  top: 0px;
  left: auto;
  right: -4px;
  background: url(../images/index/cut-4-text-bg.png) 0 -38px no-repeat;
  background-size: 5px auto;
}

#cut-5 .text {
  top: 206px;
  height: 60px;
  width: 375px;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  font-style: italic;
  line-height: 20px;
  text-align: center;
  letter-spacing: -0.01em;
}

#cut-6 .inner {
  width: 100%;
}

#cut-6 .title {
  /* top: 46px;
	left: 50%;
	transform: translateX(-50%);
	 */
  width: 211px;
  height: 34px;
  margin-left: auto;
  margin-right: auto;
  margin: 35px auto 50px auto;
  left: 50%;
  /*margin-left: -105px;*/
  background: url(../images/index/cut-6-title_2022.png) 0 0 no-repeat;
  background-size: contain;
  image-rendering: -moz-crisp-edges;
  /* Firefox */
  image-rendering: -o-crisp-edges;
  /* Opera */
  image-rendering: -webkit-optimize-contrast;
  /*Webkit (non-standard naming) */
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor;
  /* IE (non-standard property) */
}

#cut-6 .banner {
  left: 20px;
}

#cut-6 .banner img {
  display: block;
  width: 336px;
}

#cut-6 .banner a {
  display: block;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
}

#cut-6 .banner-1 {
  top: 118px;
}

#cut-6 .banner-2 {
  top: 319px;
}

#cut-6 .banner-3 {
  top: 519px;
}

#cut-6 .banner-3 a {
  width: 336px;
  height: 187px;
  background-image: url(../images/index/cut-6-banner-3.jpg);
}

#cut-6 .cut6-container {
}

#cut-6 .cut6-container a {
  display: block;
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

#cut-6 .cut6-container a:nth-of-type(2) {
  margin-top: 17px;
  margin-bottom: 17px;
}

#cut-6 .cut6-container a img {
  width: 100%;
}

#standard .section {
}

#standard .title,
#standard .content {
  position: absolute;
}

#standard .content {
  width: 100%;
}

#campaign {
  /*	height: 500px;*/
  padding-bottom: 6px;
  background-image: url(../images/index/cut-3-bg.jpg);
  background-size: 100% auto;
  background-repeat: repeat-y;
}

#campaign .title {
  left: 108px;
  width: 159px;
  height: 79px;
  background: url(../images/index/campaign-title.png) 0 0 no-repeat;
  background-size: contain;
}

#campaign .content {
  position: relative;
  padding-top: 90px;
}

#campaign ul {
  text-align: center;
}

#campaign li {
  width: 338px;
  height: 180px;
  margin: 0 auto 18px;
  background: #ffffff;
}

#campaign li a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  /*	background-color: #b3ae98;*/
  overflow: hidden;
}

#campaign li a img {
  display: block;
  width: 338px;
}

#campaign li a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: #00b3f8 6px solid;
  box-sizing: border-box;
}

#products {
  height: auto;
  padding-bottom: 25px;
  /* background-image: url(../images/index/cut-3-bg.jpg); */
  background-size: 100% auto;
  background-repeat: repeat-y;
}

#products:before {
  /*	position: absolute;
	top: 0;
	left: 0;
	width: 375px;
	height: 333px;
	background: url(../images/index/products-bg-top.jpg) center top;
	background-size: 375px 333px;
	content: '';*/
}

#products .title {
  left: 50%;
  transform: translateX(-50%);
  width: 144px;
  height: 30px;
  background: url(../images/index/products-title.png) 0 0 no-repeat;
  background-size: contain;
}

#products .content {
  position: relative;
  padding-top: 90px;
}

#products .related-content {
}

#products .related-content li {
  /*	border-color: #ffe55f;
	background: #ffe55f;*/
}

#products .related-content li a {
  /*	border-color: #ffe55f;
	background: #ffe55f;*/
}

#products .related-content li a {
  color: #fff;
  background: url(../images/index/products-item.jpg) 0 0 no-repeat;
  background-size: 144px 184px;
}

#products #related .related-content .btn-more {
  height: 50px;
  color: #fff;
  line-height: 50px;
  background-color: #cecece;
  /*	background: url(../images/index/products-more.jpg) 0 0 no-repeat;
	background-size: contain;*/
}

/*
#products .related-arrow {}
#products .related-arrow li {height: auto;}
#products .related-arrow li a {
	top: 79px;
	width: 57px;
	height: 60px;
	background-position: center center;
}
#products .related-arrow li.prev a {background-image: url(../images/index/arrow-prev.png); left: 13px;}
#products .related-arrow li.next a {background-image: url(../images/index/arrow-next.png); right: 13px;}
*/
#tvcm {
  height: 385px;
  background-image: url(../images/index/cut-3-bg.jpg);
  background-size: 100% auto;
  background-repeat: repeat-y;
}

#tvcm .title {
  left: 108px;
  width: 159px;
  height: 79px;
  background: url(../images/index/tvcm-title.png) 0 0 no-repeat;
  background-size: contain;
}

#tvcm .content {
  top: 90px;
}

/*
#tvcm li {}
#tvcm li a {}
#tvcm li a:after {
	top: 91px;
	left: 151px;
	background: url(../images/index/tvcm-play.png) 0 0 no-repeat;
	background-size: 55px 55px;
}
#tvcm .pic {}
#tvcm .pic:after {border-color: #d09d00;}

#tvcm .videos-content {
	height: 307px;
}
*/
#tvcm .slide {
}

#tvcm .slide-content {
}

#tvcm .slide-content a {
  /*width: 270px;*/
}

#tvcm .slide-content a:after {
  /*top: 44px; */
  background-image: url(../images/index/tvcm-play.png?v=1);
}

#tvcm .slide-content .pic {
  /*width: 270px; height: 144px; */
  background: #fff;
}

#tvcm .slide-content .pic:after {
  border-color: #00b3f8;
  border-width: 0px;
}

#tvcm .slide-content .pic img {
}

#tvcm .slide-content .vid {
  /*	width: 270px;
	height: 144px;*/
}

#tvcm .slide-content .name {
  color: #00b3f8;
}

#tvcm .slide-nav {
  /*height: 0; overflow: hidden; margin: 0;*/
}

#tvcm .slide-nav ul {
}

#tvcm .slide-nav li {
  background-color: #cecece;
}

#tvcm .slide-nav li.current {
  background-color: #00b3f8;
}

#tvcm .slide-arrow {
  display: none;
}

#tvcm .slide-arrow ul {
}

#tvcm .slide-arrow li {
}

#tvcm .slide-arrow li a {
  background-size: 14px 16px;
}

#tvcm .slide-arrow li.prev a {
  background-image: url(../images/index/arrow-prev.png);
}

#tvcm .slide-arrow li.next a {
  background-image: url(../images/index/arrow-next.png);
}

/*#knowledge {
	height: 209px;
	margin-top: -209px;
}

#knowledge .content {top: 0;}

#knowledge ul {text-align: center;}
#knowledge li {margin: 0 0 6px;}
#knowledge li a {
	position: relative;
	display: block;
	width: 336px;
	height: 88px;
	margin: 0 auto;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
#knowledge li a.item-1 {background-image: url(../images/index/knowledge-1.jpg);}
#knowledge li a.item-2 {background-image: url(../images/index/knowledge-2.jpg);}

#knowledge li a:after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	border: #cc935b 2px solid;
	box-sizing: border-box;
}*/

#shop {
  height: auto;
  padding-bottom: 34px;
  background-image: url(../images/index/cut-3-bg.jpg);
  background-size: 100% auto;
  background-repeat: repeat-y;
}

#shop .title {
  position: relative;
  margin-left: 97px;
  width: 180px;
  height: 79px;
  background: url(../images/index/shop-title.png) 0 0 no-repeat;
  background-size: contain;
}

#shop .content {
  position: relative;
  margin-top: 14px;
}

#shop ul {
  font-size: 0;
  text-align: center;
}

#shop li {
  display: inline-block;
  width: 165px;
  height: 88px;
  margin: 0 3px 6px;
  vertical-align: top;
}

#shop li a {
  display: table-cell;
  width: 165px;
  height: 88px;
  vertical-align: middle;
  /*background: #cece9e;*/
  background: url(../images/index/shop-item.jpg) 0 0 no-repeat;
  background-size: 165px 88px;
}

#shop li a:hover {
  opacity: 0.7;
}

#shop li a img {
  width: 100%;
  /*	margin: 0 0 0 -20px;*/
}

#social {
  padding: 25px 0;
  border: none;
  /*background: #2f4a23;*/
  overflow: visible;
  background: url(../images/index/social-bg.jpg) center top no-repeat;
  background-size: 375px 154px;
}

/*#standard #social:after {
	content: '';
	position: absolute;
	top: -15px;
	left: 0;
	width: 100%;
	height: 15px;
	background: url(../images/index/social-extra.png) center top no-repeat;
	background-size: 375px 15px;
}*/

#social .content {
  position: relative;
}

#social ul {
  font-size: 0;
  text-align: center;
}

#social li {
  display: inline-block;
  margin: 2.5px;
}

#social li a {
  display: block;
  width: 166px;
  height: 88px;
  /*background-image: url(../images/index/social-items.jpg);*/
  /*	background-color: #b3ae98;*/
  background-repeat: no-repeat;
  /*	background-size: 166px 88px;*/
  background-position: center center;
  background-size: contain;
}

/*#social li a.facebook {background-position: center center; background-size: 160px 85px;}
#social li a.instagram {background-position: center center; background-size: 164px 85px;}*/
/* ------------------------------------------- */
#hyoketsu-bg {
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  background-image: url("../images/hyoketsu-bg.png");
  position: absolute;
  left: 0;
  top: 0;
}

.cut1-title {
  width: 89.8666vw;
  max-width: 375px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}

#hyoketsu-bg2 {
  background-image: url(../images/hyoketsu-bg2.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 1;
  width: 89.73333%;
  /* width: 100.2%; */
  height: 2337px;
  max-width: 375px;
  background-position: center top;
  margin-left: auto;
  margin-right: auto;
}

.v1 #main {
  padding-bottom: 0;
}

#custom {
  padding-bottom: 100px;
}

#footer .top {
  color: #00105f;
  background: url("../images/index/footer-page-top.png") right center no-repeat;
  image-rendering: auto;
  image-rendering: -moz-crisp-edges;
  /* Firefox */
  image-rendering: -o-crisp-edges;
  /* Opera */
  image-rendering: -webkit-optimize-contrast;
  /*Webkit (non-standard naming) */
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor;
  background-size: contain;
}

.fixed-btn {
  position: fixed;
  bottom: 167px;
  right: 17px;
  z-index: 2;
  width: 65px;
}
.fixed-btn img {
  width: 100%;
}

.v2 .swiper-container {
  padding-right: 13.5px;
  padding-left: 13.5px;
}
#cut-6 {
  height: 550px;
}
#cut-6 .cut6-container a {
  width: 162px;
  height: 150px;
  margin-bottom: 13.5px;
}

.v2 .swiper-set .swiper-pagination .swiper-pagination-bullet {
  border-color: #fff;
}
.v2 .swiper-set .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}

#cut-6 {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 375px;
  margin-left: auto;
  margin-right: auto;
}

.cut6-container .card-md {
  height: 252px;
  margin: 0 auto;
}

.cut6-container .card .pic {
  height: 95px;
}

.cut6-container .card .info::after {
  right: 5px;
}

.cut6-container .card .info {
  font-size: 14px;
}

.cut6-container .card .info .text {
  height: 42px;
}