@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;700&family=Zen+Maru+Gothic:wght@400;700&display=swap');
/*-----------------------------------------------------
全体共通
-------------------------------------------------------*/
p, h1, h2, h3, h4, h5, h6, a, li, caption, td, th, dt, dd, input, textarea, select, div, address  {
font-family: 'Plus Jakarta Sans','Zen Maru Gothic', serif;
font-feature-settings: "palt";
letter-spacing: -0.02em;
}
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-track {
border-radius: 5px;
box-shadow: 0 0 4px #ccc inset;
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #006934;
background: #efc0b9;
}
.wba {
word-break: break-all!important;
overflow-wrap: break-word;
max-width: 100%;
}
.fwbl {
font-weight: 700;
font-size: 150%;
}

/*====================================================================
 pagetopbtn_common
====================================================================*/
#ptbtn {
	position:fixed;
	bottom: 30px;
	right:5px;
	display:none;
	z-index:1000;
}
#ptbtn img {
width: 50px;
height: 50px;
}


header {
background-color: #fff;
width: 100%;
margin: 0 auto;
border-top:3px #FABE00 solid;
}
header #hd_logo {
padding: 10px;
text-align: left;
}
header #hd_logo img {
max-width: 243px;
}

footer {
width: 100%;
margin: 0 auto;
padding: 15px 0 50px 0;
background-color: #fabe00;
}
#copyright {
font-size: 12px;
text-align: center;
padding: 10px 0 0;
}
#yw_top {
margin: 0 auto;
text-align: center;
padding-top: 10px;
}
#yw_top img {
max-width: 149px;
width: 70%;
}

.color_gr {
color: #006934;
}

.ot_block a,.bokin_kiyaku a {
color: #E60012;
}



/* 768px以下 スマホ向け
--------------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
body {
	-webkit-text-size-adjust: 100%;
	min-width: 320px;
}

.part_pc {
	display: none!Important;
}
#wrapper {
width: 100%;
margin: 0 auto;
overflow-x: hidden;
}

/*-----------------------------------------------------
main
-------------------------------------------------------*/
h1 {
display: none;
}
#mainv {
width: 100%;
margin: 0 auto;
position: relative;
}
#mainv .icon_bokin {
position: absolute;
top:calc(40% - 55px);
left: 20px;
}
#mainv .icon_bokin img {
width: 29.3vw;
max-width: 110px;
}

/*-----------------------------------------------------
nav
-------------------------------------------------------*/
.anc_box {
width: 92%;
margin: 0 auto;
}
.anc_main {
width: 100%;
margin: 0 auto;
transition: .3s;
}
.anc_main img {
width: 100%;
height: auto;
}
.anc_main a:hover {
opacity: 0.6;
}


.anc-nav {
width: 98%;
margin: 0 auto 20px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.anc-nav li {
width: calc(50% - 20px);
margin:10px 10px 0;
}


/*-----------------------------------------------------
img
-------------------------------------------------------*/
.img_100 img {
width: 100%;
height: auto;
}
.icon {
width: 200px;
margin: 20px auto;
}
.preimg01 {
width: 100%;
margin: 0 auto;
}
.preimg02 {
width: 100%;
margin: 20px auto 0;
}
.sd_img {
width: 220px;
margin: 20px auto 50px;
}

/*-----------------------------------------------------
bg
-------------------------------------------------------*/
.bg1 {
width: 100%;
margin: 0 auto;
background: #fab900;
padding:30px 0;
}
.bg2 {
width: 100%;
margin: 0 auto;
background: url(../img/bg_neko-rp.png) repeat top center;
background-size: auto;
padding:100px 0 50px;
}
.bg3 {
width: 100%;
margin: 0 auto;
background: #fab900;
padding:30px 0;
}





/*-----------------------------------------------------
block
-------------------------------------------------------*/
/*--statement------------------*/
.block_statement {
width: 88%;
margin: 0 auto;
border-radius: 20px;
background: url(../img/bg_neko.png),#f8f4df;
background-size:120px auto;
background-repeat:no-repeat;
background-position:right 83%;
}
.nyan_kakomi {
margin: 20px auto;
padding: 20px;
border: 3px solid #000;
border-radius: 10px;
background: #fff4d6;
}

.naze_kakomi {
padding: 30px;
position: relative;
width:calc(88% - 60px);
margin:50px auto;
background:url(../img/bg_hatena.png);
background-position:center bottom;
background-size:auto 300px;
background-repeat:no-repeat;
}
.naze_kakomi::before, .naze_kakomi::after {
content: '';
width: 50px;
height: 100%;
position: absolute;
}
.naze_kakomi::before {
border-left: solid 3px #000;
border-top: solid 3px #000;
border-bottom: solid 3px #000;
top: 0;
left: 0;
}
.naze_kakomi::after {
border-right: solid 3px #000;
border-top: solid 3px #000;
border-bottom: solid 3px #000;
top: 0;
right: 0;
}

.howto_kakomi {
width: calc(88% - 40px);
margin: 30px auto;
background: #fffef8;
border-radius: 20px;
padding: 10px 20px;
box-shadow: 2px 2px 5px #ddd,-2px -2px 5px #ddd;
}

.block_wh1 {
width: calc(92% - 40px);
margin: 0 auto 50px;
padding: 20px;
background-image: url(../img/bg_kakomi1.png);
background-position: top center;
background-repeat: no-repeat;
background-size: 100% 100%;
background-color: #fff;
border-radius: 30px;
}

.block_wh2 {
width: calc(92% - 40px);
margin: 0 auto 50px;
padding: 20px;
background-image: url(../img/bg_kakomi2.png);
background-position: top center;
background-repeat: no-repeat;
background-size: 100% 100%;
background-color: #fff;
border-radius: 30px;
}


/*-----------------------------------------------------
contents
-------------------------------------------------------*/
.inner {
padding:20px;
}
.inner2 {
padding: 0 10px;
}
.inner3 {
padding: 0 20px 20px;
}

#nekopanchi,#nekocm,#nekoposter {
margin-bottom: 80px;
}

