@charset "shift-jis";

body{
	font-size:small;
    left:5px;
    -webkit-text-size-adjust : none;
    word-wrap:break-word;
}


* { margin : 0 ; padding : 0 ; }

img {
    border-style:none;
    -webkit-box-shadow: 1px 1px 3px #999;
}

.twitter-share-button{
	-webkit-box-shadow: 0px 0px 0px #fff;
}

a:link{color: #111111;}
a:visited{color: #111111;}
a:hover{color: #111111;}

#my_topheader2 a:link{color: #ffffff;}
#my_topheader2 a:visited{color: #ffffff;}
#my_topheader2 a:hover{color: #ffffff;}



.no-shadow{
	-webkit-box-shadow: 0px 0px 0px #fff !important;
	-moz-box-shadow: 0px 0px 0px #fff !important;
}

.topreflect{
	-webkit-box-reflect: below -10px -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0) 30%,rgba(0,0,0,0.5));
}

.topreflect2{
	-webkit-box-reflect:below -10px url(image/reflect3.png);
}


#my_topheader {
	background-color: #4169E1;
	color:#ffffff;
	line-height:25px;
    padding:13px 0 5px 0;
    border-color: #808080;
    border-bottom: solid 1px #808080;
    font-weight: 700;
    font-size: 19px;

    text-align:center;
    text-shadow: 1px 1px 2px #000;
    letter-spacing:1px;

    background-image: -moz-linear-gradient(top, #5ACEF5, #0C72CC);
    background-image: -ms-linear-gradient(top, #5ACEF5, #0C72CC);
    background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.05, #0C72CC),
	color-stop(0.57, #219CE8),
	color-stop(0.75, #2EB5E6),
	color-stop(0.96, #5ACEF5)
	);
}

#my_topheader img{
	max-width:93%;
}

#my_topheader2 {
	background-color: #C0C0C0;

	line-height:25px;
    padding:5px 0 5px 7px;
    text-shadow: 1px 1px 1px #000;
       border-color: #808080;
       border-bottom: solid 1px #808080;

     font-weight: 700;
     font-size: medium;

     background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.39, rgb(230,230,230)),
	color-stop(0.72, rgb(245,245,245)),
	color-stop(0.93, rgb(255,255,255))
	);
	background-image: -ms-linear-gradient(bottom, #E5E6E6 0%, #FFFFFF 100%);
	background-image: -moz-linear-gradient(bottom, #E5E6E6 0%, #FFFFFF 100%);

}

#my_topheader2 a{
	    text-decoration: none;
}


#my_header {
	 background-color: #4169E1;
	 color:#ffffff;
	 line-height:25px;
	 padding:8px 0 8px 0;
     border-bottom: solid 1px #808080;
     font-weight: 700;
     font-size: medium;
     text-align:center;
     text-shadow: 1px 1px 1px #000;

     background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.41, #000E47),
	color-stop(0.71, #002175),
	color-stop(0.86, #0023A3)
	);
	background-image: -ms-linear-gradient(bottom, #000E47 0%, #0023A3 100%);
	background-image: -moz-linear-gradient(bottom, #000E47 0%, #0023A3 100%);
}

/* special/pvp.php */
#my_header-pvp {
	 background-color: #4169E1;
	 color:#ffffff;
	 line-height:25px;
	 padding:9px 0 7px 0;
     border-bottom: solid 1px #808080;
     font-weight: 700;
     font-size: medium;
     text-align:center;
     text-shadow: 1px 1px 1px #520004;

    background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.29, #B30000),
	color-stop(1, #D71B1B),
	color-stop(1, #ED2F2F)
	);
	background-image: -ms-linear-gradient(bottom, #B30000 0%, #ED2F2F 100%);
  background-image: -moz-linear-gradient(bottom, #B30000 0%, #ED2F2F 100%);
}

#my_header-asobimo {
	 background-color: #4169E1;
	 color:#111111;
	 line-height:25px;
	 padding:9px 0 7px 0;
     border-bottom: solid 1px #808080;
     font-weight: 700;
     font-size: 17px;
     text-align:center;
     text-shadow: 1px 1px 1px #7A7A7A;


background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.19, #FCB500),
	color-stop(0.6, #FCCA35),
	color-stop(0.8, #FFD940)
 );
 background-image: -ms-linear-gradient(bottom, #FCB500 0%, #FFD940 100%);
 background-image: -moz-linear-gradient(bottom, #FCB500 0%, #FFD940 100%);
}


#my_header-view {
	 background-color: #000000;
	 color:#ffffff;
	 padding:0 5px 0 5px;
	 padding:8px 0 8px 0;
	 line-height:25px;
     border-bottom: solid 1px #808080;
     font-weight: 700;
     font-size: medium;
     text-align:center;
     text-shadow: 1px 1px 1px #000;

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.31, #000000),
	color-stop(0.6, #0F0F0F),
	color-stop(0.83, #292929)
  );
}

#my_header-news {
	 background-color: #ffffff;
	 color:#000000;
	 padding:30px 10px 0px 10px;
	 line-height:25px;
     border-bottom: solid 1px #dddddd;
     border-width: 3px;
     font-weight: 900;
     font-size: 25px;
     text-align:left;
  /*   text-shadow: 1px 1px 1px #888888;   */


}

.my-date-small{
	font-size:11px;
	color:#777777;
	text-align: left;
	text-shadow: none;
	font-weight:100;
	padding:27px 0 0 0;
}


#my_footer {
	background-color: #808080;

    clear : both ;
    text-align: center;
    color: #ffffff;
    font-size: 12px;
     line-height: 2;
     border-top: solid 1px #808080;
     border-bottom: solid 1px #808080;


  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.41, rgb(161,161,161)),
    color-stop(0.7, rgb(194,194,194)),
    color-stop(0.91, rgb(214,214,214))
  );

}

 /*************************
icon 60pxに
*************************/
.myresize60{
	width:90%;
    text-align: center;
	margin:0px auto;
}

.myresize60 img{
	 border-radius: 10px;
	 -webkit-box-shadow:1px 1px 3px #999;
}

.myresize60 td{
	text-align:center;
	width:100px;
}

.myresize60 img{
	 height:60px;
     width:60px;
}

.myresize60-wpp-list td{
	text-align:center;
	width:100px;
}

.myresize60-wpp-list img{
	height:60px;
	width:60px;
}


 /*************************
icon 100pxに
*************************/
.myresize100{
	text-align: center;
	margin:0px auto;
}

.myresize100 img {
	 border-radius: 10px;
}

.myresize100 td{
	text-align:center;
	width:100px;
}


.myresize100 img{
    height:100px;
    width:100px;

}

table.table10 {
	width:100%;
}



 /*************************
table スペース空け
*************************/

.mytable1{
	border-collapse:separate;
	border-spacing:0px 30px;
}

.mytable2{
	border-collapse:separate;
	border-spacing:0px 4px;
}


 /*************************
左側　少バナー広告　
*************************/
.myleft{
    float: left;
    padding:6px 6px 3px 0px;
}

.myleft img{
    height:60px;
    width:60px;
    -webkit-box-shadow: 1px 1px 3px #999;
    box-shadow: 1px 1px 3px #999;
}

.myleft-paddi{
    float: left;
    padding:6px 2px 0px 0px;
}

.myleft-paddi img{
    height:60px;
    width:60px;
    -webkit-box-shadow: 1px 1px 3px #999;
    box-shadow: 1px 1px 3px #999;
    margin:0 4px 2px 0;
}

.myleft-big{
    float: left;
    padding:6px 6px 3px 0px;
}

.myleft-big img{
    height:80px;
    width:80px;
    -webkit-box-shadow: 1px 1px 3px #999;
    box-shadow: 1px 1px 3px #999;
}

.myleft2{
    float: left;
    padding:6px 6px 3px 0px;
}

.myleft2 img{
    height:60px;
    width:60px;
    -webkit-box-shadow: 0px 0px 0px #fff;
}

.myleft2-paddi{
    float: left;
    padding:6px 2px 0px 0px;
}

.myleft2-paddi img{
    height:60px;
    width:60px;
     -webkit-box-shadow: 0px 0px 0px #fff;
    margin:0 4px 2px 0;
}

.myleft2-big{
    float: left;
    padding:6px 3px 3px 0px;
}

.myleft2-big img{
    height:80px;
    width:80px;
    -webkit-box-shadow: 0px 0px 0px #fff;
}



 /*************************
TOP テキスト広告 padding
*************************/
.mylink a{
	font-size: small;
	 text-decoration: none;
		display: block;
	padding: 20px 24px 20px 3px;
    position: relative;
	 height:5px;
}

.mylink-balance a{
	font-size: small;
	 text-decoration: none;
		display: block;
	padding: 12px 24px 20px 3px;
    position: relative;
	 height:5px;
	 line-height:16px;
}

.mylink-thin a{
	font-size: small;
	 text-decoration: none;
		display: block;
	padding: 12px 24px 20px 3px;
    position: relative;
	 height:5px	;
	 font-weight:100;
	 line-height:16px;
}

.mylink-mottomiru a{
	font-size: small;
	 text-decoration: none;
		display: block;
	padding: 22px 24px 18px 3px;
    position: relative;
	 height:15px
}


 /*************************
TOP 詳細ページへのリンク padding
*************************/
.mydetaillink a{
	font-size: small;
	 text-decoration: none;
		display: block;
	padding: 15px 5px 15px 5px;
}


 /*************************
対応機種
*************************/
.mymodel{
	font-size:10px;
	font-weight:300;
	padding:0 0 0 0;
	color:#666666;
}

.myshadow img{
    box-shadow: 1px 1px 3px #999;
}

.mysmall{
	font-size:12px;
}

.mydash{
	border-width:1px;
	 border-style:dashed none none none;
	border-color:#999999;
}

.mypadding{
    padding:0px 5px 0px 5px;
    line-height:20px;
    font-size:13px;
}

.mypadding2{
    padding:0px 7px 0px 7px;
    line-height:22px;
    font-size:14px;
    color:#333333;
}

.mypadding2 img{
	-webkit-box-shadow: 1px 1px 3px #999;
}

.mypadding3{
    padding:0px 10px 0px 10px;
    line-height:22px;
    font-size:14px;
    color:#333333;
}

/* 画像影　薄め　mypadding2より   */
.mypadding4{
    padding:0px 10px 0px 10px;
    line-height:22px;
    font-size:14px;
    color:#333333;
}

.mypadding4 img{
	-webkit-box-shadow: 1px 1px 3px #999;
}



.mystart-wrapper-all{                              /* ゲームスタート 囲む  */
	margin:37px 0 0 0;
}

.mystart-wrapper-2{                              /* ゲームスタート 2つ目囲む　App Storeへのリンク  */
	margin:28px 0 1px 0;
}


.mystart{                              /* ゲームスタート  */
	font-size:large;
	color: #DC143C;
	text-align: center;
	text-shadow: 1px 1px 1px #993333;
	margin-top:10px;
}

.mystart-view{                              /* ゲームスタート  */
	font-size:large;
	color: #DC143C;
	text-align: center;
	text-shadow: 1px 1px 1px #993333;
	margin-top:10px;
}

.mystart-title {
	font-size:17px;
	font-weight:bold;
	-moz-border-radius:16px;
	-webkit-border-radius:16px;
	border-radius:16px;
	border:1px solid #ffaa22;
	padding:8px 18px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ffec64 5%, #ffab23 100% );
	background:-ms-linear-gradient( top, #ffec64 5%, #ffab23 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffec64), color-stop(100%, #ffab23) );
	background-color:#ffec64;
	color:#333333;
	display:inline-block;
	text-shadow:0px 1px 0px #ffee66;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #fff6af;
 	-moz-box-shadow:inset 1px 1px 0px 0px #fff6af;
 	box-shadow:inset 1px 1px 0px 0px #fff6af;
}.mystart-title:hover {

}.mystart-title:active {
	position:relative;
	top:1px;
}
/* This css button was generated by css-button-generator.com */

.mystart-title {
	width:70%;
	max-width:270px;
	margin: 0 auto 0px auto;
	text-align: center;
	display:block;
	box-shadow: 0px 2px 3px #cc3300;
}

.mystart-title a {
	text-decoration: none;
}

.mystart-title a:link{color: #333333; !important}
.mystart-title a:visited{color: #333333; !important}
.mystart-title a:hover{color: #333333; !important}


/*
.mystart-title{
	font-size:medium;
	text-align: center;
	margin:0 0 10px 0;
}
*/


.caption1{
	 background-color:#ADFF2F;
	 color:#ffffff;
	 line-height:25px;
     border-color: #808080;
     border: solid 1px #ccc;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:center;
  text-shadow: 1px 1px 1px #004016;

   background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.2, #008A15),
	color-stop(0.6, #00BA09),
	color-stop(0.8, #00D90B)
   );
   background-image: -ms-linear-gradient(bottom, #008A15 0%, #00D90B 100%);
   background-image: -moz-linear-gradient(bottom, #008A15 0%, #00D90B 100%);

}


.caption2{
	 background-color:#800000;
	 color:#ffffff;
	 line-height:25px;
     margin:22px 0 10px 0;
     border-color: #808080;
     border: solid 1px #ccc;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:center;
     text-shadow: 1px 1px 1px #4F0000;


   background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.2, #590000),
	color-stop(0.56, #871900),
	color-stop(0.81, #B31402)
   );
   background-image: -ms-linear-gradient(bottom, #590000 0%, #B31402 100%);
   background-image: -moz-linear-gradient(bottom, #590000 0%, #B31402 100%);

}

.caption-movie{                          /* プロモーションムービー caption2と同じ i-mmorpg.comと揃えるために */
	 background-color:#800000;
	 color:#ffffff;
	 line-height:25px;
     margin:22px 0 10px 0;
     border-color: #808080;
     border: solid 1px #ccc;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:center;
     text-shadow: 1px 1px 1px #4F0000;


   background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.2, #590000),
	color-stop(0.56, #871900),
	color-stop(0.81, #B31402)
   );
   background-image: -ms-linear-gradient(bottom, #590000 0%, #B31402 100%);
   background-image: -moz-linear-gradient(bottom, #590000 0%, #B31402 100%);

}




.caption3{                            /* specialページの見出しとか */
	 background-color:#ADFF2F;
	 color:#ffffff;
	 line-height:20px;
	 padding:4px 0 4px 0;
     border-color: #808080;
     border: solid 1px #ccc;
     padding-left:10px;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:left;
     text-shadow: 1px 1px 1px #004016;

   background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.2, #008A15),
	color-stop(0.6, #00BA09),
	color-stop(0.8, #00D90B)
   );
   background-image: -ms-linear-gradient(bottom, #008A15 0%, #00D90B 100%);
   background-image: -moz-linear-gradient(bottom, #008A15 0%, #00D90B 100%);
}

.caption-test{                            /* 特徴別ページに */
	 background-color: #ffcc00;
	 color:#ffffff;
	 line-height:20px;
	 padding:4px 0 4px 0;
     border-color: #808080;
     border: solid 1px #ccc;
     padding-left:10px;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:left;
     text-shadow: 1px 1px 1px #57500D;

   background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.19, #FCB500),
	color-stop(0.6, #FCCA35),
	color-stop(0.8, #FFD940)
 );
 background-image: -ms-linear-gradient(bottom, #FCB500 0%, #FFD940 100%);
 background-image: -moz-linear-gradient(bottom, #FCB500 0%, #FFD940 100%);
}

.caption-review{                    /* 詳細ページ「レビュー」に */
	 background-color:#0000CD;
	 color:#ffffff;
	 line-height:25px;
     border-color: #808080;
     border: solid 1px #ccc;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:center;
  text-shadow: 1px 1px 1px #004016;

background-image: -ms-linear-gradient(top, #0FC7FF 0%, #2C9EEB 100%);

background-image: -moz-linear-gradient(top, #0FC7FF 0%, #2C9EEB 100%);

background-image: -o-linear-gradient(top, #0FC7FF 0%, #2C9EEB 100%);

background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #0FC7FF), color-stop(100, #2C9EEB));

background-image: -webkit-linear-gradient(top, #0FC7FF 0%, #2C9EEB 100%);

background-image: linear-gradient(to bottom, #0FC7FF 0%, #2C9EEB 100%);



}


.caption-asobimo{                            /* special/asobimo.phpページの見出しとか */
	 background-color: #ffcc00;
	 color:#ffffff;
	 line-height:20px;
	 padding:4px 0 4px 0;
     border-color: #808080;
     border: solid 1px #ccc;
     padding-left:10px;
     font-size:14px;
     font-weight:600;
     border-radius: 5px;
     text-align:left;
     text-shadow: 1px 1px 1px #57500D;

   background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.19, #FCB500),
	color-stop(0.6, #FCCA35),
	color-stop(0.8, #FFD940)
 );
 background-image: -ms-linear-gradient(bottom, #FCB500 0%, #FFD940 100%);
 background-image: -moz-linear-gradient(bottom, #FCB500 0%, #FFD940 100%);
}


.mymarquee{
	overflow-x: -webkit-marquee;
	width:320px;
	white-space: nowrap;
	line-height:22px;
    font-size:14px;
    color:#333333;
}

.mycprt{
	text-align: center;
	padding:18px 0 3px 0;
}

.mypink{
	color:#FF1493;
}

.mypink-words{
	color:#FF1493;
	font-size:16px;
	font-weight:700;
}

.myred{
	color:#DC143C;
}

.myred2{
	color:#DC143C;
	font-weight:700;
}

.myred3{
	font-weight:700;
	font-size:x-large;
	color:#DC143C;
}



.myorange{
	color:#ff6600;
}

.myyellow{
	color:#FFAB00;
}

.mygreen{
	color:#3cb371;
}

.mygray{
	color:#A9A9A9;
}

.myblue{
	color:#00BFFF;
}

.myblack{
	font-weight:700;
}

.myblack1{
	font-weight:700;
	font-size:large;
}

.myblack2{
	font-weight:700;
	font-size:x-large;
}

.myblack3{
	font-weight:700;
	font-size:xx-large;
}

.my-padding-bottom1{
	padding:0 0 10px 0;
}

 /*************************
ヘコみ線
*************************/

.myline1{
	border-bottom:1px solid rgba(0,0,0,.1);
}

.myline2{
	border-bottom:3px solid rgba(250,250,250,1);
}


 /*************************
画像にリボン
*************************/

/* 大きめ画像に */
.picframe {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */

}
.picframe:after {
	opacity: 0.8;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: auto;
	background: red;
	content: "New";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 400;
	font-size:15px;
	padding: 5px 10px;
	left: -30px;
	top: 3px;
	text-shadow: 1px 1px 1px #aaaaaa;
	-webkit-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}

/*

    padding: 3px 1px 2px 1px;
	left: -35px;
	top: 7px;

	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;

	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
*/


/* でかい画像に　人気*/
.picframe-ninki-big {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */

}
.picframe-ninki-big:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 140px;
	height: auto;
	background: red;
	content: "人気";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 400;
	font-size:15px;
	padding: 5px 10px;
	left: -40px;
	top: 7px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

	background-image: -ms-linear-gradient(top, #E80000, #A80000);
	background-image: -moz-linear-gradient(top, #E80000, #A80000);

	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.31, #E80000),
	color-stop(0.42, #DE0000),
	color-stop(0.75, #A80000));
}


/* でかい画像に　新作*/
.picframe-new-big {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */

}
.picframe-new-big:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 140px;
	height: auto;
	background: red;
	content: "新作";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 400;
	font-size:15px;
	padding: 5px 10px;
	left: -40px;
	top: 7px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

	background-image: -ms-linear-gradient(top, #E80000, #A80000);
	background-image: -moz-linear-gradient(top, #E80000, #A80000);

	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.31, #E80000),
	color-stop(0.42, #DE0000),
	color-stop(0.75, #A80000));
}


/* でかい画像に　βテスト*/
.picframe-test-big {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */

}
.picframe-test-big:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 140px;
	height: auto;
	background: red;
	content: "βテスト";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 400;
	font-size:15px;
	padding: 5px 10px;
	left: -40px;
	top: 7px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

	background-image: -ms-linear-gradient(top, #E80000, #A80000);
	background-image: -moz-linear-gradient(top, #E80000, #A80000);

	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.31, #E80000),
	color-stop(0.42, #DE0000),
	color-stop(0.75, #A80000));
}


/* 60x60　人気*/
.picframe-ninki {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-ninki:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: red;
	content: "人気";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

	background-image: -ms-linear-gradient(top, #E80000, #A80000);
	background-image: -moz-linear-gradient(top, #E80000, #A80000);

	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.31, #E80000),
	color-stop(0.42, #DE0000),
	color-stop(0.75, #A80000));
}


/* 60x60　NEW*/
.picframe-new {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-new:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: red;
	content: "新作";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

	background-image: -ms-linear-gradient(top, #E80000, #A80000);
	background-image: -moz-linear-gradient(top, #E80000, #A80000);

	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.31, #E80000),
	color-stop(0.42, #DE0000),
	color-stop(0.75, #A80000));
}

/* 60x60　注目 */
.picframe-chumoku {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-chumoku:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: red;
	content: "注目";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

	background-image: -ms-linear-gradient(top, #E80000, #A80000);
	background-image: -moz-linear-gradient(top, #E80000, #A80000);

	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.31, #E80000),
	color-stop(0.42, #DE0000),
	color-stop(0.75, #A80000));
}



/* 60x60　注目 */
.picframe-chumoku2 {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-chumoku2:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: red;
	content: "注目";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #555555;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);


	background: rgb(255,225,116);
background: linear-gradient(180deg, rgba(255,225,116,1) 0%, rgba(255,189,43,1) 50%, rgba(241,149,0,1) 100%, rgba(255,124,0,1) 100%);

}


/* 60x60　事前*/
.picframe-jizen {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-jizen:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: #0044ff;
	content: "事前";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #005059;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #4DE0F0),
	color-stop(1, #008594)
);
background-image: -o-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: -moz-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: -ms-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: linear-gradient(to bottom, #4DE0F0 0%, #008594 100%);

}


/* 60x60　cbt*/
.picframe-cbt {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-cbt:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: #0044ff;
	content: "CBT";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #005059;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #4DE0F0),
	color-stop(1, #008594)
);
background-image: -o-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: -moz-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: -ms-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: linear-gradient(to bottom, #4DE0F0 0%, #008594 100%);

}

/* 60x60 opne b test*/
.picframe-obt {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-obt:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: #0044ff;
	content: "OBT";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #005059;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);

background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #4DE0F0),
	color-stop(1, #008594)
);
background-image: -o-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: -moz-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: -ms-linear-gradient(bottom, #4DE0F0 0%, #008594 100%);
background-image: linear-gradient(to bottom, #4DE0F0 0%, #008594 100%);

}


/* 60x60　PR*/
.picframe-pr {
	position: relative;
	display: inline-block;
	overflow: hidden; /* 不要部分を消す */
}
.picframe-pr:after {
	opacity: 1;
	position: absolute;
	z-index: 1;
	width: 100px;
	height: 10px;
	background: black;
	content: "PR";	/* 表示するテキスト */
	text-align: center;
	color: #fff;
	font-weight: 100;
	font-size:11px;
	padding: 2px 1px 2px 1px;
	left: -37px;
	top: 4px;
	text-shadow: 1px 1px 1px #999999;
	-webkit-transform: rotate(-38deg);
	-ms-transform: rotate(-38deg);
    -moz-transform: rotate(-38deg);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-ms-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}





  /*************************
カラー
*************************/

.orange-title{
    color: #ff6600;
    font-weight: bold;
    font-size:x-large;
}

.red-title{
    color: #DC143C;
    font-weight: bold;
    font-size:x-large;
}

.skyblue-title{
    color: #00BFFF;
    font-weight: bold;
    font-size:x-large;
}

.blue-title{
    color: #003399;
    font-weight:bold;
    font-size:x-large;
}

.pink-title{
    color: #FF1493;
    font-weight: bold;
    font-size:x-large;
}

.gray-title{
    color: #363636;
    font-weight: bold;
    font-size:x-large;
}

.green-title{
    color: #9ACD32;
    font-weight: bold;
    font-size:x-large;
}

.black-title{
	color: #000000;
    font-weight: bold;
    font-size:x-large;
}



  /*************************
ナビゲーション
*************************/
.navi {
	text-align: center;
	font-size: 18px;
	line-height:25px;
	margin:0 3px 0 3px;
}
.navi li {
	display: inline;
}


.navi .thispage {
	display: -moz-inline-box;
	display: inline-block;
	padding: 1px 13px 1px;
	background: #ffffff;
	color:#A9A9A9;
}

.navi li a {
	display: -moz-inline-box;
	display: inline-block;
	padding: 1px 13px 1px;
	text-shadow: 1px 1px 2px #aaa;
	text-decoration: none;

}


.navi li.myprev a {
	display: -moz-inline-box;
	display: inline-block;
	padding: 2px 4px 2px 0px;
}

.navi li.mynext a {
	display: -moz-inline-box;
	display: inline-block;
	padding: 2px 0px 2px 4px;
}



/* リンク  */
.myfooterlink{
	margin:0px 0px 0px 10px;
	 font-size: small;
	 line-height:30px;
}

.myfooterlink a{
	margin:0px 2px 0px 2px;
}

.adad{
	text-align:center;
	margin-bottom:0px;
}

.adad320{
	margin: 0px auto;
	text-align:center;
	margin-bottom:0px;
}

.adad320 img{
	width:320px;
}

.adad300{
	margin: 0px auto;
	text-align:center;
	margin-bottom:0px;
}

.adad300 img{
	width:300px;
}

.mybig{
	font-size:18px;
	font-weight:700;
}

.myunder{
	text-align:center;
	margin-bottom:-29px;
}


  /*************************
bxslider
*************************/

.bxslider img{
	display:none;
}


  /*************************
YOUTUBE サイズ調整等
*************************/
.video-container {
    position: relative;
    width:100%;
    padding-top: 56.25%;
    height: 0;
    overflow: hidden;
    -webkit-box-shadow: 2px 2px 6px #000;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.video-wrapper {
	width: 560px;
	max-width: 100%;
    margin: 0px auto;
}


  /*************************
画像サイズ可変　詳細ページ
*************************/
.resizeimage{
	max-width: 460px;
	margin: 0px auto;
	text-align:center;
	line-height:16px;
}

.resizeimage img{
	width: 100%;
}

.resizeimage-bottom{
	max-width: 460px;
	margin: 0px auto;
	text-align:center;
	line-height:16px;
}

.resizeimage-bottom img{
	width: 80%;
}

.resizeimage-tate{
	max-width: 300px;
	margin: 0px auto;
	text-align:center;
	line-height:16px;
}

.resizeimage-tate img{
	width: 100%;
}

  /*************************
トップページ小さいバナー
*************************/
.mini-banner{
	max-width: 360px;
	margin: 0px auto;
	margin-bottom:2px;
	text-align:center;
}

.mini-banner img{
	max-width: 97%;
	border-radius: 5px;
	box-shadow: 1px 1px 1px #888;
}

  /*************************
ゲーム詳細ページTOP画像　画像サイズ可変　
*************************/

.resizeimage-top{
	max-width: 460px;
	margin: 0px auto;
	text-align:center;
}

.resizeimage-top img{
	width: auto;
	max-width:100%;
	max-height:700px;
}

/* special/asobimo.phpで使ってる　*/
.resizeimage-middle{
	max-width: 410px;
	margin: 0px auto;
	text-align:center;
}

.resizeimage-middle img{
	width: auto;
	max-width:90%;
	max-height:700px;
}

/* special/ranking.phpで使ってる　*/
.resizeimage-middle-left{
	max-width: 410px;
}

.resizeimage-middle-left img{
	width: auto;
	max-width:90%;
	max-height:700px;
}


.resizeimage-news-top{
	max-width: 350px;
	margin: 0px auto;
	text-align:center;
}

.resizeimage-news-top img{
	width: 98%;
}


.noshadow img{
	-webkit-box-shadow: 0px 0px 0px #fff;
}


  /*************************
メニューバー　TOP
*************************/

#topmenu {
  width:100%;
  max-width:800px;
  padding:0;
  margin: 0 auto;
  list-style-type: none;
  overflow: hidden;
  line-height: 18px;
  -webkit-box-shadow: 0px 1px 2px #aaaaaa;
}
#topmenu li {
  width:16.66%;
  float:left;
  padding:0;
  margin:0;
  margin-left: -1px;
  text-align:center;
  border-left:1px solid #eeeeee;
  border-top:1px solid #eeeeee;
  border-bottom:1px solid #eeeeee;


}
#topmenu li a {
  width:auto;
  color:#000000;
  font-size:14px;
  font-weight:300;
  padding:10px 0;
  text-decoration:none;
  display:block;
  background:#ffffff;

  background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #F0F0F0)
	);
	background-image:-moz-linear-gradient(bottom, #F0F0F0 0%, #ffffff 100%);
   background-image:-ms-linear-gradient(bottom, #F0F0F0 0%, #ffffff 100%);

  text-shadow: 1px 1px 1px #888;

}
#topmenu li a:hover {
  background:#dddddd;
}

  /*************************
画像にテキスト重ねる2
*************************/
.pic-text2{
    position:relative;
    max-width: 358px;
    margin: 0px auto;
    text-align:center;
    line-height:16px;
}

.pic-text2 span{
    position:absolute;
    margin: 0px auto;
    text-align:left;
    bottom:0px;
    left:0px;
    max-width:360px;
    font-size: .85em;
    font-weight:bold;
    font-family: Arial;
    padding:6px 10px 4px 10px;
    color:#ffffff;
    text-shadow: 1px 1px 1px #000000;
/*    line-height:250%; */
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.pic-text2 img{
/*    max-width: 350px; */
    max-width: 97%;
	border-radius: 5px;
	box-shadow: 1px 1px 1px #888;
	margin: 0px auto;
	text-align:center;
}

  /*************************
footer-list を囲む
*************************/
.footer-menu-wrapper{
	margin:30px 0 55px 0;
}


  /*************************
footer-list を囲む
*************************/
.footer-menu-wrapper2{
	margin:20px 0 55px 0;
}


  /*************************
twitter 埋め込み　設定
*************************/
.twitter-timeline{
	height:370px!important;
}

.my-twitter{
	margin: 0 auto;
	text-align: center;
}


/*************************
WordPress Popular Posts
*************************/

.wpp-list a{
  text-decoration: none;
}

.wpp-list li {
  clear: both;
  position: relative;
  overflow: hidden;
  margin: 6px 5px 6px 3px;
  font-weight: bold;
}

.wpp-thumbnail {
  display: inline;
  float: left;
  margin: 5px 5px 5px 2px;
  border-radius: 10px;
}

.mycenter {
	text-align: center;
}





/*************************
kattene css
*************************/


.kattene {
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  padding: 10px;
  padding-bottom: 5px;
  margin-bottom: 1em;
  box-sizing: border-box; }

.kattene div{
  margin: 0;
}

.kattene__imgpart {
  text-align: center; }

  .kattene__imgpart img {
    -webkit-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    -o-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    -ms-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    margin: 0;
    width:180px;}


.kattene__description {
  font-size: 0.8em; }

.kattene .kattene__btns {
  width: 100%;
  margin-top: 0.5em; }

  .kattene__btns:after {
    display: block;
    clear: both;
    height: 0px;
    visibility: hidden;
    content: "."; }

  .kattene__btns > div {
    float: left;
    margin-bottom: 5px; }

  .kattene__btns .kattene__btn {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
   }

  .kattene__btns.__three > div {
    width: 32.66667%; }

    .kattene__btns.__three > div:not(:last-child) {
      margin-right: 1%; }

  .kattene__btns.__two > div {
    width: 49.5%; }

    .kattene__btns.__two > div:nth-child(odd) {
      margin-right: 1%; }

@media screen and (max-width: 900px) {
  .kattene__imgpart {
    padding-bottom: 1em; }
  .kattene .kattene__btns {
    margin-top: 0.5em; }
  .kattene__btns.__five > div {
  width: 49.5%; }
  .kattene__btns.__five > div:nth-child(odd) {
    margin-right: 1%; }
  .kattene__btns.__five > div:last-child {
    margin-right: 0;
    float: right; }

  .kattene__btns.__four > div {
    width: 49.5%; }

    .kattene__btns.__four > div:nth-child(odd) {
      margin-right: 1%; }

  .kattene__btns.__one > div {
    width: 50%;
    margin-left: 25%; } }
@media screen and (min-width: 901px) {

  .kattene {
    display: table;
    width: 100%; }

  .kattene__imgpart {
    display: table-cell;
    width: 20%;
    padding-bottom: 5px;
  }

  .kattene__infopart {
    display: table-cell;
    vertical-align: top;
    position: relative;
    padding-left: 10px;
    width: 80%; }

  .kattene .kattene__description {
    margin-bottom: 4em;
  }

  .kattene__btns {
    position: absolute;
    bottom: 0;
    box-sizing: border-box;
    padding-right: 10px; }

  .kattene__btns.__five > div {
    width: 19.2%; }

    .kattene__btns.__five > div:not(:last-child) {
      margin-right: 1%; }

    .kattene__btns.__four > div {
      width: 24.25%; }

      .kattene__btns.__four > div:not(:last-child) {
        margin-right: 1%; }

    .kattene__btns.__two > div {
      width: 49.5%; }

      .kattene__btns.__two > div:not(:last-child) {
        margin-right: 1%; }

    .kattene__btns.__one > div {
      width: 49.5%;
      float: right; } }

.kattene .kattene__btn {
  appearance: none;
  background-color: #54c0d1;
  border: 0;
  border-radius: 0;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 1em;
  -webkit-font-smoothing: antialiased;
  font-weight: 600;
  line-height: 1;
  padding: 0.75em 0;
  text-decoration: none;
  transition: background-color 150ms ease;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap; }

  .kattene__btn:hover, .kattene__btn:focus {
    background-color: #439aa7;
    color: #fff !important; }

  .kattene__btn:disabled {
    cursor: not-allowed;
    opacity: 0.5; }

    .kattene__btn:disabled:hover {
      background-color: #54c0d1; }

.kattene__btn.__small {
  padding: 0.55em;
  font-size: 0.9em; }

.kattene__btn.__orange {
  background-color: #FF9901;
  -webkit-box-shadow: 0 5px 0 #cc7a01;
  -moz-box-shadow: 0 5px 0 #cc7a01;
  box-shadow: 0 5px 0 #cc7a01;
  -o-box-shadow: 0 5px 0 #cc7a01;
  -ms-box-shadow: 0 5px 0 #cc7a01;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__orange:hover {
    background-color: #cc7a01; }

  .kattene__btn.__orange i {
    font-weight: bold; }

    .kattene__btn.__orange i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__blue {
  background-color: #007dcd;
  -webkit-box-shadow: 0 5px 0 #0064a4;
  -moz-box-shadow: 0 5px 0 #0064a4;
  box-shadow: 0 5px 0 #0064a4;
  -o-box-shadow: 0 5px 0 #0064a4;
  -ms-box-shadow: 0 5px 0 #0064a4;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__blue:hover {
    background-color: #0064a4; }

  .kattene__btn.__blue i {
    font-weight: bold; }

    .kattene__btn.__blue i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__red {
  background-color: #c20004;
  -webkit-box-shadow: 0 5px 0 #9b0003;
  -moz-box-shadow: 0 5px 0 #9b0003;
  box-shadow: 0 5px 0 #9b0003;
  -o-box-shadow: 0 5px 0 #9b0003;
  -ms-box-shadow: 0 5px 0 #9b0003;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__red:hover {
    background-color: #9b0003; }

  .kattene__btn.__red i {
    font-weight: bold; }

    .kattene__btn.__red i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__green {
  background-color: #0BBD80;
  -webkit-box-shadow: 0 5px 0 #099766;
  -moz-box-shadow: 0 5px 0 #099766;
  box-shadow: 0 5px 0 #099766;
  -o-box-shadow: 0 5px 0 #099766;
  -ms-box-shadow: 0 5px 0 #099766;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__green:hover {
    background-color: #099766; }

  .kattene__btn.__green i {
    font-weight: bold; }

    .kattene__btn.__green i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__pink {
  background-color: #e1325b;
  -webkit-box-shadow: 0 5px 0 #b42849;
  -moz-box-shadow: 0 5px 0 #b42849;
  box-shadow: 0 5px 0 #b42849;
  -o-box-shadow: 0 5px 0 #b42849;
  -ms-box-shadow: 0 5px 0 #b42849;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__pink:hover {
    background-color: #b42849; }

  .kattene__btn.__pink i {
    font-weight: bold; }

    .kattene__btn.__pink i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }