@charset "utf-8";

@media screen and (min-width: 641px){.ns_SP{display: none!important;}}
@media screen and (max-width:1024px){
#wrapper {
min-width: auto;
overflow:hidden;
}
}

.ns_ContentsWrapAll {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  width: 100%;
  margin-top: -20px;
  font-size: 16px;
  color: #777;
  font-feature-settings: "palt";
  letter-spacing: 1.3px;
  line-height: 1.6;
}




#mainContent {
  padding: 0;
  margin-bottom: 0;
}
.ns_ContentsWrapAll a {
  text-decoration: none;
  transition: 0.3s;
  display: block;
}
.ns_ContentsWrapAll a img {
}
.ns_ContentsWrapAll a:hover img {
  opacity: 1;
}
.ns_ContentsWrapAll img {
  width: 100%;
  height: auto;
  display: block;
}
.ns_ContentsWrapAll a {
}
.ns_ContentsWrapAll a:before,
.ns_ContentsWrapAll a:after {
  position: absolute;
  content: "";
  display: block;
}

.ns_contentWrapper{
	padding: 0;
}




/*nav_start*/

@media screen and (max-height: 518px) {.ns_nav{overflow-y: scroll;}}	

.ns_nav {
  width: 250px;
  height: auto;
  padding: 35px 15px 60px;
  background: #777;
  position: fixed;
  top: 120px;
  right: -120%;
  z-index: 999;
  border-radius: 10px;
}
	
.ns_nav.panelactive {
    right: 10px;
}

.ns_nav_inner ul{width: 91%; margin: auto;}
.ns_nav_inner ul + ul{
	margin-top: 22px;
}
.ns_nav_inner li:nth-of-type(1){
	margin-bottom: 10px;
}
.ns_nav_inner li + li{
	margin-top: 4px;
}


.ns_nav_inner li .ns_nav_list {
  color: #fff;
  text-decoration: none;
  text-align: left;
  line-height: 1;
  font-weight: 800;
  transition: all .3s;
  display: inline-block;
  font-size: 16px;
}

.ns_nav_inner li:nth-of-type(1) .ns_nav_list {
	color: #d9f1ff;
	font-size: 40px!important;
}

.ns_nav_inner a:hover {
  opacity: 1;
  transform: translate(5px, 0)!important;
}


.ns_nav_inner ul li .ns_nav_list.is-active {
  color: #f0a992;
  transform: translateX(8px);
}


/*nav_end*/	

/*btn_start*/
.ns_openbtnWrap{
	/*position:fixed;*/
    display: none;
    z-index: 9999; /*ボタンを最前面に*/
    right: 10px;
    cursor: pointer;
    width: 70px;
    height: 70px;
}