/*-----------------------------------------------------
box
-------------------------------------------------------*/

.profile {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.profile .txtbox {
width: 50%;
}
.profile .phbox {
width: 40%;
text-align: right;
}

/*-----------------------------------------------------
txt-style
-------------------------------------------------------*/
h2 {
font-size: 23px;
line-height:1.5;
font-weight:700;
}

.border_line{
  padding-bottom: 1px;
  display: inline; 
  background:linear-gradient(transparent 75%, #fab900 0%);
}
.naze_ttl {
font-size:24px;
text-align:center;
font-weight:700;
padding-bottom:30px;
}
.h3_box {
width:92%;
margin:0 auto;
position:relative;
min-height: 100px;
}
h3 {
padding-bottom:30px;
z-index:10;
position:absolute;
top:0;
left:0;
z-index:10;
}
h4 {
font-size: 26px;
font-weight: 700;
padding: 20px 0;
}
h4 span {
font-size: 26px;
}
.neko_icon1 {
position:absolute;
top:-40px;
left:40px;
z-index:1;
}
.neko_icon1 img {
width:100px;
height:auto;
}
.neko_icon2 {
position:absolute;
top:-60px;
left:30px;
z-index:1;
}
.neko_icon2 img {
width:60px;
height:auto;
}
.neko_icon3 {
position:absolute;
top:-70px;
right:30px;
z-index:1;
}
.neko_icon3 img {
width:60px;
height:auto;
}
.neko_icon4 {
position:absolute;
top:-60px;
left: calc(50% - 30px);
z-index:1;
}
.neko_icon4 img {
width:60px;
height:auto;
}
ul.nekoashi{
width:80%;
margin:0 auto;
display:flex;
justify-content: space-around;
flex-wrap: nowrap;
}
ul.nekoashi li img {
width: 100%;
height: auto;
}

.tal {
text-align: left!important;
}
.tac {
text-align: center!important;
}
.tar {
text-align: right!important;
}
.col_bk {
color: #000;
}
.col_wt {
color: #fff;
}
.col_rd {
color: #e50012;
}
.fwb {
font-weight: 700;
}
.statement {
font-size: 15px;
line-height: 1.6;
color: #222;
padding:20px 0 0;
}


.honbun {
font-size: 16px;
line-height: 1.6;
padding-bottom: 20px;
}
.honbun_l {
font-size: 16px;
line-height: 1.6;
}
.honbun_ll {
font-size: 22px;
line-height: 1.6;
font-weight: 700;
}
.honbun_s {
font-size: 13px;
line-height: 1.6;
}
.honbun_m {
font-size: 15px;
line-height: 1.6;
}
.lead {
font-size: 18px;
line-height: 1.4;
padding-bottom: 20px;
font-weight:700;
}
.catch {
font-size: 18px;
line-height: 1.5;
padding-top: 20px;
}
.okaiage{
font-size: 24px;
line-height: 1.5;
padding-bottom: 50px;
}
.ttl_line {
font-size: 18px;
padding-bottom: 5px;
border-bottom: 2px solid #222;
margin-bottom: 10px;
}
.cmp_date {
width: 80%;
margin: 20px auto;
padding: 10px;
background: #ec8e26;
font-size: 48px;
line-height: 1;
color: #fff;
text-align: center;
border-radius: 34px;
}
.cmp_date span {
font-size: 36px;
}
.anno1 {
font-size: 12px;
line-height: 1.5;
padding: 20px 0;
}
.sarani {
width: 92%;
margin: 20px auto 0;
font-size: 18px;
line-height: 1.5;
padding: 10px 0;
border-top:2px solid #222;
border-bottom: 2px solid #222;
}
.mokuhyo {
font-size: 36px;
font-weight: 700;
padding: 10px 0 0;
}
.mokuhyo span {
font-size: 60px;
}

/*-----------------------------------------------------
linkbtn
-------------------------------------------------------*/

.linkbtn1{
width: 92%;
    display:block;
    background:#7a543f;
	margin: 10px auto;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
    padding:15px 0;
    text-align:center;
    text-decoration: none;
	border-radius: 27px;
	transition: .3s;
	box-shadow: 3px 3px 0px #ccc;
}

.linkbtn1 a {
text-decoration: none!important;
display: block;
color: #fff;
}
.linkbtn1:hover {
opacity: 0.7;

}

.txtlink a {
text-decoration: underline;
color: #222;
}
.txtlink a:hover {
color: #ec8e26;
}

.tento_lead {
font-size: 20px;
font-weight: 700;
line-height: 1.4;
padding-bottom: 30px;
}
.tento_lead span {
font-size:25px;
}
.tento_kikan {
font-size: 24px;
font-weight: 700;
color: #f29700;
line-height: 1.4;
padding-bottom: 30px;
}


/*-----------------------------------------------------
gamen parts
-------------------------------------------------------*/
.neko_gamen {
width: 92%;
margin: 0 auto;
}
.box_kakomi {
width: 100%;
margin: 0 auto;
padding: 30px 0;
}
.qr_img {
width: 152px;
margin: 20px auto;
}
ul.kifu_icon {
width: 80%;
margin: 30px auto 0;
display: flex;
justify-content: space-around;
flex-wrap: nowrap;
}
.bokin_kiyaku {
width: calc(100% - 10px);
margin: 0 auto 20px;
height: 270px;
overflow-y: scroll;
padding: 10px;
border:1px solid #ccc;
background-color: #fff;
}
.bokin_kiyaku a {
font-size: 95%;
}
ul.nekotime {
width: 88%;
margin: 20px auto 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
ul.nekotime li {
background-color: #f8f4df;
border:1px solid #000;
border-radius: 10px;
padding: 10px;
text-align: center;
font-size: 16px;
width: calc(48% - 20px);
margin-bottom: 5px;
}


/*-----------------------------------------------------
youtube
-------------------------------------------------------*/
.mv_box {
margin: 10px auto 20px;
  position:relative;
  width:100%;
  padding-top:56.25%;
  margin-bottom: 10px;
}
.mv_box iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

/*-----------------------------------------------------
pastlist
-------------------------------------------------------*/
.past_kakomi {
padding: 10px;
position: relative;
width:calc(92% - 20px);
margin:50px auto 0;
}
.past_kakomi::before, .past_kakomi::after {
content: '';
width: 30px;
height: 30px;
position: absolute;
}
.past_kakomi::before {
border-left: solid 10px #006934;
border-top: solid 10px #006934;
top: 0;
left: 0;
}
.past_kakomi::after {
border-right: solid 10px #006934;
border-top: solid 10px #006934;
top: 0;
right: 0;
}

.past_kakomi_btm {
position: relative;
width:92%;
height: 50px;
margin:-50px auto 50px;
}
.past_kakomi_btm::before, .past_kakomi_btm::after {
content: '';
width: 50px;
height: 50px;
position: absolute;
}
.past_kakomi_btm::before {
border-left: solid 10px #006934;
border-bottom: solid 10px #006934;
bottom: 0;
left: 0;
}
.past_kakomi_btm::after {
border-right: solid 10px #006934;
border-bottom: solid 10px #006934;
bottom: 0;
right: 0;
}

ul.pastlist {
width: 100%;
margin: 20px auto;
display: block;
}
ul.pastlist li {
width: 100%;
margin-bottom: 30px;
}
ul.pastlist .ttl {
font-size: 20px;
text-align: center;
padding: 10px 0;
font-weight: 700;
}
ul.pastlist .thumb {
margin-bottom: 10px;
}
ul.pastlist .thumb a:hover {
opacity: 0.7;
transition:.3s;
}


/*-----------------------------------------------------
campaign
-------------------------------------------------------*/
.gaiyo_block {
width: 100%;
margin: 0 auto;
position: relative;
}
.icon_nyan1 {
position: absolute;
top: 20px;
right: 0;
}
.icon_nyan1 img {
width: 80px;
height: auto;
}
.icon_nyan2 {
text-align: center;
padding-top: 30px;
}
.icon_nyan2 img {
width: 200px;
height: auto;
}

.gaiyou_ttl {
font-size: 20px;
line-height: 1.8;
}

.gaiyo_honbun {
font-size: 18px;
line-height: 1.6;
padding-bottom: 20px;
}
.gaiyo_honbun span {
font-weight: bold;
}
.gaiyo_honbun a {
color: #fab900;
}
.tw_btn {
width: 240px;
margin: 0 0 10px 30px;
}
.tw_btn a:hover img {
opacity: .7;
transition: .3s;
}

.oth_block {
width: 100%;
margin: 20px auto 0;
}
.oth_block .ttl {
font-size: 20px;
line-height: 1.8;
}


.ot_block {
width: calc(100% - 10px);
margin: 0 auto 20px;
height: 270px;
overflow-y: scroll;
padding: 10px;
border:1px solid #ccc;
}
.ot_block .ptxt {
font-size: 16px;
color: #000;
line-height: 1;
}
.ot_block .ntxt {
font-size: 14px;
color: #444;
line-height: 1.5;
padding: 10px 0;
}
.ot_block a {
color: #E60012;
}






/*-----------------------------------------------------
slider
-------------------------------------------------------*/
#howbokin {
width: 100%;
margin: 0 auto 30px;
}

#howbokin div {
	margin: 0 auto 10px;
}
#howbokin div img {
width: 100%;
height: auto;
background-color: #fff;
}


