@charset "utf-8";




/*  */
.mv{
	overflow: hidden;
}
.mv__slider{
	margin: 0;
	padding: 0;
	list-style: none;
}
.slick-arrow{
	position: absolute;
	z-index: 1;
	left: 50%;
	
	width: 40px;
	height: 40px;
}
.slick-arrow::before{
	content: "";
	display: block;
	
	opacity: 1;
	width: 46px;
	height: 46px;
}
.slick-prev,
.slick-next{
	display: block;
	width: 46px;
	height: 46px;
	margin-top: -23px;
	margin-left: -23px;
}
.slick-prev{
	transform: translateX(-500px);
}
.slick-next{
	transform: translateX(500px);
}
.slick-prev:before{
	background: url(../img/index/mv__arrow--back.png);
}
.slick-next:before{
	background: url(../img/index/mv__arrow--next.png);
}
.slick-dots li{
	margin-left: 2px;
	margin-right: 2px;
}
.slick-dots li button::before{
	opacity: 1;
	color: #DCB8C9;
	font-size: 13px;
}
.slick-dots li.slick-active button::before{
	color: #DA340A;
}
.mv__slide{
	background-color: #000;
}
.mv__slide img{
	opacity: .5;
	
	transition: opacity .3s ease-out;
	-o-transition: opacity .3s ease-out;
	-ms-transition: opacity .3s ease-out;
	-moz-transition: opacity .3s ease-out;
	-webkit-transition: opacity .3s ease-out;
}
.mv__slide.slick-active img{
	opacity: 1;
}

@media print, screen and (min-width: 768px){
	.mv__img{
		width: 1000px;
		height: 368px;
	}
}
@media only screen and (max-width: 767px){
	.mv__img{
		width: 100vw;
	}
	.slick-arrow{
		visibility: hidden;
	}
}





/*  */
.information{}
.information__inner{}
.information__heading{
	text-align: center;
}
.information__em{
	color: #DA340A;
}
.information__items{
	
	margin: 0;
	padding: 0;
	list-style: none;
	
	
	
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: flex;
	display: -o-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -webkit-flex;
	justify-content: space-between;
	-o-justify-content: space-between;
	-ms-justify-content: space-between;
	-moz-justify-content: space-between;
	-webkit-justify-content: space-between;
}
.information__item{}
.information__link{
	display: block;
	height: 100%;
}
.information__photo{}
.information .separate1{
	margin-top: 0;
	margin-bottom: 0;
}
.information__img{}
.information__note{
	margin: 0;
	padding: 1em;
	font-size: .875em;
	line-height: 2em;
}
.information__more{
	margin-top: 2em;
	text-align: center;
}
@media print, screen and (min-width: 768px){
.information{}
.information__inner{}
.information__heading{}
.information__items{
	margin-left: -2%;
	
	
	
	flex-wrap: nowrap;
}
.information__item{
	margin-left: 2%;
	
	flex: 1 1 100%;
	-o-flex: 1 1 100%;
	-ms-flex: 1 1 100%;
	-moz-flex: 1 1 100%;
	-webkit-flex: 1 1 100%;
}
.information__link{}
.information__photo{}
.information__img{}
.information__note{}
.information__more{}
}
@media only screen and (max-width: 767px){
.information{}
.information__inner{}
.information__heading{}
.information__items{
	margin-left: -5%;
	
	flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}
.information__item{
	margin-left: 5%;
	margin-bottom: 1.5em;
	
	flex: 1 1 45%;
	-o-flex: 1 1 45%;
	-ms-flex: 1 1 45%;
	-moz-flex: 1 1 45%;
	-webkit-flex: 1 1 45%;
}
.information__link{}
.information__photo{}
.information__img{}
/* ▼ 2017.11.25 ▼ */
.information__note{
	line-height: 120%;
}
/* ▲ 2017.11.25 ▲ */
	.information__more{}
}

