@charset "UTF-8";


.toplogo_sp {
  margin-top: 20px;
  margin-left: 20px;
  width: 300px;
}


@media screen and (min-width:320px) and (max-width:1050px) {
  #trigger1 {
    position: absolute;
    margin-top: -0%;
  }
}





.yellowtag {
	display: inline-block;
	padding: .8em 1.6em .4em 1.8em;
	position: fixed;
	color: #fff;
	left:0;

	bottom:0;
	width: 480px;
	z-index: 180;

}

.yellowtag::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: rgba(251,196,0,0.9);
	transform: scaleY(1.3) perspective(.6em) rotateX(1deg);
	transform-origin: bottom left;
}

.yellowtag_u{
	display: inline-block;
	padding: .8em 1.6em .4em 1.8em;
	position: fixed;
	color: #fff;
	left:0;

	bottom:33px;
	width: 480px;
	z-index: 161;

}

.yellowtag_u::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: rgba(251,196,0,0.9);
	transform: scaleY(1.3) perspective(.6em) rotateX(1deg);
	transform-origin: bottom left;
}


.textarea_yellow {
font-family: 'Oswald', sans-serif;
color:#000;
	margin-bottom: 0;
	font-size: 1.2rem;

}
.yellowlist1::before {
	content: url(https://www.snk-corp.co.jp/official/kof-portal/img/common/ft_tw.svg);
  display: inline-block;
  vertical-align: middle;
  transform: scale(1);
	margin-right: 0.4em;
}
.yellowlist2::before {
	content: url(https://www.snk-corp.co.jp/official/kof-portal/img/common/ft_fb.svg);
  display: inline-block;
  vertical-align: middle;
  transform: scale(1);
	margin-right: 0.4em;
}
.yellowlist3::before {
	content: url(https://www.snk-corp.co.jp/official/kof-portal/img/common/ft_insta.svg);
  display: inline-block;
  vertical-align: middle;
  transform: scale(1);
	margin-right: 0.4em;
}

.yellowsnslist {
	position: relative;

}
.yellowsnslist a:link {
	color:#000;
}
.yellowsnslist a:visited {
	color:#000;
}
.yellowsnslist a:hover {
	color:#000;
	text-decoration: none;
}


.yellow_snk {
	position: relative;
	float: left;
	margin-top: 15px;
}
.yellow_sesp {
	float: left;
	margin-left: 25px;
	margin-top: -2px;
	margin-right: 30px;
}

@media screen and (min-width:320px) and (max-width:1050px)  {
  
	.textarea_yellow {
font-family: 'Oswald', sans-serif;
color:#fff;
	margin-bottom: 0;
	font-size: 3vw;
		margin-top: 2%;

}

	.yellowtag {
	display: inline-block;
	padding: .8em 1.6em .4em 1.8em;
	position: fixed;
	color: #fff;
	left:0;
	bottom:-1px;
	width: 100%;
	z-index: 180;
		border-top:1px solid #fff;

}


.yellowtag::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: rgba(0,0,0,0.8);
	transform: none;
	transform-origin: none;
}
	
	.yellowsnslist {
	position: relative;
		margin-top: 1%;
		width: 100%;
		text-align: center;
      margin-bottom: 0;

}
	.yellowsnslist li {
		float: left;
		width: 50%;
		margin-right: 0%;
      padding-bottom:2%;
      margin-bottom: 2%;
      border-bottom:1px solid #fff;
	}
	.yellowsnslist li:last-child {
      margin-left:25%;
      border-bottom:transparent ;
      margin-bottom: 0;
  }
	
	.yellowsnslist a:link {
	color:#fff;
}
.yellowsnslist a:visited {
	color:#fff;
}
.yellowsnslist a:hover {
	color:#fff;
	text-decoration: none;
}
	
	.yellow_snk {
	position: relative;
	float: left;
	margin-top:4%;
		width: 30%;
}
	
	.yellow_sesp {
	float: left;
		width: 20%;
	margin-left: 3%;
	margin-top: 1%;
	margin-right: 3%;
}
  
  
/*メニューボタン　展開前*/
.menu-btn {
  display : block;
  position: fixed;
  right : 30px;
  top   : 10px;
  width : 8%;
  cursor: pointer;
  text-align: center;
	background-color: transparent!important;
	z-index: 5560!important;
}
  
   .toplogo_sp {
    position: relative;
  margin-top: 20px;
  margin-left: 20px;
  width: 300px;
  z-index: 8000!important;
}

}




#c-modal_bg {
    position: fixed;
    top: 0;
    left: 0;
		z-index: 11000!important	;	
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: rgba(246, 188,0, 0.9);
}
#c-modal {
    position: absolute;
    z-index: 10;

}

#c-modal_close {
cursor: pointer;

}


.top_info_box_e {
	position: absolute;
	width: 100%;
	height:100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;

}

.top_infowrp_e {
position: relative;
	margin-top: 0px;
	margin-left: 0;
	width: 50vw;
	height: 65vh;
	text-align: center;
	z-index: 11000!important	;	
}



@media screen and (min-width:320px) and (max-width:1050px) {
  #c-modal_close {
    padding: 0px;
    cursor: pointer;
  width: 100%;
  margin: 0% auto;
}
	.top_info_box_e {
		position: absolute;
	width: 100vw;
	height:100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;

	}

.top_infowrp_e {
position: relative;
	margin-top: 0px;
	margin-left: 0;
	width: 70vw;
	height: 69vh;
	text-align: center;

}

}

@media screen and (min-width:720px) and (max-width:1050px) {
  .top_infowrp_e {
position: relative;
	margin-top: 0px;
	margin-left: 0;
	width: 50vw;
	height: 69vh;
	text-align: center;

}
}


.modal_btnlist {
  position: relative;
  margin-top: 3%;
  width: 100%;
}
.modal_btnlist li {
float: left;
  width: 47.5%;
  margin-right: 5%;
}
.modal_btnlist li:last-child {
  margin-right: -20%;
}
@media screen and (min-width:320px) and (max-width:1050px)  {
  .modal_btnlist {
  position: relative;
  margin-top: 5%;
  width: 100%;
}
.modal_btnlist li {
float: left;
  width: 100%;
  margin-right: 0%;
  margin-bottom: 5%;
}
.modal_btnlist li:last-child {
  margin-right: -20%;
}
}
  .bttbtn {
	width: 22%;
	margin: 0 auto;
	margin-bottom: 2%;
}
@media screen and (min-width:320px) and (max-width:1050px)  {
  .bttbtn {
	width: 80%;
	margin: 0 auto;
	margin-bottom: 20%;
}
}

/*タブレット*/
@media screen and (min-width:768px) and (max-width:1050px) {
	  .bttbtn {
	width: 40%;
	margin: 10% auto;
	margin-bottom: 15%;
}
}