.ns_openbtnWrap img{
	position: absolute;
	width: 51px;
	height: auto;
	top: -50px;
	left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.ns_openbtn {
	position: relative;
	width: 100%;
    height: 100%;
	border-radius: 14px;
    background-color: #777;
}
.ns_openbtnWrap.fixed {
    position: fixed;
    display: block;
	top: 120px !important;
}


/*×に変化*/
  .ns_openbtn span {
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 15px;
	width: 40px;
    height: 3px;
	border-radius: 100px;
    background-color: #fff;
  }
  .ns_openbtn span:nth-of-type(1) {
    top: 19px;
  }
  .ns_openbtn span:nth-of-type(2) {
    top: 27px;
  }
  .ns_openbtn span:nth-of-type(3) {
    top: 35px;
  }
	.ns_openbtn span:nth-of-type(4) {
    top: 40px;
	height: auto;
	background: none!important;
	font-size: 11px;
	text-align: center;
	color: #fff;
  }
  .ns_openbtnWrap.active span:nth-of-type(1) {
    top: 25px;
    left: 9px;
    transform: translateY(6px) rotate(-45deg);
    width: 60%;
  }
  .ns_openbtnWrap.active span:nth-of-type(2) {
    opacity: 0;
  }
  .ns_openbtnWrap.active span:nth-of-type(3) {
    top: 37px;
    left: 9px;
    transform: translateY(-6px) rotate(45deg);
    width: 60%;
  }
.ns_openbtnWrap.active span:nth-of-type(4){
	display: none;
}

.ns_openbtnWrap img{
	transition: .3s;
}
.ns_openbtnWrap.active img{
	transform: translateX(-198px);
	transition: .5s;
}


 .ns_overlay {
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    background:rgba(255,255,255,0.4);
    z-index: 190;
    opacity: 0;
    visibility: hidden;
    transition: all 200ms ease-in;
  }
  .ns_overlay.active {
    display: block;
    opacity: 1;
    visibility: visible;
  }

/*btn_end*/	



/*common_start*/

.ns_commonSize{width: 100%; max-width: 1700px; margin: auto;}

.ns_rooney{
	font-family: "rooney-sans", sans-serif!important;
	font-weight: 900!important;
	font-style: normal!important;
}



/*hover_start*/
.ns_ContentsWrapAll a,
.ns_ContentsWrapAll a img {
  transition: 0.3s;
  opacity: 1;
}
/*hover_end*/

/*breadcrumbs_start*/
.ns_breadWrap {margin:0; padding: 8px 12px; line-height: 1.2em; font-size: 14px; width: 100%; display: flex; color: #777; white-space: nowrap; background: #fff; position: relative;}
.ns_breadWrap li { display:inline-block; position: relative; font-weight: bold!important;}
.ns_breadWrap li:nth-of-type(n+2):before {
	position: absolute;
    content: "";
    display: block;
    top: 36%;
    left: 0.18em;
    width: 6px;
    height: 6px;
    border: 0 solid #777;
    border-width: 1px 1px 0 0;
    transform: rotate(45deg) translate(0, -25%);}
.ns_breadWrap li:last-child::after {content:none;}
.ns_breadWrap li:nth-of-type(n+2){padding-left: 20px;}
.ns_breadWrap a { color:#777; transition: .3s; text-decoration: none; font-weight: bold;}
.ns_breadWrap a:hover {color: #777; opacity: .5; text-decoration: none!important; transform: translateX(0);}
.ns_breadWrap span { margin-right:0.3em; }
/*breadcrumbs_end*/

/*top_start*/
.ns_header{position: relative;}


h1.ns_H1{
	position: relative;
	width: 100%;
	padding: 20px 45px 80px;
	margin: 0 auto;
	background: url(https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/mv_bg.jpg) no-repeat;
	background-size: cover;
}

.ns_mvImg{
	max-width: 980px;
	margin: auto;
}

.ns_mvImg img{
	width: 100%;
	height: auto;
}

.ns_mvImg .ns_PC{
	display: flex;
	justify-content: space-between;
	align-items: center;
}


.ns_anc{
	position: absolute;
	background: none;
	bottom: -40px;
	left: 50%;
	transform: translateX(-50%);
	max-width: 980px;
	width: calc(100% - 90px);
	font-size: 45px;
	display: flex;
	justify-content: space-between;
	margin: auto;
	z-index: 1;
}

.ns_anc li{
	width: calc((100% - (3vw*2))/2);
	height: 80px;
	display: grid;
	text-align: center;
}

.ns_anc li a{
	width: 100%;
	background: #87addc;
	border-radius: 100px;
	color: #fff;
	transition: .3s;
	position: relative;
}

.ns_anc li a:hover{
	transform: translateY(5px);
}

.ns_anc li a:after{
	position: absolute;
	right: 5%;
	top: 50%;
	transform: rotate(90deg) translate(-50%, 0);
	border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 8px 0 8px 14px;
	width: 0;
	height: 0;
}
/*top_end*/



.ns_limitedGoods{
	margin: auto;
	position: relative;
}

h2.ns_H2{
	border: none;
	text-align: center;
	line-height: 0;
	font-weight: 900;
	color: #87addc;
	font-size: clamp(8.75rem, 5.887rem + 4.47vw, 11.25rem);
	padding: 0 0 10px;
	margin: 0 auto;
	background: none;
	width: 100%;
	position: relative;
}




h3.ns_H3{
	position: absolute;
	top: clamp(-4.375rem, -2.364rem + -1.68vw, -3.438rem);
	left: 0;
	border: none;
	text-align: center;
	font-size: clamp(3.438rem, 1.648rem + 2.79vw, 5rem);
	padding: 0;
	margin: 20px auto 0;
	color: #777;
	background: none;
	line-height: 1.1;
}


.ns_sectionWrap{
	padding: clamp(13.75rem, 10.171rem + 5.59vw, 16.875rem) 0;
	margin: auto;
	margin-top: 0;
	background: rgba(255, 255, 255, 1);
	position: relative;
}

.ns_sectionWrap:nth-of-type(n+2){
	margin-top: -40px;
}

.ns_sectionWrap:nth-of-type(1){
	background: url(https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/bg.jpg) repeat;
}

.ns_sectionWrap:nth-of-type(2){
	background: url(https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/bg02.jpg) repeat;
}

.ns_sectionWrap:nth-of-type(3){
	background: url(https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/bg02.jpg) repeat;
	padding: 0px clamp(2.813rem, 1.023rem + 2.79vw, 4.375rem) 50px;
}
.ns_officialFlex{
	display: flex;
	justify-content: flex-end;
}

.ns_wave_top {
  --mask:
    radial-gradient(33.6px at 50% 47px, #777 99%, #777 101%) calc(50% - 40px) 0/80px 100%,
    radial-gradient(33.6px at 50% -27px, #777 99%, #777 101%) 50% 20px/80px 100% repeat-x;
  -webkit-mask: var(--mask);
  mask: var(--mask);

  @media (max-width: 1023px) {
    --mask:
      radial-gradient(30.24px at 50% 42.3px, #777 99%, #777 101%) calc(50% - 36px) 0/72px 100%,
      radial-gradient(30.24px at 50% -24.3px, #777 99%, #777 101%) 50% 18px/72px 100% repeat-x;

    @media (max-height: 500px) {
      --mask:
        radial-gradient(16.01px at 50% 22.5px, #777 99%, #777 101%) calc(50% - 20px) 0/40px 100%,
        radial-gradient(16.01px at 50% -12.5px, #777 99%, #777 101%) 50% 10px/40px 100% repeat-x;
    }
  }

  @media (max-width: 480px) {
    --mask:
      radial-gradient(16.01px at 50% 22.5px, #777 99%, #777 101%) calc(50% - 20px) 0/40px 100%,
      radial-gradient(16.01px at 50% -12.5px, #777 99%, #777 101%) 50% 10px/40px 100% repeat-x;
  }
}


.ns_sectionInner{
	padding: 0 clamp(2.813rem, 1.023rem + 2.79vw, 4.375rem);
	margin: auto;
	position: relative;
}

/*animation_start*/

.ns_footWrap{
	position: absolute;
	top: -88px;
	right: clamp(-1.25rem, -9.839rem + 13.41vw, 6.25rem);
	z-index: 2;
}

.ns_footstep{
  display: none;
  width: 116px;/*1フレーム分の横幅*/
  height: 132px;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/footanime01.png") no-repeat;
}

.ns_fadein .ns_footstep{
	display: block;
	animation: footstep01 1s steps(3) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：4コマ-1コマ=3コマ）
    forwards→最後の形を維持*/
}

@keyframes footstep01 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -348px 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅116pxで制作しているので全体の464px-116px=348px⇒-348px）を指定。*/
  }
}

.ns_steps{
  display: none;
  position: absolute;
  bottom: -107px;
  left: clamp(-1.25rem, -12.917rem + 18.21vw, 8.938rem);
  z-index: 1;
  width: 247px;/*1フレーム分の横幅*/
  height: 144px;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/muuanime01.png") no-repeat;
}
.ns_fadein .ns_steps{
	display: block;
	animation: stepsline 1.2s steps(4) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：5コマ-1コマ=4コマ）
    forwards→最後の形を維持*/
}

@keyframes stepsline {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -988px 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の1235px-247px=741px⇒-988px）を指定。*/
  }
}



.ns_muuWrap02 .ns_steps{
  display: none;
  position: absolute;
  bottom: clamp(-9.75rem, -3.314rem + -5.36vw, -6.75rem);
  left: clamp(-1.25rem, -12.917rem + 18.21vw, 8.938rem);
  z-index: 2;
  width: 243px;/*1フレーム分の横幅*/
  height: 220px;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/muuanime02.png") no-repeat;
}

.ns_muuWrap02.ns_fadein .ns_steps{
	display: block;
	animation: stepsline02 1.2s steps(4) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：5コマ-1コマ=4コマ）
    forwards→最後の形を維持*/
}

@keyframes stepsline02 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -972px 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の1235px-247px=741px⇒-988px）を指定。*/
  }
}



.ns_muuWrap{
	position: relative;
}
.ns_muu{
	display: none;
	position: absolute;
	right: 0;
	top: 0;
}

.ns_muuWrap02 .ns_muu{
	right: 0;
	top: unset;
	bottom: 0!important;
}

.ns_fadein .ns_muu{
	display: block;
	opacity: 0;
	animation: fadein 1.5s forwards 1.5s;
}



.ns_fadein .ns_muu .ns_fuwafuwa{
	transform:translate(0, 0) rotate(-2deg);
	animation: fuwafuwa 2.5s ease-in-out 2s infinite alternate;
}

@keyframes fuwafuwa{
  0% {
    transform:translate(0, 0) rotate(-2deg);
  }
  50% {
    transform:translate(0, -5px) rotate(3deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }	
}

.ns_muuWrap02.ns_fadein .ns_muu .ns_fuwafuwa{
	transform:translate(0, 0) rotate(0);
	animation: fuwafuwa02 3s ease-in-out 2s infinite alternate;
}

@keyframes fuwafuwa02{
  0% {
    transform:translate(0, 0);
  }
  50% {
    transform:translate(0, 10px) ;
  }
  100% {
    transform:translate(0, 0);
  }	
}


.ns_maru01{
	display: none;
	position: absolute;
	right: 77px;
	top: -112px;
	z-index: 2;
}


.ns_fadein.ns_maru01{
	display: block;
	opacity: 0;
	animation: fadein 2s forwards 3s;
}

.ns_fadein.ns_maru01 .ns_fuwafuwa{
	animation: fuwafuwa2 4s ease-in-out  .1s infinite alternate;
}

@keyframes fuwafuwa2{
  0% {
    transform:translate(20px, 5px) rotate(-2deg);
  }
  100% {
    transform:translate(-40px, 0) rotate(8deg);
  }
}


.ns_tuna{
	display: none;
	position: absolute;
	left: clamp(9.25rem, -8.358rem + 27.49vw, 24.625rem);
	bottom: -236px;
	z-index: 1;
}


.ns_fadein.ns_tuna{
	display: block;
	opacity: 0;
	animation: fadein 2s forwards 2s;
}
.ns_yurayura{
	transform: rotate(20deg);
}
.ns_fadein.ns_tuna .ns_yurayura{
	animation: yurayura 1.5s ease-in-out .1s infinite alternate;
}

@keyframes yurayura {
  0%{
      transform: rotate(10deg);
  }
  100%{
      transform:  rotate(-10deg);
  }
}

.ns_heartWrap{
  display: none;
  position: absolute;
  top: -117px;
  right: clamp(-1.563rem, -13.588rem + 18.77vw, 8.938rem);
  z-index: 2;
}

.ns_heartWrap.ns_fadein{
	display: block;
	opacity: 0;
	animation: fadein 2s forwards 2s;
}


@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.ns_heartstep{
  width: 220px;/*1フレーム分の横幅*/
  height: 155px;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/tunacananime.png") no-repeat;
  background-size: calc(100%*3);
}

.ns_fadein .ns_heartstep{
	display: block;
	animation: heartstep 1s steps(3) infinite;
	/*step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：3コマ-1コマ=2コマ)*/
}

@keyframes heartstep {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -660px 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の660px-220px=440px⇒-440px）を指定。*/
  }
}


.ns_maru02{
	display: none;
	position: absolute;
	right: 77px;
	bottom: -80px;
	z-index: 2;
}


.ns_fadein.ns_maru02{
	display: block;
	opacity: 0;
	animation: fadein 2s forwards 2s;
}

.ns_fadein.ns_maru02 .ns_pyoko{
	animation: pyoko 2s ease-in-out  .1s infinite alternate;
}

@keyframes pyoko{
  0% {
    transform:translate(20px, 0) rotate(-2deg);
  }
  100% {
    transform:translate(-40px, 0) rotate(8deg);
  }
}



/*animation_end*/
.ns_sliderWrap{position: relative; margin-top: clamp(9.375rem, 7.228rem + 3.35vw, 11.25rem);}


.ns_slideWrapper{
	border-radius: 30px;
	padding: 0 clamp(1.875rem, -2.491rem + 6.82vw, 5.688rem) 50px;
	background: url(https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/bg03.jpg) repeat;
	position: relative;
	z-index: 1;
	border: 4px solid #fff;
}

#ns_2023 .ns_slideWrapper{
	background: url(https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/bg.jpg) repeat;
}

.ns_slider{
	width: 100%;
	margin: 0 auto;
}

.ns_slider li{
	/*width: 350px;*/
	margin: 80px clamp(1.375rem, 0.802rem + 0.89vw, 1.875rem) 0 0;
	text-align: center;
}

.slider .slick-slide {
    margin: 80px 35px 0 0;
}

.ns_slider .ns_goodsImg{
	display: block;
	width: 100%;
	border: 2px solid #777;
	border-radius: clamp(1.5rem, 1.071rem + 0.67vw, 1.875rem);
	position: relative;
	overflow: hidden;
	background: #fff;
}

.ns_slider .ns_goods_link:hover .ns_goodsImg img{
	transform: scale(1.1) rotate(13deg);
}

.ns_slider li a img{width: 100%; padding: clamp(0.938rem, -0.136rem + 1.68vw, 1.875rem);}
#ns_goods01 .ns_slider li a img{padding: 0;}

.ns_slider .ns_goodsImg::after{
	position: absolute;
    width: 100%;
    height: 100%;
    border-radius: clamp(1.25rem, 0.821rem + 0.67vw, 1.625rem);
    top: 0;
    left: 0;
	transition: .3s;
}



.ns_slideWrapper .slick-initialized .slick-slide{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/*矢印の設定_start*/

/*戻る、次へ矢印の位置*/


.slick-prev, 
.slick-next {
	display: none!important;
}
.ns_slideWrapper .slick-prev, 
.ns_slideWrapper .slick-next {
	display: inline-block!important;
    bottom: -9px;
    cursor: pointer;
    outline: none;
	border-style: solid;
    border-width: 8px 0 8px 12px;
    border-color: transparent transparent transparent #777;
    height: 0;
    width: 0;
    z-index: 10;
	position: absolute;
}

.ns_slideWrapper .slick-prev {/*戻る矢印の位置と形状*/
    left: clamp(20.313rem, -1.877rem + 34.64vw, 39.688rem);
	transform: rotate(180deg) translate(0, 50%);
}

.ns_slideWrapper .slick-next {/*次へ矢印の位置と形状*/
    right: clamp(20.313rem, -1.877rem + 34.64vw, 39.688rem);
	transform: rotate(0deg) translate(0, -50%);
}

/*矢印の設定_end*/

/*ドットナビゲーションの設定*/

.slick-dots {
    display: flex;
	justify-content: center;
	margin:30px auto 0;
}

.slick-dots li {
    display:inline-block;
	margin:0 10px;
	width: 13px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:13px;/*ドットボタンのサイズ*/
    height:13px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#fff;/*ドットボタンの色*/
	border: 2px solid #777;
	cursor: pointer;
}

.slick-dots .slick-active button{
    background:#777;/*ドットボタンの現在地表示の色*/
}


/*soldout_start*/

/* 対象の商品のliにns_soldoutクラスを付けて管理 */
.ns_soldout{
	position: relative;
}

.ns_soldout:before{
	position: absolute;
	display: block;
	content: '';
	background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/soldout.png") no-repeat;
	background-size: 100%;
	width: clamp(4.688rem, 2.97rem + 2.68vw, 6.188rem);
	height: 99px;
	right: -18px;
	top: -25px;
	z-index: 1;
}
.ns_soldout .ns_goodsImg::after{
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.3);
}

.ns_soldout .ns_goods_link:hover .ns_goodsImg::after{
	background: rgba(0, 0, 0, 0.3)!important;
}


/*soldout_end*/


.ns_itemtx{
	display: block;
	color: #777!important;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 700;
	margin-top: 18px;
}


/*official_bn*/
.ns_officialWrap{
	width: 470px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.ns_officialWrap .ns_btn{
    border-radius: 60px;
    border: 3px solid #777;
    font-size: 25px !important;
    width: 310px;
	padding: 0;
    display: grid;
    text-align: center;
    color: #777;
	align-items: center;
}

.ns_officialWrap a:hover{
	transform: translateY(5px);
}

/*contents_end*/



/*------------------- 1024px~641px -------------------*/

@media screen and (max-width: 1024px) {
	h1.ns_H1{padding: 0;}
	h2.ns_H2{width: 100%; font-size: clamp(5.375rem, 1.819rem + 8.88vw, 7.5rem);}
	h3.ns_H3{font-size: clamp(2.375rem, 0.597rem + 4.44vw, 3.438rem); top: clamp(-3.438rem, -1.432rem + -3.13vw, -2.688rem);}
	
	.ns_mvImg{max-width: 100%;}
	
	.ns_anc{bottom: -100px; width: calc(100% - 8vw); font-size: clamp(2.313rem, 1.476rem + 2.09vw, 2.813rem);}
	.ns_anc li{width: calc((100% - (2vw*2))/2); height: clamp(3.938rem, 2.159rem + 4.44vw, 5rem);}
	
	
	.ns_limitedGoods{width: 100%; margin: auto; }
	.ns_sectionWrap{padding: 23vw 4vw;}
	.ns_sectionWrap:nth-of-type(1){padding-top: clamp(13.75rem, 9.043rem + 11.75vw, 16.563rem);}
	.ns_sectionWrap:nth-of-type(n+2){padding-bottom: 18vw;}
	.ns_sectionWrap:nth-of-type(3){padding: 0 4vw 5vw; justify-content: center;}
	.ns_sectionInner{padding: 0;}
	
	.ns_slideWrapper{padding: 0 clamp(1.375rem, 0.538rem + 2.09vw, 1.875rem) clamp(1.875rem, -0.217rem + 5.22vw, 3.125rem);}
	.ns_sliderWrap{margin-top: clamp(5rem, -2.322rem + 18.28vw, 9.375rem);}
	.ns_slider li{margin: clamp(2.813rem, -0.849rem + 9.14vw, 5rem) clamp(0.938rem, 0.205rem + 1.83vw, 1.375rem) 0 0;}
	.slick-dots{margin: clamp(-3.188rem, 0.322rem + -5.48vw, -1.875rem) auto 0;}
	.ns_slideWrapper .slick-next{right: clamp(10.438rem, -8.286rem + 46.74vw, 21.625rem);}
	.ns_slideWrapper .slick-prev{left: clamp(9.25rem, -9.055rem + 45.69vw, 20.188rem);}
	
	.ns_itemtx{font-size: clamp(0.813rem, 0.499rem + 0.78vw, 1rem); margin-top: 1.5vw;}
	.ns_soldout:before{width: clamp(3.875rem, 2.515rem + 3.39vw, 4.688rem); right: -12px; top: -12px;}
	
/*animation*/
	
.ns_footWrap{top: clamp(-3.938rem, -0.094rem + -6.01vw, -2.5rem); right: clamp(-0.375rem, -2.572rem + 5.48vw, 0.938rem);}
	
.ns_footstep{
  display: none;
  width: 10vw;/*1フレーム分の横幅*/
  height: 12vw;/*1フレーム分の縦幅*/
  background-size: 40vw;
}

.ns_fadein .ns_footstep{
	display: block;
	animation: footstep01 1s steps(3) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：4コマ-1コマ=3コマ）
    forwards→最後の形を維持*/
}

@keyframes footstep01 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -30vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅116pxで制作しているので全体の464px-116px=348px⇒-348px）を指定。*/
  }
}

.ns_steps{
  display: none;
  position: absolute;
  bottom: clamp(-5.313rem, 1.873rem + -11.23vw, -2.625rem);
  left: clamp(-0.313rem, -3.346rem + 7.57vw, 1.5rem);
  z-index: 2;
  width: 20vw;/*1フレーム分の横幅*/
  height: 12vw;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/muuanime01.png") no-repeat;
	background-size: 100vw;
}
.ns_fadein .ns_steps{
	display: block;
	animation: stepsline 1.2s steps(4) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：5コマ-1コマ=4コマ）
    forwards→最後の形を維持*/
}

@keyframes stepsline {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -80vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の1235px-247px=741px⇒-988px）を指定。*/
  }
}



.ns_muuWrap02 .ns_steps{
  display: none;
  position: absolute;
  bottom: clamp(-4.75rem, 1.099rem + -9.14vw, -2.563rem);
  left: clamp(2.188rem, 0.723rem + 3.66vw, 3.063rem);
  z-index: 2;
  width: 20vw;/*1フレーム分の横幅*/
  height: 12vw;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/muuanime02.png") no-repeat;
  background-size: 100vw;
}

.ns_muuWrap02.ns_fadein .ns_steps{
	display: block;
	animation: stepsline02 1.2s steps(4) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：5コマ-1コマ=4コマ）
    forwards→最後の形を維持*/
}

@keyframes stepsline02 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -80vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の1235px-247px=741px⇒-988px）を指定。*/
  }
}

.ns_muu{
	display: none;
	position: absolute;
	right: 0;
	top: 0;
	width: 12vw;
}

	
	
.ns_maru01{width: 13vw; top: clamp(-7rem, -0.149rem + -10.7vw, -4.438rem); right: clamp(2.188rem, -2.206rem + 10.97vw, 4.813rem);}
.ns_maru02{width: 13vw; bottom: clamp(-5rem, 2.52rem + -11.75vw, -2.188rem); right: clamp(2.813rem, -0.535rem + 8.36vw, 4.813rem);}
.ns_tuna{width: 7vw; bottom: clamp(-12.313rem, -0.95rem + -17.75vw, -8.063rem);}
	
.ns_heartWrap{right: clamp(0.25rem, -1.947rem + 5.48vw, 1.563rem); top: clamp(-7.313rem, 1.21rem + -13.32vw, -4.125rem);}	
.ns_heartstep{
  width: 20vw;/*1フレーム分の横幅*/
  height: 14vw;/*1フレーム分の縦幅*/
  background-size: 60vw;
}

.ns_fadein .ns_heartstep{
	display: block;
	animation: heartstep 1s steps(3) infinite;
	/*step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：3コマ-1コマ=2コマ)*/
}
	
@keyframes heartstep {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -60vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の660px-220px=440px⇒-440px）を指定。*/
  }
}
	
/*animation*/


}




/*------------------- mobile -------------------*/

@media screen and (max-width: 640px) {
  .ns_commonSize{width: 100%}
  .ns_ContentsWrapAll {
    overflow: hidden;
    box-sizing: border-box;
    margin-top: -25px;
    -webkit-text-size-adjust: 100%;
    font-size: clamp(14px, 3.5vw, 16px);
  }
body{background: none;}
.ns_PC{display: none!important;}
/*SP_contents_start*/
	

/*breadcrumbs_start*/
.ns_breadWrap {padding: 7px 7px 6px; line-height: 1.3em; font-size: 12px; white-space: nowrap;}
.ns_breadWrap li { display:inline-block;}
.ns_breadWrap li:last-child::after {content:none;}
.ns_breadWrap a {transition: .3s; text-decoration: none;}
.ns_breadWrap span { margin-right:0.3em; }
/*breadcrumbs_end*/

	
/*SP_top_start*/
	
h1.ns_H1{
	padding: 0;
	background: none;
	margin: 0 auto;
}
	
/*SP_top_end*/
	
/*SP_navi_start*/
.ns_openbtnWrap.fixed,.ns_nav{top: 100px!important;}
	
.ns_openbtnWrap{
    width: 55px;
    height: 55px;
}

.ns_openbtnWrap img{
	width: 41px;
	height: auto;
	top: -40px;
    z-index: 2;
}

.ns_openbtn {
	border-radius: 12px;
}



/*×に変化*/
  .ns_openbtn span {
    left: 12px;
	width: 31px;
  }
  .ns_openbtn span:nth-of-type(1) {
    top: 13px;
  }
  .ns_openbtn span:nth-of-type(2) {
    top: 20px;
  }
  .ns_openbtn span:nth-of-type(3) {
    top: 27px;
  }
  .ns_openbtn span:nth-of-type(4) {
	width: 100%;
    left: 0;
    top: 32px;
	height: auto;
	font-size: 10px;
	font-weight: 600;
	text-align: center;
	color: #fff;
  }
  .ns_openbtnWrap.active span:nth-of-type(1) {
    top: 17px;
    left: 12px;
  }
  .ns_openbtnWrap.active span:nth-of-type(3) {
    top: 29px;
    left: 12px;
  }

/*SP_navi_end*/	
	
	
/*SP_common_start*/	
h2.ns_H2{
	width: 100%;
	font-size: clamp(3.438rem, 0.625rem + 14.06vw, 6.25rem);
}
h3.ns_H3{font-size: clamp(1.875rem, 0.625rem + 6.25vw, 3.125rem); margin: 0 auto 2vw; line-height: 1; position: relative; top: 0;}	

.ns_anc{font-size: clamp(1.75rem, 1.25rem + 2.5vw, 2.25rem); bottom: clamp(-5.313rem, -2.688rem + -6.56vw, -4rem);}
.ns_anc li{width: calc((100% - (1.5vw*2))/2); height: clamp(3.125rem, 2.313rem + 4.06vw, 3.938rem);}
.ns_anc li a:after{border-width: 1.5vw 0 1.5vw 2.5vw; right: 7%;}
/*SP_common_end*/
	

/*SP_goods_start*/
.ns_limitedGoods{padding: 0;}
.ns_sectionWrap{padding: 35vw 0; width: 100%;}
.ns_sectionWrap:nth-of-type(1){padding-top: clamp(8.75rem, 3.75rem + 25vw, 13.75rem);}
.ns_sectionWrap:nth-of-type(n+2){margin-top: -5vw; padding-bottom: 14vw;}
.ns_sectionWrap:nth-of-type(2) .ns_goodsWrap{padding: 6vw 0 0!important;}
.ns_sectionWrap:nth-of-type(2) .ns_goodsWrap .ns_goodsImg{margin-bottom: 7vw;}
.ns_sectionWrap:nth-of-type(3){position: relative; padding-bottom: 18vw;}
	
	
/*SP_slider*/
.ns_sliderWrap{margin-top: 30vw;}
.ns_sliderWrap:nth-of-type(1){margin-top: 11vw;}
.ns_slideWrapper{padding: 5vw 0 7vw 2vw; border:none; border-radius: 0;}	

.ns_slider {
    width:100%;
    margin:0 auto;
}

.ns_slider .ns_goodsImg{border: 2.5px solid #777;}
	
.ns_slider li{margin: 12px 2vw 0 0;}
	
.slick-dots li {
    margin: 12vw 1.2vw 0;
}
.slick-dots button{width: 10px; height: 10px;}
/*SP_slider_end*/

.ns_itemtx{font-size: clamp(10px,4vw,16px);}
	
.ns_soldout:before{
	position: absolute;
	display: block;
	content: '';
	background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/sp/special/000000tsunakeito27/soldout_sp.png") no-repeat;
	background-size: 100%;
	width: clamp(3.438rem, 2.813rem + 3.13vw, 4.063rem);
	height: 99px;
	right: -6px;
	top: -8px;
	z-index: 1;
}

/*SP_goods_end*/
	
	
/*animation*/
	
.ns_footWrap{top: clamp(-8.438rem, -0.313rem + -20.31vw, -4.375rem); right: 2%;}
	
.ns_footstep{
  display: none;
  width: 15vw;/*1フレーム分の横幅*/
  height: 18vw;/*1フレーム分の縦幅*/
  background-size: 60vw;
}

.ns_fadein .ns_footstep{
	display: block;
	animation: footstep01 1s steps(3) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：4コマ-1コマ=3コマ）
    forwards→最後の形を維持*/
}

@keyframes footstep01 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -45vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅116pxで制作しているので全体の464px-116px=348px⇒-348px）を指定。*/
  }
}

.ns_steps{
  display: none;
  position: absolute;
  bottom: clamp(-14.125rem, 3.125rem + -43.13vw, -5.5rem);
  left: 4%;
  z-index: 2;
  width: 30vw;/*1フレーム分の横幅*/
  height: 30vw;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/muuanime01.png") no-repeat;
	background-size: 150vw;
}
.ns_fadein .ns_steps{
	display: block;
	animation: stepsline 1.2s steps(4) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：5コマ-1コマ=4コマ）
    forwards→最後の形を維持*/
}

@keyframes stepsline {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -120vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の1235px-247px=741px⇒-988px）を指定。*/
  }
}