.slide-dots {
  margin: -20px 0 0 0;
  padding: 0;
  text-align: center;
}
.slide-dots li {
  display: inline-block;
  margin: 0 15px;
}
.slide-dots li button {
  position: relative;
 text-indent: -9999px;
}
.slide-dots li button::before {
  background-image: url(../img/slider_dot_off.png);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  cursor: pointer;
  height: 20px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 10px;
  width: 20px;
}
.slide-dots li.slick-active button::before {
  background-image: url(../img/slider_dot.png);
}


#nekoposlider {
width: 100%
margin: 0 auto 50px;
}

#nekoposlider div {
	width: 100%;
	height: auto;
	margin: 0 auto;
}
#nekoposlider div img {
width: 100%;
height: auto;
margin-bottom: 20px;
}

button {
  background: none;
  border: none;
  outline: none;
  padding: 0 7px;
}

.slick-arrow:before{
	content:""!important;
}
.slick-arrow:before{
    content:""!important;
    width: 100%!important;
    height: 100%!important;
    position: absolute;
    top: 0;
    left: 0;
}

.slick-next:before{
    background: url(../img/arrow_r.png)!important;
    background-size: contain!important;
}

.slick-prev:before{
    background: url(../img/arrow_l.png)!important;
    background-size: contain!important;
}
.slick-arrow{
    z-index:2!important;
    width:40px!important;
    height:40px!important;
}