.information__button{
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	_color: #6699cc;
	color: #3E95D1;
	_color: #5FB442;
	font-size: 1.5rem;
	padding: .5em 1em;
	_border: 2px solid #99ccff;
	border: 2px solid #3E95D1;
	_border: 2px solid #5FB442;
	border-radius: 5px;
	
	transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1);
	-o-transition: -o-transform .3s cubic-bezier(0.23, 1, 0.32, 1);
	-ms-transition: -ms-transform .3s cubic-bezier(0.23, 1, 0.32, 1);
	-moz-transition: -moz-transform .3s cubic-bezier(0.23, 1, 0.32, 1);
	-webkit-transition: -webkit-transform .3s cubic-bezier(0.23, 1, 0.32, 1);
	
	box-sizing: 		border-box;
	-o-box-sizing: 		border-box;
	-ms-box-sizing: 	border-box;
	-moz-box-sizing: 	border-box;
	-webkit-box-sizing: border-box;
}
@media only screen and (max-width: 767px){
	.information__button{
		font-size: 1.25rem;
	}
}

.information__button:hover{
	transform: scale(1.1);
	color: #3E95D1;
}



/*  */
.campaign{}
.campaign__heading{}
.campaign__inner{}
.campaign__more{
	text-align: center;
}
@media print, screen and (min-width: 768px){
	.campaign__tab{
		margin-bottom: 2em;
	}
}
@media only screen and (max-width: 767px){
	.campaign__tab{
		margin-bottom: 1em;
	}
}





/*  */
.magazine{}
.magazine__inner{}
.magazine__items{

}
.magazine__item{}
.magazine__link{}
.magazine__img{}
@media print, screen and (min-width: 768px){
.magazine{}
.magazine__inner{}
.magazine__items{
	margin-bottom: -1em;
	
	
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: flex;
	display: -o-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -webkit-flex;

	flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;

	justify-content: space-between;
	-o-justify-content: space-between;
	-ms-justify-content: space-between;
	-moz-justify-content: space-between;
	-webkit-justify-content: space-between;

/*2個のときこの部分外す*/
	justify-content: center;
	align-items: center;
/*2個のときこの部分外す*/
}
.magazine__item{
	margin-bottom: 1em;
}
.magazine__link{}
.magazine__img{}
}
@media only screen and (max-width: 767px){
.magazine{}
.magazine__inner{}
.magazine__items{
	overflow: hidden;
	margin-left: 10%;
	margin-right: 10%;
	margin-bottom: -1em;
}
.magazine__item{
	margin-bottom: 1em;
}
.magazine__link{}
.magazine__img{
	width: 100%;
}
}





/* web service */
.webservice{
	color: #fff;
	background-color: #52BDE5;
	
	padding-top: 2rem;
	padding-bottom: 2rem;
}
.webservice a{
	color: #fff;
}
.webservice__inner{}
.webservice__heading{
	margin: 0;
	padding: 0;
	text-align: center;
	
	font-size: 1.5em;
	font-weight: bold;
}
.webservice__heading_lede,
.webservice__heading_body{
	display: block;
}