.ns_muuWrap02 .ns_steps{
  display: none;
  position: absolute;
  bottom: clamp(-9.125rem, -22.81vw, -4.563rem);
  left: 4%;
  z-index: 2;
  width: 30vw;/*1フレーム分の横幅*/
  height: 30vw;/*1フレーム分の縦幅*/
  background: url("https://7net-img.omni7.jp/cm/0001/sc_image/inc/pc/special/000000tsunakeito27/muuanime02.png") no-repeat;
  background-size: 150vw;
}

.ns_muuWrap02.ns_fadein .ns_steps{
	display: block;
	animation: stepsline02 1.2s steps(4) forwards;
	/*2s→アニメーションをする時間
    step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：5コマ-1コマ=4コマ）
    forwards→最後の形を維持*/
}

@keyframes stepsline02 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -120vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の1235px-247px=741px⇒-988px）を指定。*/
  }
}

.ns_muu{
	display: none;
	position: absolute;
	right: 0;
	top: 0;
	width: 18vw;
}

	
	
.ns_maru01{width: 18vw; top: clamp(-7rem, -0.149rem + -10.7vw, -4.438rem); right: clamp(2.188rem, -2.206rem + 10.97vw, 4.813rem);}
.ns_fadein.ns_maru01 .ns_fuwafuwa{
	animation: fuwafuwa2 4s ease-in-out  .1s infinite alternate;
}