.slick-next{
    right:-40px!important;
	transition: .3s;
}

.slick-prev{
    left:-40px!important;
	transition: .3s;
}
.slick-next a:hover,.slick-prev a:hover {
opacity: 0.7;
}

/*-----------------------------------------------------
modal
-------------------------------------------------------*/
#modal {
display: none;
}
.sd_box {
width: 100%;
margin: 0 auto;
}
.sd_box .sd_ttl {
font-size: 20px;
font-weight: 700;
background-color: #ffff00;
padding: 10px;
text-align: center;
}
.sd_kakomi {
width: 100%;
margin: 20px auto;
display: block;
}
.sd_item1 {
width: 100%;
font-size: 16px;
line-height: 1.8;
padding-bottom: 20px;
}
.sd_item2 {
width: 50%;
margin: 0 auto;
}
.sd_item2 img {
width: 100%;
}
.sd_cap {
font-size: 14px;
}
.sd_cap a {
color: #ec8e26;
text-decoration: underline;
transition: .3s;
font-weight: 700;
}
.sd_cap a:hover {
opacity: 0.7;
}

/*-----------------------------------------------------
neko action
-------------------------------------------------------*/
.catact.fadeup.is-animated.is-active {
  animation: fadeup 0.8s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
.catact {
opacity: 0;
}

@keyframes fadeup {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.panchi {
opacity: 0;
}
.fadeUp.is-active {
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

.delay-time1{
animation-delay: 0.2s;
}
.delay-time2{
animation-delay: 0.4s;
}
.delay-time3{
animation-delay: 0.6s;
}
.delay-time4{
animation-delay: 0.8s;
}


.catcross1 {
  background-image: url(../img/cat1.png);
  width: 180px;
  height: 123px;
  background-size: cover;
  position: absolute;
  bottom: -50;
  right: 0;
  z-index: 100;
  opacity: 0;
  overflow: hidden;
}
.catcross2 {
  background-image: url(../img/cat2.png);
  width: 190px;
  height: 80px;
  background-size: cover;
  position: absolute;
  bottom: -50;
  left: 0;
  z-index: 100;
  opacity: 0;
  overflow: hidden;
}

.catcross1.slide-skew.is-animated.is-active {
  animation: slide-skew 3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes slide-skew {
  0% {
    transform: translate(768px,180px);
    opacity: 0;
  }
  100% {
    transform: translate(-768px,0);
  }
  20%,100% {
    opacity: 1;
  }
}

.catcross2.slide-skew2.is-animated.is-active {
  animation: slide-skew2 3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes slide-skew2 {
  0% {
    transform: translate(-768px,190px);
    opacity: 0;
  }
  100% {
    transform: translate(768px,0);
  }
  20%,100% {
    opacity: 1;
  }
}



}


/* 769px以上 PC向け
--------------------------------------------------------------------------------- */
@media print, screen and (min-width: 769px) {
body {
	min-width: 1200px;
}
.part_sp {
	display: none!Important;
}
a {
	transition: .5s;
}

#wrapper {
width: 100%;
margin: 0 auto;
overflow-x: hidden;
}
/*-----------------------------------------------------
main
-------------------------------------------------------*/
h1 {
display: none;
}
#mainv {
width: 100%;
margin: 0 auto;
min-width: 1200px;
position: relative;
}
#mainv .icon_bokin {
position: absolute;
top:calc(50% - 150px);
left: 3%;
}
#mainv .icon_bokin img {
width: 19.4vw;
max-width: 374px;
min-width: 240px;
height: auto;
}

/*-----------------------------------------------------
nav
-------------------------------------------------------*/
.anc_box {
width: 900px;
margin: 0 auto;
}
.anc_main {
width: 100%;
margin: 0 auto;
transition: .3s;
}
.anc_main img {
width: 100%;
height: auto;
}
.anc_main a:hover {
opacity: 0.6;
}


.anc-nav {
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
padding:20px 0;
}
.anc-nav li {
width: 19%;
transition: .3s;
}
.anc-nav li a:hover {
opacity: .6;
}

/*-----------------------------------------------------
img
-------------------------------------------------------*/
.img_100 img {
width: 100%;
height: auto;
}
.icon {
width: 200px;
margin: 20px auto;
}
.preimg01 {
width: 840px;
margin: 20px auto;
}
.preimg02 {
width: 60%;
margin: 20px auto 0;
}
.sd_img {
width: 220px;
margin: 20px auto;
}

/*-----------------------------------------------------
bg
-------------------------------------------------------*/
.bg1 {
width: 100%;
margin: 0 auto;
background: #fab900;
padding:30px 0;
}
.bg2 {
width: 100%;
margin: 0 auto;
background: url(../img/bg_neko-rp.png) repeat top center;
background-size: auto;
padding:100px 0 50px;
}
.bg3 {
width: 100%;
margin: 0 auto;
background: #fab900;
padding:30px 0;
}


/*-----------------------------------------------------
block
-------------------------------------------------------*/
.block_statement {
width: 960px;
margin: 0 auto;
border-radius: 20px;
background: url(../img/bg_neko.png),#f8f4df;
background-size:250px auto;
background-repeat:no-repeat;
background-position:bottom right;
}
.nyan_kakomi {
margin: 20px auto;
padding: 20px;
border: 3px solid #000;
border-radius: 10px;
background: #fff4d6;
}

.naze_kakomi {
padding: 30px;
position: relative;
width:900px;
margin:50px auto;
background:url(../img/bg_hatena.png);
background-position:center bottom;
background-size:auto 300px;
background-repeat:no-repeat;
}
.naze_kakomi::before, .naze_kakomi::after {
content: '';
width: 50px;
height: 100%;
position: absolute;
}
.naze_kakomi::before {
border-left: solid 3px #000;
border-top: solid 3px #000;
border-bottom: solid 3px #000;
top: 0;
left: 0;
}
.naze_kakomi::after {
border-right: solid 3px #000;
border-top: solid 3px #000;
border-bottom: solid 3px #000;
top: 0;
right: 0;
}

.howto_kakomi {
width: 840px;
margin: 30px auto;
background: #fffef8;
border-radius: 20px;
padding: 30px;
box-shadow: 2px 2px 5px #ddd,-2px -2px 5px #ddd;
}

.block_wh1 {
width: 1100px;
margin: 0 auto 50px;
padding: 80px;
background-image: url(../img/bg_kakomi1.png);
background-position: top center;
background-repeat: no-repeat;
background-size: 100% 100%;
}

.block_wh2 {
width: 1100px;
margin: 0 auto 50px;
padding: 80px;
background-image: url(../img/bg_kakomi2.png);
background-position: top center;
background-repeat: no-repeat;
background-size: 100% 100%;
}


/*-----------------------------------------------------
contents
-------------------------------------------------------*/
.inner {
padding:40px;
}
.inner2 {
padding: 0 20px;
}
.inner3 {
padding: 0 100px 100px;
}

#nekopanchi,#nekocm,#nekoposter {
margin-bottom: 100px;
}