.webservice__heading_lede{
	text-align: center;
}
.webservice__heading_lede_svg{
	width: 100%;
}
.webservice__heading_body{
	font-size: 1.5em;
	line-height: 1.5em;
}
.webservice-regist{}
.webservice-regist__items{
	
	
	margin: 0 0 .5em -2rem;
	padding: 0;
	list-style: none;
	
	
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: flex;
	display: -o-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -webkit-flex;
	justify-content: space-between;
	-o-justify-content: space-between;
	-ms-justify-content: space-between;
	-moz-justify-content: space-between;
	-webkit-justify-content: space-between;
}
.webservice-regist__item{
	margin-left: 2rem;
	
	
	flex-grow: 1;
}
.webservice-option{
	margin: 0;
	padding: 0;
	list-style: none;
	
	font-size: .875rem;
	line-height: 1.5em;
}
.webservice-option__item{}
.webservice-regist__button{
	display: block;
	
	font-size: 1.125em;
	line-height: 1.5em;
}
.webservice-regist__button > img{
	vertical-align: middle;
	margin-right: .5em;
}
.webservice-regist__button.webservice-regist__button--regist{
	color: #5DB331;
}
.webservice-regist__button.webservice-regist__button--login{
	color: #61B7DA;
}
.webservice-regist__link{}
.webservice-navi{
	margin-top: 1em;
}
.webservice-navi__items{
	margin: 0;
	padding: 0;
	list-style: none;
	font-feature-settings : "palt";
}
.webservice-navi__item{}
.webservice-navi__button{}
.webservice-navi__button.button5--c3{
	color: #52BDE5;
}
.webservice-navi__button.button5--c3:before{
	border-color: #52BDE5;
}
.webservice-navi__button.button5--c3:after{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #52BDE5;
}
@media print, screen and (min-width: 768px){
.webservice{}
.webservice__inner{
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: flex;
	display: -o-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -webkit-flex;

	flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;

	justify-content: space-between;
	-o-justify-content: space-between;
	-ms-justify-content: space-between;
	-moz-justify-content: space-between;
	-webkit-justify-content: space-between;
}
.webservice__heading{}
.webservice__heading_lede{
	width: 373px;
}
.webservice-regist{}
.webservice-regist__items{}
.webservice-regist__item{}
.webservice-option{
	text-align: right;
}
.webservice-option__item{}
.webservice-regist__button{}
.webservice-regist__button--regist{}
.webservice-regist__button--login{}
.webservice-regist__link{
	display: block;
}
.webservice-navi{
	flex-basis: 100%;
}
.webservice-navi__items{
	
	
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: flex;
	display: -o-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -webkit-flex;

	justify-content: space-between;
	-o-justify-content: space-between;
	-ms-justify-content: space-between;
	-moz-justify-content: space-between;
	-webkit-justify-content: space-between;

	align-items: stretch;
	-o-align-items: stretch;
	-ms-align-items: stretch;
	-moz-align-items: stretch;
	-webkit-align-items: stretch;
}
.webservice-navi__item{
	margin-left: 15px;
	
	flex: 1 1 33.33%;
}
.webservice-navi__item:first-child{
	margin-left: 0;
}
.webservice-navi__button{}
}
@media only screen and (max-width: 767px){
.webservice{}
.webservice__inner{}
.webservice__heading{
	text-align: center;
}
.webservice__heading_lede{
	max-width: 373px;
	margin-left: auto;
	margin-right: auto;
}
.webservice-regist{
	margin-top: 1em;
}
.webservice-regist__items{}
.webservice-regist__item{}
.webservice-option{
	text-align: center;
}
.webservice-option__item{}
.webservice-regist__button{}
.webservice-regist__button--regist{}
.webservice-regist__button--login{}
.webservice-regist__link{}
.webservice-navi{}
.webservice-navi__items{
	border-top: 2px solid #fff;
}
.webservice-navi__item{
	border-style: solid;
	border-color: #fff;
	border-width: 0 2px 2px 2px;
}
.webservice-navi__button{
	border: 0 none;
}
}