@keyframes fuwafuwa2{
  0% {
    transform:translate(10px, 5px) rotate(-2deg);
  }
  100% {
    transform:translate(-10px, 0) rotate(8deg);
  }
}
	
	
.ns_maru02{width: 16vw; bottom: 3vw; right: 7%;}
.ns_tuna{width: 14vw; bottom: -39vw; left: 28%;}
	
.ns_heartWrap{left: 3%; top: 98%;}	
.ns_heartstep{
  width: 34vw;/*1フレーム分の横幅*/
  height: 34vw;/*1フレーム分の縦幅*/
  background-size: 102vw;
}

.ns_fadein .ns_heartstep{
	display: block;
	animation: heartstep 1s steps(3) infinite;
	/*step→（）の中には、アニメーション制作コマ数-1の値を入れる（例：3コマ-1コマ=2コマ)*/
}
	
@keyframes heartstep {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -102vw 0;/*アニメーション制作コマ数から1コマ分引いた横幅を指定。
（例：今回は1フレーム横幅247pxで制作しているので全体の660px-220px=440px⇒-440px）を指定。*/
  }
}
	
/*animation*/
	
	
/*official*/
.ns_officialWrap{width: 100vw;}
.ns_officialFlex{justify-content: center;}
.ns_officialWrap a:nth-of-type(1),.ns_officialWrap a:nth-of-type(2){width: 12vw;}
.ns_officialWrap a:nth-of-type(n+2){margin-left: 3vw;}
.ns_officialWrap .ns_btn{width: 100%; font-size: clamp(1rem, 5vw, 2rem)!important;  border: 2.5px solid #777;}
/*official*/

.ns_areaBottom {
  padding: 5px 0 ;
  text-align: center;
  font-size: 9px;
  color: #fff;
  position: relative;
}	
	
	
/*hover_start*/
  .ns_ContentsWrapAll a:hover{
    transform: translate(0px, 0px);
  }
  .ns_ContentsWrapAll .ns_anc a:hover {
    transform: translate(0px, 0px);
    transition: 0.3s;
  }
  a.is-tap{text-decoration: none!important; color: #fff;}
  /*hover_end*/
  .ns_copy {
    font-size: 10px;
    padding: 30vw 0 2vw;
  }
  /*SP_contents_end*/
}