/*-----------------------------------------------------
box
-------------------------------------------------------*/

.profile {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.profile .txtbox {
width: 50%;
}
.profile .phbox {
width: 40%;
text-align: right;
}

/*-----------------------------------------------------
txt-style
-------------------------------------------------------*/
h2 {
font-size: 44px;
line-height:1.5;
font-weight:700;
}
.border_line{
  padding-bottom: 1px;
  display: inline; 
  background:linear-gradient(transparent 75%, #fab900 0%);
}
.naze_ttl {
font-size:36px;
text-align:center;
font-weight:700;
padding-bottom:30px;
}
.h3_box {
width:765px;
margin:0 auto;
position:relative;
min-height: 180px;
}
h3 {
padding-bottom:30px;
z-index:10;
position:absolute;
top:0;
left:0;
z-index:10;
}
h4 {
font-size: 36px;
font-weight: 700;
padding-bottom: 20px;
}
h4 span {
font-size: 58px;
}
.neko_icon1 {
position:absolute;
top:-80px;
left:40px;
z-index:1;
}
.neko_icon1 img {
width:100px;
height:auto;
}
.neko_icon2 {
position:absolute;
top:-80px;
left:30px;
z-index:1;
}
.neko_icon2 img {
width:100px;
height:auto;
}
.neko_icon3 {
position:absolute;
top:-80px;
right:30px;
z-index:1;
}
.neko_icon3 img {
width:100px;
height:auto;
}
.neko_icon4 {
position:absolute;
top:-80px;
left: calc(50% - 50px);
z-index:1;
}
.neko_icon4 img {
width:100px;
height:auto;
}
ul.nekoashi{
width:80%;
margin:0 auto;
display:flex;
justify-content: space-around;
flex-wrap: nowrap;
}
ul.nekoashi li img {
width: 100%;
height: auto;
}

.tal {
text-align: left;
}
.tac {
text-align: center;
}
.tar {
text-align: right;
}
.col_bk {
color: #000;
}
.col_wt {
color: #fff;
}
.col_rd {
color: #e50012;
}
.fwb {
font-weight: 700;
}
.statement {
font-size: 20px;
line-height: 2;
color: #222;
padding:30px 0 0;
}


.honbun {
font-size: 18px;
line-height: 1.6;
padding-bottom: 20px;
}
.honbun_l {
font-size: 20px;
line-height: 1.6;
}
.honbun_ll {
font-size: 30px;
line-height: 1.6;
font-weight: 700;
}
.honbun_s {
font-size: 14px;
line-height: 1.6;
}
.honbun_m {
font-size: 16px;
line-height: 1.6;
}
.lead {
font-size: 24px;
line-height: 1.6;
padding-bottom: 20px;
font-weight:700;
}
.catch {
font-size: 24px;
line-height: 1.5;
padding-top: 50px;
}
.okaiage{
font-size: 24px;
line-height: 1.5;
padding-bottom: 50px;
}
.ttl_line {
font-size: 18px;
padding-bottom: 5px;
border-bottom: 2px solid #222;
margin-bottom: 10px;
}
.cmp_date {
width: 80%;
margin: 20px auto;
padding: 10px;
background: #ec8e26;
font-size: 48px;
line-height: 1;
color: #fff;
text-align: center;
border-radius: 34px;
}
.cmp_date span {
font-size: 36px;
}
.anno1 {
font-size: 14px;
line-height: 1.5;
padding: 20px 0;
}
.sarani {
width: 85%;
margin: 20px auto;
font-size: 28px;
line-height: 1.5;
padding: 10px 0;
border-top:2px solid #222;
border-bottom: 2px solid #222;
}
.mokuhyo {
font-size: 48px;
font-weight: 700;
padding: 10px 0 0;
}
.mokuhyo span {
font-size: 72px;
}

/*-----------------------------------------------------
linkbtn
-------------------------------------------------------*/

.linkbtn1{
width: 400px;
    display:block;
    background:#efc0b9;
	margin: 10px auto 50px;
	font-size: 24px;
	line-height: 1;
    padding:15px 0;
    text-align:center;
    text-decoration: none;
	border-radius: 27px;
	transition: .3s;
	box-shadow: 3px 3px 0px #ccc;
}

.linkbtn1 a {
text-decoration: none!important;
display: block;
color: #000;

}
.linkbtn1:hover {
opacity: 0.7;

}

.txtlink a {
text-decoration: underline;
color: #222;
}
.txtlink a:hover {
color: #ec8e26;
}

.tento_lead {
font-size: 28px;
font-weight: 700;
line-height: 1.4;
padding-bottom: 30px;
}
.tento_lead span {
font-size: 50px;
}
.tento_kikan {
font-size: 48px;
font-weight: 700;
color: #f29700;
line-height: 1.4;
padding-bottom: 30px;
}


/*-----------------------------------------------------
gamen parts
-------------------------------------------------------*/
.neko_gamen {
width: 800px;
margin: 0 auto;
}
.box_kakomi {
width: 100%;
margin: 0 auto;
padding: 50px 0;
}
.qr_img {
width: 152px;
margin: 20px auto;
}
ul.kifu_icon {
width: 80%;
margin: 30px auto 0;
display: flex;
justify-content: space-around;
flex-wrap: nowrap;
}
.bokin_kiyaku {
width: 710px;
margin: 0 auto;
height: 270px;
overflow: auto;
background-color: #fff;
border:1px solid #ccc;
padding: 20px;
}
ul.nekotime {
width: 800px;
margin: 20px auto 0;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}
ul.nekotime li {
background-color: #f8f4df;
border:1px solid #000;
border-radius: 10px;
padding: 10px 20px;
text-align: center;
font-size: 18px;
}

/*-----------------------------------------------------
youtube
-------------------------------------------------------*/
.mv_box {
width: 960px;
margin: 20px auto 50px;
}
.mv_box iframe {
width: 960px;
height: 540px;
}

/*-----------------------------------------------------
pastlist
-------------------------------------------------------*/
.past_kakomi {
padding: 30px;
position: relative;
width:900px;
margin:50px auto 0;
}
.past_kakomi::before, .past_kakomi::after {
content: '';
width: 50px;
height: 50px;
position: absolute;
}
.past_kakomi::before {
border-left: solid 10px #006934;
border-top: solid 10px #006934;
top: 0;
left: 0;
}
.past_kakomi::after {
border-right: solid 10px #006934;
border-top: solid 10px #006934;
top: 0;
right: 0;
}

.past_kakomi_btm {
position: relative;
width:960px;
height: 50px;
margin:-50px auto 50px;
}
.past_kakomi_btm::before, .past_kakomi_btm::after {
content: '';
width: 50px;
height: 50px;
position: absolute;
}
.past_kakomi_btm::before {
border-left: solid 10px #006934;
border-bottom: solid 10px #006934;
bottom: 0;
left: 0;
}
.past_kakomi_btm::after {
border-right: solid 10px #006934;
border-bottom: solid 10px #006934;
bottom: 0;
right: 0;
}

ul.pastlist {
width: 880px;
margin: 20px auto;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
}
ul.pastlist li {
width: 48%;
margin-bottom: 30px;
}
ul.pastlist .ttl {
font-size: 20px;
text-align: center;
padding: 10px 0;
font-weight: 700;
}
ul.pastlist .thumb {
margin-bottom: 10px;
}
ul.pastlist .thumb a:hover {
opacity: 0.7;
transition:.3s;
}


/*-----------------------------------------------------
campaign
-------------------------------------------------------*/
.gaiyo_block {
width: 72%;
margin: 0 auto;
position: relative;
}
.icon_nyan1 {
position: absolute;
bottom: 20px;
right: 20px;
}
.icon_nyan1 img {
width: 132px;
height: auto;
}
.icon_nyan2 {
text-align: right;
padding-top: 30px;
}
.icon_nyan2 img {
width: 300px;
height: auto;
}

.gaiyou_ttl {
font-size: 24px;
line-height: 1.8;
font-weight: 700;
}

.gaiyo_honbun {
font-size: 18px;
line-height: 1.6;
padding-bottom: 20px;
}
.gaiyo_honbun span {
font-weight: bold;
}
.gaiyo_honbun a {
color: #fab900;
}
.tw_btn {
width: 240px;
margin: 0 0 20px 0;
}
.tw_btn a:hover img {
opacity: .7;
transition: .3s;
}

.oth_block {
width: 72%;
margin: 20px auto 0;
}
.oth_block .ttl {
font-size: 20px;
line-height: 1.8;
}


.ot_block {
width: 100%;
margin: 0 auto 150px;
height: 270px;
overflow: auto;
padding: 20px;
border:1px solid #ccc;
}
.ot_block .ptxt {
font-size: 16px;
color: #000;
line-height: 1;
}
.ot_block .ntxt {
font-size: 14px;
color: #444;
line-height: 1.5;
padding: 10px 0;
}







/*-----------------------------------------------------
slider
-------------------------------------------------------*/
#howbokin {
width: 640px;
margin: 0 auto 50px;
}

#howbokin div {
margin-bottom: 10px;
}
#howbokin div img {
width: 100%;
height: auto;
background-color: #fff;
}