/* kips card lineup */
.card{}
.card__heading{}
.card__inner{}
.card__lineup{}
.card-item{}
.card-item__photo{
	margin-bottom: .5rem;
	filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.6));
}
_:-ms-lang(x)::-ms-backdrop, .card-item__photo {
	max-height: 110px;/* IE11 ハック */
}
.card_item__heading{
	font-size: 1.125em;
	font-weight: bold;
}
.card-item__note{}
.card-item__more{}
.card__application{}
.card-about{}
.card-about__heading{
	margin: 0;
	padding: .625rem;
	color: #fff;
	background-color: #5DB431;
	
	
	font-size: 1.125em;
	font-weight: bold;
}
.card-about__logo{
	display: inline-block;
	vertical-align: middle;
	width: 91px;
}
.card-about__logo_kips{
	width: 100%;
}
.card-about__logo_note{
	display: inline-block;
	vertical-align: middle;
}
.card-about__navs{
	margin: 0;
	padding: 1em;
	list-style: none;
}
.card-about__nav{}
@media print, screen and (min-width: 768px){
.card{}
.card__heading{
	text-align: left;
}
.card__inner{
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: 					flex;
	display: 					-o-flex;
	display: 					-ms-flex;
	display: 					-moz-flex;
	display: 					-webkit-flex;
	justify-content: 			space-between;
	-o-justify-content: 		space-between;
	-ms-justify-content: 		space-between;
	-moz-justify-content: 		space-between;
	-webkit-justify-content: 	space-between;
}
.card__lineup{
	margin-left: -15px;
	
	flex-basis: 673px;
	-o-flex-basis: 673px;
	-ms-flex-basis: 673px;
	-moz-flex-basis: 673px;
	-webkit-flex-basis: 673px;
	
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: 					flex;
	display: 					-o-flex;
	display: 					-ms-flex;
	display: 					-moz-flex;
	display: 					-webkit-flex;
	justify-content: 			space-between;
	-o-justify-content: 		space-between;
	-ms-justify-content: 		space-between;
	-moz-justify-content: 		space-between;
	-webkit-justify-content: 	space-between;
}
.card-item{
	padding: 20px;
	margin-left: 15px;
	
	font-size: 0.875rem;
	line-height: 2em;
	
	flex-basis: 213px;
	-o-flex-basis: 213px;
	-ms-flex-basis: 213px;
	-moz-flex-basis: 213px;
	-webkit-flex-basis: 213px;
	
	
	display: -webkit-box;
	-webkit-box-pack: justify;
	display: 					flex;
	display: 					-o-flex;
	display: 					-ms-flex;
	display: 					-moz-flex;
	display: 					-webkit-flex;
	flex-flow: column;
	-o-flex-flow: column;
	-ms-flex-flow: column;
	-moz-flex-flow: column;
	-webkit-flex-flow: column;
	
	box-shadow: 			0px 0px 5px rgba(0,0,0,.5);
	-o-box-shadow: 			0px 0px 5px rgba(0,0,0,.5);
	-ms-box-shadow: 		0px 0px 5px rgba(0,0,0,.5);
	-moz-box-shadow: 		0px 0px 5px rgba(0,0,0,.5);
	-webkit-box-shadow: 	0px 0px 5px rgba(0,0,0,.5);
	
	box-sizing: 		border-box;
	-o-box-sizing: 		border-box;
	-ms-box-sizing: 	border-box;
	-moz-box-sizing: 	border-box;
	-webkit-box-sizing: border-box;
}
.card-item__photo{}
.card_item__heading{
	margin: 0;
	padding: 0;
}
.card-about__logo{}
.card-about__logo_kips{}
.card-item__note{
	margin: 0 0 1em 0;
	padding: 0;
}
.card-item__more{
	margin-top: auto;
	margin-left: -20px;
	margin-right: -20px;
	margin-bottom: -20px;
}
.card__application{
	display: none;
}
.card-about{
	border: 2px solid #5DB431;
	
	background: url(../img/index/card-about__bg.png) no-repeat right top;
	background-size: contain;
	
	flex-basis: 305px;
	-o-flex-basis: 305px;
	-ms-flex-basis: 305px;
	-moz-flex-basis: 305px;
	-webkit-flex-basis: 305px;
}
.card-about__heading{}
.card-about__navs{
	
}
.card-about__nav{}
}
@media only screen and (max-width: 767px){
.card{}
.card__heading{}
.card__inner{}
.card__lineup{
	margin-left: -3.90625%;
	margin-bottom: 2rem;
	
	/*-----for legacy-----*/
	display: -webkit-box;
	-webkit-box-pack: justify;
	/*-----for legacy-----*/
	display: 					flex;
	display: 					-o-flex;
	display: 					-ms-flex;
	display: 					-moz-flex;
	display: 					-webkit-flex;
	
	flex-wrap: 					nowrap;
	-o-flex-wrap: 				nowrap;
	-ms-flex-wrap: 				nowrap;
	-moz-flex-wrap: 			nowrap;
	-webkit-flex-wrap: 			nowrap;
	
	justify-content: 			space-between;
	-o-justify-content: 		space-between;
	-ms-justify-content: 		space-between;
	-moz-justify-content: 		space-between;
	-webkit-justify-content: 	space-between;
}
.card-item{
	margin-left: 3.90625%;
	
	
	
	
	flex: 1 1 100%;
}
.card-item__photo{}
.card_item__heading{}
.card-about__logo{
	width: 60px;
}
.card-about__logo_kips{}
.card-item__note{}
.card-item__more{
	display: none;
}
.card__application{
	margin-bottom: 2rem;
}
.card-about{}
.card-about__heading{
	text-align: center;
	margin-left: -3.90625%;
	margin-right: -3.90625%;
}

/* ▼ 2017.11.25 ▼ */
.card-about__navs{
	padding-left: 0em;
}
.card-about__nav{

	display: inline-block;
	margin-right: 1em;
}
.card-about__nav:nth-child(odd) {
}
/* ▲ 2017.11.25 ▲ */
}