.slide-dots {
  margin: 0;
  padding: 0;
  text-align: center;
}
.slide-dots li {
  display: inline-block;
  margin: 0 20px;
}
.slide-dots li button {
  position: relative;
 text-indent: -9999px;
}
.slide-dots li button::before {
  background-image: url(../img/slider_dot_off.png);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  cursor: pointer;
  height: 30px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 10px;
  width: 30px;
}
.slide-dots li.slick-active button::before {
  background-image: url(../img/slider_dot.png);
}


#nekoposlider {
width: 1200px;
margin: 0 auto 50px;
}

#nekoposlider div {
	height: auto;
	margin: 0 auto;
}
#nekoposlider div img {
width: calc(100% - 40px);
height: auto;
margin: 0 auto;
}

button {
  background: none;
  border: none;
  outline: none;
  padding: 0 7px;
}

.slick-arrow:before{
	content:""!important;
}
.slick-arrow:before{
    content:""!important;
    width: 100%!important;
    height: 100%!important;
    position: absolute;
    top: 0;
    left: 0;
}

.slick-next:before{
    background: url(../img/arrow_r.png)!important;
    background-size: contain!important;
}

.slick-prev:before{
    background: url(../img/arrow_l.png)!important;
    background-size: contain!important;
}
.slick-arrow{
    z-index:2!important;
    width:40px!important;
    height:40px!important;
}

.slick-next{
    right:-40px!important;
	transition: .3s;
}

.slick-prev{
    left:-40px!important;
	transition: .3s;
}
.slick-next a:hover,.slick-prev a:hover {
opacity: 0.7;
}

/*-----------------------------------------------------
modal
-------------------------------------------------------*/
#modal {
display: none;
}
.sd_box {
width: 100%;
margin: 0 auto;
}
.sd_box .sd_ttl {
font-size: 24px;
font-weight: 700;
background-color: #ffff00;
padding: 10px;
text-align: center;
}
.sd_kakomi {
width: 100%;
margin: 20px auto;
display: flex;
}
.sd_item1 {
width: 70%;
font-size: 16px;
line-height: 1.8;
padding-right: 20px;
}
.sd_item2 {
width: 28%;
text-align: right;
}
.sd_item2 img {
width: 100%;
}
.sd_cap {
font-size: 14px;
}
.sd_cap a {
color: #ec8e26;
text-decoration: underline;
transition: .3s;
font-weight: 700;
}
.sd_cap a:hover {
opacity: 0.7;
}

/*-----------------------------------------------------
neko action
-------------------------------------------------------*/
.catact.fadeup.is-animated.is-active {
  animation: fadeup 1.5s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
.catact {
opacity: 0;
}

@keyframes fadeup {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.panchi {
opacity: 0;
}
.fadeUp.is-active {
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

.delay-time1{
animation-delay: 0.2s;
}
.delay-time2{
animation-delay: 0.4s;
}
.delay-time3{
animation-delay: 0.6s;
}
.delay-time4{
animation-delay: 0.8s;
}


.catcross1 {
  background-image: url(../img/cat1.png);
  width: 361px;
  height: 246px;
  background-size: cover;
  position: absolute;
  bottom: -100;
  right: 0;
  z-index: 100;
  opacity: 0;
}
.catcross2 {
  background-image: url(../img/cat2.png);
  width: 380px;
  height: 160px;
  background-size: cover;
  position: absolute;
  bottom: -100;
  left: 0;
  z-index: 100;
  opacity: 0;
}

.catcross1.slide-skew.is-animated.is-active {
  animation: slide-skew 3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes slide-skew {
  0% {
    transform: translate(2000px,200px);
    opacity: 0;
  }
  100% {
    transform: translate(-1800px,0);
  }
  20%,100% {
    opacity: 1;
  }
}

.catcross2.slide-skew2.is-animated.is-active {
  animation: slide-skew2 3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
 
@keyframes slide-skew2 {
  0% {
    transform: translate(-1800px,300px);
    opacity: 0;
  }
  100% {
    transform: translate(2000px,0);
  }
  20%,100% {
    opacity: 1;
  }
}




}