/* ICOCAとPiTaPaの違い 2020.08.12  */
#icoca_or_pitapa1 {
	background: #283770;
	color: #FFF;
	padding: 10px 0 5px;
	border-radius: 5px 5px 0 0;
}
#icoca_or_pitapa2 {
	border: #283770 solid 2px;
	background: #FFFFC4;
	border-radius: 0 0 5px 5px;
}
#icoca_or_pitapa3 {
	background: #283770;
	color: #FFF;
	padding: 10px;
	border-radius: 50%;
}
#icoca_or_pitapa2 div.button2 a {
	color: #FFF;
}
@media only screen and (max-width: 767px){
	#icoca_or_pitapa2 img {
		width: 90%;
	}
}
/* ▲  2020.08.12  ▲ */



	/* ad-topics用 */

.tabs {
	position: relative;
}
.tab_item {
	position: absolute;
	left: 50%;
	height: 40px;
	text-align: center;
	background-color: #ECECEC;
	line-height: 45px;
	text-align: center;
	color: #DA340A;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
}
@media print, screen and (min-width: 768px){
	.tab_item { width: 500px;}
	.tab_item1 {transform: translateX(-500px);}
	.tab_item2 {transform: translateX(0px);}
}
@media only screen and (max-width: 767px){
	.tab_item { width: 50%;}
	.tab_item1 {transform: translateX(-100%);}
	.tab_item2 {transform: translateX(0px);}
}
.tab_item:hover {
	opacity: 0.6;
}

input[name="tab_item"] { /*ラジオボタン消す*/
	display: none;
}

.tab_content { /*タブの中身*/
	display: none;
	padding: 60px 0 15px 0;
	clear: both;
	overflow: hidden;
}

.tab_content_anime {
	opacity:0;
	animation-name:tab_content_anime;
	animation-duration:.75s; 
	animation-fill-mode: forwards;
}
@keyframes tab_content_anime {
	0% {
		opacity: 0;
		transform: translateY(30px);
	}
	100% {
		opacity:1;
		transform: translateY(0px);
	}
}
#kipstopics:checked ~ #kipstopics_content, #newshop:checked ~ #newshop_content {
	display: block;
}
.tabs input:checked + .tab_item {
	background-color: #DA340A;
	color: #fff;
	height: 50px;
	margin-top: -10px;
	line-height: 55px;
}
.tabs hr {
	border-top: 2px solid #DA340A;
	transform: translateY(40px);
}



















@media print, screen and (min-width: 768px){}
@media only screen and (max-width: 767px){}