@charset "UTF-8";
/* CSS Document */
* {
	margin: 0;
	padding: 0;
	border: none;
	zoom: 1;
}
html {
	height: 100%;
}
html>/**/body {
	overflow: -moz-scrollbars-vertical;
}
html:first-child body {
	min-height: 100%;
	padding-bottom: 1px;
}
/*util*/
a {
	color: #f57676;
}
body {
	color: #333;
	font-size: 14px;
	line-height: 1.3em;
	height: 100%;
	overflow-x: hidden;
}
body {
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
body::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
	top: 0;
    z-index: -1;
	background: #fff;
	/*background-image: url(img/bg.svg);
	background-repeat: repeat;
	background-size: 200px;
	-webkit-animation: bgiLoop 30s linear infinite;
  	animation: bgiLoop 30s linear infinite;*/
}
@-webkit-keyframes bgiLoop {
    0% { background-position: 0 0;}
  100% { background-position: 0px -300px;}
}
@keyframes bgiLoop {
    0% { background-position: 0 0;}
  100% { background-position: 0px -300px;}
}
/*body.lock #content {
	pointer-events: none;
  transition: all .1s ease-out;
  -webkit-filter: blur(2px);
     -moz-filter: blur(2px);
      -ms-filter: blur(2px);
          filter: blur(2px);
}*/
ul {
	list-style: none;
}
label.kakin input {
  line-height: 2.25em;
}
/* フォーム部品 */
input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=number],
input[type=search],
input[type=tel],
textarea,select {
	display: inline-block;
	-webkit-appearance: none;
	   -moz-appearance: none;
	    -ms-appearance: none;
	     -o-appearance: none;
	        appearance: none;
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
	    -ms-border-radius: 0;
	     -o-border-radius: 0;
	        border-radius: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	vertical-align: middle;
	background: #ffffff;
	margin: 0;
	padding: 10px;
	border-radius: 3px;
}
input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=number],
input[type=search],
input[type=tel],
textarea {
	border: 1px solid #ddd;
}
select{
	border: 1px solid #ddd;
}
/*input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=number],
input[type=search],
input[type=tel],
textarea {
	-webkit-box-shadow: inset 1px 1px 0 #efefef;
	   -moz-box-shadow: inset 1px 1px 0 #efefef;
	    -ms-box-shadow: inset 1px 1px 0 #efefef;
	     -o-box-shadow: inset 1px 1px 0 #efefef;
	        box-shadow: inset 1px 1px 0 #efefef;
}*/
button, input, select, textarea {
  font-family : inherit;
  font-size   : 100%;
}
select {
	font-size: 1.1em;
	padding: 6px 30px 6px 10px;
	background: url(../img/common/select_arrow.png) right 50% no-repeat;
	-webkit-background-size: auto 100%;
	   -moz-background-size: auto 100%;
	    -ms-background-size: auto 100%;
	     -o-background-size: auto 100%;
	        background-size: auto 100%;
		background-color: #FFF;
}
/*
input[type=button]:active,
input[type=submit]:active,
input[type=reset]:active,
button:active {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}*/
/*
input[type=button],
input[type=submit],
input[type=reset],
button {
	display: inline-block;
	padding: 0 12px;
	text-decoration: none;
	margin: 0 auto;
	font-size: 1.1em;
	font-weight: bold;
	line-height: 2.25em;
	box-sizing: border-box;
	box-shadow: 0 2px 0 1px rgba(0,0,0,0.25);
	margin-bottom: 3px;
	position: relative;
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}*/
/*
input[type=button],
input[type=submit],
button {
	background: linear-gradient(180deg,
		#e3d837 0%,
		#e3d837 50%,
		#d1c616 50%,
		#d1c616 100%);
	color: #fff;
	text-shadow: 
    #99900c 1px 1px 0, #99900c -1px -1px 0,
    #99900c -1px 1px 0, #99900c 1px -1px 0,/
    #99900c 0px 1px 0, #99900c  0-1px 0,
    #99900c -1px 0 0, #99900c 1px 0 0;
	border: solid 2px #f6ef84;
	border-radius: 3px;
}
input[type=reset] {
	background: linear-gradient(180deg,
		#f3efe2 0%,
		#f3efe2 50%,
		#e9e1c8 50%,
		#e9e1c8 100%);
	color: #aa870e;
	text-shadow:none;
	border: solid 2px #fff;
	border-radius: 3px;
}
input[type=reset].btn_active {
	background: linear-gradient(180deg,
		#e3d837 0%,
		#e3d837 50%,
		#d1c616 50%,
		#d1c616 100%);
	color: #fff;
	text-shadow: 
    #99900c 1px 1px 0, #99900c -1px -1px 0,
    #99900c -1px 1px 0, #99900c 1px -1px 0,
    #99900c 0px 1px 0, #99900c  0-1px 0,
    #99900c -1px 0 0, #99900c 1px 0 0;
	border: solid 2px #f6ef84;
	border-radius: 3px;
}
input[type=button].btn_inactive,
input[type=submit].btn_inactive,
button.btn_inactive {
	background: linear-gradient(180deg,
		#f3efe2 0%,
		#f3efe2 50%,
		#e9e1c8 50%,
		#e9e1c8 100%);
	color: #aa870e;
	text-shadow:none;
	border: solid 2px #fff;
	border-radius: 3px;
}
input[type=button].btn_red,
input[type=submit].btn_red,
input[type=reset].btn_red,
button.btn_red {
	background: linear-gradient(180deg,
		#f78c80 0%,
		#f78c80 50%,
		#f4776a 50%,
		#f4776a 100%);
	color: #FFF;
	text-shadow:none;
	border: solid 2px #ffb1a9;
	border-radius: 3px;
}
*/
#form01 textarea {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
}
#headerinfo {
	background: #EBF8CE;
	width: 100%;
	height: 56px;
	-webkit-background-size: 100% auto;
	   -moz-background-size: 100% auto;
	    -ms-background-size: 100% auto;
	     -o-background-size: 100% auto;
	        background-size: 100% auto;
	text-align: center;
	padding: 8px 0 8px 0;
	background-repeat: no-repeat;
}
.title_big {
	text-align: center;
	padding: 2px 0;
	background: linear-gradient(-45deg, #e0cb63 0%, #e0cb63 3%, #a94557 3%, #be717f 50%, #a94557 97%, #e0cb63 97%, #e0cb63 100%);
	background-position: right, left;
	background-repeat: no-repeat;
	background-size: auto 100%;
	font-weight: bold;
	margin: 18px 12px 6px 12px;
	box-sizing: border-box;
	border-radius: 2px;
	border: solid 1px #e0cb63;
}
.titletext {
	font-size: 1.15em;
	/*letter-spacing: .1em;*/
	color: #fff;
	text-shadow: #a94557 1px 1px 0, #a94557 -1px -1px 0, #a94557 -1px 1px 0, #a94557 1px -1px 0, #a94557 0px 1px 0, #a94557 0-1px 0, #a94557 -1px 0 0, #a94557 1px 0 0;
	padding: 2px 0;
}
div#container {
	/*margin-top: -16px;*/
	position: relative;
	min-height: 100%;
	height: auto !important;
	width: 100%;
}
#content {
	width: 100%;
	/*padding-top: 16px;*/
	padding-bottom: 16px;
	min-height: calc(100vh - 108px);
	box-sizing: border-box;
	overflow: hidden;
	border-bottom: 1px solid #e4e4e4;
}
#member {
	width: 40%;
	height: auto;
}

#avatar_area a,
#menu a,
.padY5 a {
	text-decoration: none;
}
.info {
	width: 80%;
	margin: 0 auto 10px auto;
	padding: 10px;
	-webkit-border-radius: 7px;
	   -moz-border-radius: 7px;
	    -ms-border-radius: 7px;
	     -o-border-radius: 7px;
	        border-radius: 7px;
	padding: 0.3em 0.9em;
	background: #fff;
	opacity: 0.8;
	font-weight: 900;
	color: #333;
}


/* mypageレイアウト */
/* infobar */
#infobar {
	width: 100%;
	padding: 4px 0 0 0;
	text-align: center;
	position: absolute;
	z-index: 101;
}
#infobar ul li {
	display: inline;
	margin: 0;
}
#rightends, #leftends {
	position: absolute;
	width: 20.8%;
	top: 4px;
}
#rightends { right: 0; }
#leftends { left: 0; }

#rightends img, #leftends img, #infobar_area_center img, .infobar_area_center img {
	width: 100%;
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
#rightends img:active, #leftends img:active, #infobar_area_center img:active, .infobar_area_center img:active {
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}

#infobar_area_center img, .infobar_area_center img {
	position: relative;
}

#infobar_area_center img {
	width: 20.8%;
}
.infobar_area img {
	width: 18.6%;
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.infobar_area img:active {
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}
#infobar ul#infobar_three {
	text-align: center;
}
#infobar ul#infobar_parameters_left {
	padding-top: 3.25vh;
	padding-left: 2.25%;
	width: 27%;
	float: left;
	text-align: left;
}
#infobar_parameters_left .infobar_area a img {
	width: 69%;
	left: 0;
	margin-bottom: 4px;
}

.infobar_area .area01, .area04 {
	margin: 0 0 12px 0;
	display: inline-block;
	width: 100%;
	border: solid 2px rgba(255, 255, 255, 0.9);
	position: relative;
	background-color: rgba(255, 255, 255, 0.75);
	color: #97863d;
    text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
	padding: 1px 0 1px 16px;
	text-align: left;
	vertical-align: 50%;
	font-weight: bold;
	font-size: .75em;
	box-sizing: border-box;
	-webkit-border-radius: 100px 8px 8px 100px;
	   -moz-border-radius: 100px 8px 8px 100px;
	    -ms-border-radius: 100px 8px 8px 100px;
	     -o-border-radius: 100px 8px 8px 100px;
	        border-radius: 100px 8px 8px 100px;
	-webkit-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	   -moz-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	    -ms-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	     -o-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	        box-shadow: 0 4px rgba(0, 0, 0, 0.25);
}
.infobar_area .area01 .count, .area04 .count {
	text-shadow: none !important;
}
.area04_right {
	-webkit-border-radius: 8px 100px 100px 8px;
	   -moz-border-radius: 8px 100px 100px 8px;
	    -ms-border-radius: 8px 100px 100px 8px;
	     -o-border-radius: 8px 100px 100px 8px;
	        border-radius: 8px 100px 100px 8px;
	background: linear-gradient(-45deg,
		rgba(224, 203, 99, .6) 0%,
		rgba(224, 203, 99, .6) 18%,
		rgba(231, 233, 239, .45) 18%,
		rgba(231, 233, 239, .45) 100%);
	padding: 1px 16px 1px 4px;
}
.num_avatar .area04 {
	background: linear-gradient(-45deg,
		rgba(224, 203, 99, .6) 0%,
		rgba(224, 203, 99, .6) 18%,
		rgba(231, 233, 239, .45) 18%,
		rgba(231, 233, 239, .45) 100%);
	margin: 0 2px 8px 0;
	text-indent: 1em;
	-webkit-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	   -moz-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	    -ms-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	     -o-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	        box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	font-size: 12px;
	font-weight: bold;
border: solid 2px #fff;
}
.num_avatar .area04_right {
	margin: 0 0 8px 2px;
border: solid 2px #fff;
}

.infobar_area .area01::before,
.area04::before, .area05:before {
	display: block;
	content: "";
	border: solid 1px #b1b1b1;
	width: calc(100% + 6px);
	height: calc(100% + 6px);
	margin: -4px 0 0 -19px;
	border-radius: 100px 10px 10px 100px;
	-webkit-border-radius: 100px 10px 10px 100px;
	position: absolute;
	box-sizing: border-box;
}
.pickup_frame .area05:before {
	margin: -4px 0 0 -3px;
}
.num_avatar .area04_right::before {
	border-radius: 10px 100px 100px 10px;
	-webkit-border-radius: 10px 100px 100px 10px;
	margin: -4px 0 0 -7px !important;
}
.num .area01 {
	position: relative;
	display: inline-block;
	width: 33%;
	padding: 2px 0 0 8px;
	vertical-align: 50%;
	font-weight: bold;
	font-size: .9em;
	border: solid 2px #fff;
	text-align: left;
		background: linear-gradient(-45deg,
		rgba(224, 203, 99, .68) 0%,
		rgba(224, 203, 99, .68) 18%,
		rgba(231, 233, 239, .68) 18%,
		rgba(231, 233, 239, .68) 100%);
	font-weight: bold;
	font-size: 13px;
	color: #97863d;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	border-radius: 18px;
text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
	    box-shadow: 0 3px rgba(0, 0, 0, .25);
}
.num .area01:before{
	display: block;
		content: "";
	position: absolute;
	border: solid 1px #b1b1b1;
	border-radius: 19px;
	margin: -4.8px 0 0 -11px;
	width: calc(100% + 4.5px);
	height: calc(100% + 3.8px);
}
.area04 .count,
.area05 .count,
ul#infobar_parameters li.infobar_area .area01 .count{
	border: solid 1px #56525a;
	background-color: #716c76;
	padding: 1px 8px 1px 2px;
	margin: 2px;
	text-align: right;
	font-weight: normal;
	font-size: 1em;
	color: #fff;
	box-sizing: border-box;
	-webkit-border-radius: 100px;
	   -moz-border-radius: 100px;
	    -ms-border-radius: 100px;
	     -o-border-radius: 100px;
	        border-radius: 100px;
}
.area05 .count {
	display: inline-block;
	text-align: right !important;
	font-size: .9em;
	width: 45%;
	text-shadow: none !important;
}
#infobar ul li.infobar_btn img {
	width: 15%;
	vertical-align: top;
}


/* num */
.num,
.pickup_frame {
	text-align: center;
	padding-top: 8px;
}
.pickup_frame {
	line-height: 1.4em;
	position: relative;
	margin: 10px;
	-webkit-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	   -moz-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	    -ms-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	     -o-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	        box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 8px 0;
	background-color: #f2f1e9;
	border: solid 3px rgba(255, 255, 255, 1);
	box-sizing: border-box;
	border-radius: 3px;
	z-index: 1;
}
.pickup_frame:before {
	display: block;
	/*outline: solid 1px #d9b63b;*/
	outline-offset: -4px;
		box-sizing: border-box;
		content: "";
	width: calc(100% + 6px);
	height: calc(100% + 6px);
	border: solid 1px #dadbdd;
	position: absolute;
	margin: -11px 0 0 -3px;
	border-radius: 2px;
}
/*.pickup_frame p {
	margin-top: 8px;
}*/
.num ul {
	display: block;
	margin-bottom: 10px;
}
.num { margin-bottom: 4px; }
.num_avatar {
	padding-top: 8px;
}
.num_avatar ul,
.num_avatar{
	margin-bottom: 0px;
}
.num ul li {
	display: inline;
	margin: 0;
}
.under_btn {
	position: relative;
	z-index: 100;
}
.area02,
.area06,
.area08,
.area09 {
	display: inline-block;
	border: solid 2px #fff;
	text-align: left;
	vertical-align: middle;
	font-weight: bold;
	        border-radius: 18px;
	background: linear-gradient(-45deg,
		rgba(224, 203, 99, .68) 0%,
		rgba(224, 203, 99, .68) 18%,
		rgba(231, 233, 239, .68) 18%,
		rgba(231, 233, 239, .68) 100%);
	font-weight: bold;
	font-size: 13px;
	color: #97863d;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
    box-shadow: 0 3px rgba(0, 0, 0, .25);
}
.area09 {
	position: relative;
	width: 100%;
	/*text-align: right;*/
	margin: 2px 0;
	box-sizing: border-box;
	/*padding-left: 5px;*/
	padding-bottom: 8px;
	/*padding-top: 5px;*/
	display: flex;
	align-items: center;
	padding-top: 8px;
	padding-left: 10px;
}
.area02 {
	width: 30%;
	padding: 4px 0 0 8px;
	position: relative;
}
.under_btn ul li:not(:nth-child(3n)){
	margin-right: 2px;
}
.area06 {
	position: relative;
	width: 100%;
	/*text-align: right;*/
	margin: 2px 0;
	box-sizing: border-box;
	padding-left: 5px;
	padding-bottom: 10px;
	padding-top: 5px;
}
.area02:before,
.area06:before,
.area09:before {
	content: "";
	position: absolute;
	border: solid 1px #b1b1b1;
	border-radius: 19px;
}
.area02:before {
	margin: -6.75px 0 0 -10.65px;
	width: calc(100% + 3.75px);
	height: calc(100% + 3.45px);
}
.area06:before {
	margin: -7.5px 0 0 -7.75px;
	width: calc(100% + 4px);
	height: calc(100% + 3px);
}
.area09:before {
	margin: 0 0 0 -12px;
	width: calc(100% + 4.25px);
	height: calc(100% + 4.25px);
}
.area08 {
	width: 50%;
	padding: 5px 0 0 5px;
	margin: 2px 0;
}
.num .area01 .count,
.area02 .count,
.area06 .count,
.area08 .count,
.area07 .count,
.area09 .count{
	text-shadow: none !important;
	border-style: none;
	background-color: #716c76;
	padding: 2px 6px;
	margin: 5px;
	text-align: right;
	font-weight: bold;
	color: #fff;
	-webkit-border-radius: 100px;
	   -moz-border-radius: 100px;
	    -ms-border-radius: 100px;
	     -o-border-radius: 100px;
	        border-radius: 100px;
	border: solid 1px #56525a;
	font-size: .9em;
	box-sizing: border-box;
}
.area06 .text {
	display: inline-block;
	margin: 2px 4px -2px 4px !important;
	font-size: 1em;
}
.area06 .count {
	width: 49%;
	display: inline-block;
	position: absolute;
	right: 0;
	margin: 0px 5px 2px 0 !important;
}
.area03 {
	display: inline-block;
	width: 30%;
	border: none;
	background: none;
	/*padding: 5px 0 0 5px; */
	text-align: left;
	vertical-align: middle;
	font-weight: bold;
	box-sizing: border-box;
}
.area05,
.area07 {
	display: inline-block;
	border: solid 2px #fff;
	text-align: left;
	vertical-align: middle;
	font-weight: bold;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	    -ms-border-radius: 4px;
	     -o-border-radius: 4px;
	        border-radius: 4px;
	-webkit-box-shadow: 0 3px rgba(0, 0, 0, 0.25);
	   -moz-box-shadow: 0 3px rgba(0, 0, 0, 0.25);
	    -ms-box-shadow: 0 3px rgba(0, 0, 0, 0.25);
	     -o-box-shadow: 0 3px rgba(0, 0, 0, 0.25);
	        box-shadow: 0 3px rgba(0, 0, 0, 0.25);
	background: linear-gradient(-45deg,
		rgba(224, 203, 99, .68) 0%,
		rgba(224, 203, 99, .68) 18%,
		rgba(231, 233, 239, .68) 18%,
		rgba(231, 233, 239, .68) 100%);	
	font-weight: bold;
	font-size: 13px;
	color: #97863d;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
}
.area05 {
	margin: 0 0 4px 0;
	width: 100%;
	position: relative;
	padding: 1px 4px 1px 0 ;
	text-align: right;
	vertical-align: middle;
	font-weight: normal;
	font-size: .75em;
	box-sizing: border-box;
	-webkit-border-radius: 100px 8px 8px 100px;
	   -moz-border-radius: 100px 8px 8px 100px;
	    -ms-border-radius: 100px 8px 8px 100px;
	     -o-border-radius: 100px 8px 8px 100px;
	        border-radius: 100px 8px 8px 100px;
	-webkit-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	   -moz-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	    -ms-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	     -o-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	        box-shadow: 0 4px rgba(0, 0, 0, 0.25);
}
.area04 {
	width: 40%;
}
.area05 {
	position: relative;
	width: 34%;
	font-size: 1em;
}
.area07 {
	position: relative;
	width: 70%;
	font-size: 1em;
	margin: 2px 0;
}
.area09 .count {
	width: 44%;
	position: absolute;
	top: 5px;
	right: 0;
	margin: 0 6px 0 0;
}

/* ボタンと水平に並べる時に使用 */
.vertical_align_middle {
	position: relative;
	/*bottom: .5em;*/
}
.area04 .text,
.area05 .text,
.area07 .text {
	display: inline-block;
	text-align: left;
	margin: 0 4px !important;
}
.area05 .text,
.area07 .text {
	font-weight: bold;
}
.area07 .count {
	width: 32%;
	font-size: .9em;
}
.area03 img {
	width: 100%;
		-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.area03 img:active {
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}
.banner_area a img:last-child{
	padding: 5px 0 0 0;	
}
.banner_area {
	position: relative;
	width: 92%;
	margin: 0 4%;
	z-index: 100;
}
.banner_area a img {
	padding: 5px 0;
	width: 100%;
	text-align: center;
}
.banner_area p {
    display: block;
    position: relative;
    vertical-align: middle;
    text-align: center;
    padding: 3px 0;
    font-size: .85em;
	font-weight: bold;
    background: #fa8c8b;
    color: #FFF;
    box-sizing: border-box;
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2);
	margin: 3px 12px 8px 12px;
	text-decoration: none;
}
.banner_area p.ribbon_blue {
    background: #8fcff1;
}
.banner_area p.ribbon_large {
    font-size: 1.15em !important;
}
.banner_area p:before, .banner_area p:after{
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}
.banner_area p:before{
    top: -2px;
    left: -2px;
    border-width: 14px 0px 14px 10px;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
}
.banner_area p:after{
    top: -2px;
    right: -2px;
    border-width: 14px 10px 14px 0px;
    border-color: transparent #fff transparent transparent;
    border-style: solid;
}
/* メインビジュアル */
#main_visual img {
	width: 100%;
}

#main_visual {
	position: relative;
}

img#undercircle {
	position: absolute;
	bottom: 0;
	width: 100%;
	z-index: 1;
	left: 0;
}

#main_visual .member_comment,
#main_visual .mypage_comment {
	position: absolute;
	width: 75%;
	bottom: 9%;
	left: 50%;
	font-size: .9em;
	-webkit-transform: translateX(-50%);
	   -moz-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	     -o-transform: translateX(-50%);
	        transform: translateX(-50%);
	padding: 8px 14px;
	font-weight: normal;
	text-align: left;
	border: solid 2px #fff;
	background:
		rgba(255,255,255,0.85);	
	        border-radius: 100px;
	-webkit-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	   -moz-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	    -ms-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	     -o-box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	        box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	color: #333333;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
}
#main_visual .mypage_comment {
    bottom: 29%;
    padding: 8px 4.25em 8px 17.5px;
}
#main_visual .mypage_comment:after {
    content: "";
    position: absolute;
    top: -16px;
    right: 32px;
    height: 0;
    width: 0;
    border: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-left: 8px solid #fff;
}
#main_visual .mypage_comment:before {
	content: "";
	margin: -11px 0 0 -20px;
	position: absolute;
	border: solid 1px #bbb;
	width: calc(100% + 4px);
	height: calc(100% + 3.9px);
	border-radius: 100px;
	background-position: 87% 90%;
	background-size: auto 60%;
	background-repeat: no-repeat;
}

/* メインボタン */
#btn_main,
#btn_sub {
	position: relative;
	width: 100%;
}

#btn_main {
	margin: -31% 0 0 0;
}
#btn_sub {
	margin: 0;
}

#btn_sub ul li { display: inline; }
#btn_sub ul li a img { vertical-align: middle; }

img#btn_main02 {
	position: absolute;
	z-index: 98;
	right: 0;
	top: 0;
}
img#btn_main03 {
	position: absolute;
	z-index: 98;
	left: 0;
	top: 0;
}
img#btn_main02,
img#btn_main03 {
	width: 30.3%;
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

img#btn_sub02,
img#btn_sub03 {
	width: 50%;
}

img#btn_main01,
img#btn_main04 {
	position: relative;
	z-index: 99;
	display: block;
	margin: 0 auto;
	width: 39.4%;
	top: 0;
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
img#btn_sub01,
img#btn_sub02,
img#btn_sub03 {
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
img#btn_main01:active,
img#btn_main02:active,
img#btn_main03:active,
img#btn_main04:active,
img#btn_sub01:active,
img#btn_sub02:active,
img#btn_sub03:active{
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}

img#btn_sub01 {
	width: 50%;	top: 0;

}

#btn_main a#btn_main_link01 {
	left: 50%;
	bottom: 0;
	-webkit-transform: translateX(-50%);
	   -moz-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	     -o-transform: translateX(-50%);
	        transform: translateX(-50%);
}

#btn_main a#btn_main_link02 {
	right: 0;
}

#btn_main a#btn_main_link03 {
	left: 0;
}


/* 丸 */
#hp { position: relative; }
#hp:after {
	content: '';
	display: block;
	height: 1px;
	margin-top: 4%
}

.hp-nav {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hp-nav {
	width: 100%;
	position: absolute;
	bottom: 4.5%;
	text-align: center;
	z-index: 101;
	pointer-events: none;
}

.hp-nav li {
	margin: 0 1px;
	display: inline-block;
	zoom: 1;
}

.hp-nav li span,
.hp-nav-end li span {
	width: 0.5em;
	height: 0.5em;
	display: block;
	background: #716c76;
	cursor: pointer;
	text-indent: -9999px;
	-webkit-border-radius: 20px;
	   -moz-border-radius: 20px;
	    -ms-border-radius: 20px;
	     -o-border-radius: 20px;
	        border-radius: 20px;
	-webkit-box-sizing: content-box;
	   -moz-box-sizing: content-box;
	    -ms-box-sizing: content-box;
	     -o-box-sizing: content-box;
	        box-sizing: content-box;
}

.hp-nav li span {
	border: solid 1px #faf2b9;
}

.hp-nav-end li span {
	border: solid 1px #4da4e8;
}

.hp-nav li span.hp-active {
	background: #be717f;
	opacity: 1;
}


/* ゲージ */
#gage {
	padding-top: 5px;
}

#gage_area {
	border: solid 2px #d2ebec;
	background-color: rgba(255, 255, 255, 0.75);
	padding: 10px;
	margin: 10px 10px;
}

#gage_area img {
	width: 100%;
}


/* アバター */
#avatar_area,
.avatar_area,
.avatar_area_prof{
	box-sizing: border-box;
}
#avatar_area {
	margin: 4px 0 4px 0;
}
.avatar_area {
	margin: 10px 0 2px 0;
}
.avatar_area_prof {
	margin: 4px 0 10px 0;
}
#avatar_area img.w100,
.avatar_area img.w100,
.avatar_area_prof img.w100 {
	border-top: 2px solid #f5effc;
	border-bottom: 2px solid #f5effc;
	margin-top: 4px;
}

.attention {
	font-size: 10px;
	color: #dfbe4a;
}
.attention2 {
	font-size: 10px;
	color: #f00;
}


/* レイアウト成形に使用 */
.pink   { color: #fa4573; }
.sand   { color: #dfbe4a; }

.right  { text-align: right; }
.left   { text-align: left; }
.center { text-align: center; }

.small  { font-size:90%; }
.medium { font-size:120%; }

.strong { font-weight: 900; }
.list_d p span.strong { display: inline-block; margin: .5em auto; font-size: 1.15em; color: #fb90a6; text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0; }
.list_d p.present_content { padding: 0px 4px; }

.clear  { clear: both; }

.pad1   { padding: 1px; }
.padX1  { padding-left: 1px; padding-right : 1px; }
.padY1  { padding-top : 1px; padding-bottom: 1px; }
.padB1  { padding-bottom: 1px; }
.pad3   { padding: 3px; }
.padX3  { padding-left: 3px; padding-right : 3px; }
.padY3  { padding-top : 3px; padding-bottom: 3px; }
.padB3  { padding-bottom: 3px; }
.pad5   { padding: 5px; }
.padX5  { padding-left: 5px; padding-right : 5px; }
.padY5  { padding-top : 5px; padding-bottom: 5px; }
.padB5  { padding-bottom: 5px; }
.pad10  { padding: 10px; }
.padX10 { padding-left: 10px; padding-right : 10px; }
.padY10 { padding-top : 10px; padding-bottom: 10px; }
.padB10 { padding-bottom: 10px; }
.pad15  { padding: 15px; }
.padX15 { padding-left: 15px; padding-right : 15px; }
.padY15 { padding-top : 15px; padding-bottom: 15px; }
.padB15 { padding-bottom: 15px; }
.pad20  { padding: 20px; }
.padX20 { padding-left: 20px; padding-right : 20px; }
.padY20 { padding-top : 20px; padding-bottom: 20px; }
.padB20 { padding-bottom: 20px; }

.mar1   { margin: 1px; }
.marX1  { margin-left: 1px; margin-right : 1px; }
.marY1  { margin-top : 1px; margin-bottom: 1px; }
.marB1  { margin-bottom: 1px; }
.mar3   { margin: 3px; }
.marX3  { margin-left: 3px; margin-right : 3px; }
.marY3  { margin-top : 3px; margin-bottom: 3px; }
.marB3  { margin-bottom: 3px; }
.mar5   { margin: 5px; }
.marX5  { margin-left: 5px; margin-right : 5px; }
.marY5  { margin-top : 5px; margin-bottom: 5px; }
.marB5  { margin-bottom: 5px; }
.mar10  { margin: 10px; }
.marX10 { margin-left: 10px; margin-right : 10px; }
.marY10 { margin-top : 10px; margin-bottom: 10px; }
.marB10 { margin-bottom: 10px; }
.mar15  { margin: 15px; }
.marX15 { margin-left: 15px; margin-right : 15px; }
.marY15 { margin-top : 15px; margin-bottom: 15px; }
.marB15 { margin-bottom: 15px; }
.mar20  { margin: 20px; }
.marX20 { margin-left: 20px; margin-right : 20px; }
.marY20 { margin-top : 20px; margin-bottom: 20px; }
.marB20 { margin-bottom: 20px; }
.marT20P { margin-top: 20%;}
.mar-T4 { margin-top: -4%; }
.pad-half { padding-top: 8px !important; }
/* [左]画像：[右]詳細情報の表記(イベント・バトル・ダービーとは若干違う) */
.ls_row {
	padding: 5px 0;
	border-top: solid 1px #fff;
	border-bottom: solid 1px #f1e9c5;
	positon: relative;
}
.ls_img {
	float: left;
	width: 25%;
	padding: 0 6px;
	text-align: center;
}
.ls_desc1 {
	float: left;
	width: 70%;
	text-align: left;
}
.ls_desc2 {
	float: left;
	width: 50%;
	text-align: left;
}
.ls_desc3 {
	float: left;
	width: 45%;
	text-align: left;
}
.ls_btn {
	float: left;
	width: 20%;
	text-align: center;
}
.ls_pager {
	text-align: center;
	font-size: 18px;
	padding: 8px 0;
}
/* モーダルメニュー */
.lock {
	overflow: hidden;
}
.modal-content,
.modal-content_logb {
	position: relative;
	display: none;
	width: 96%;
	margin: 30px 2% 7em 2%;
	padding: 0;
	border: solid 2px #c5b057;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	background: #fff;
	background-image: url(img/bg.svg);
	
	background-repeat: repeat;
	background-size: 40px;
	-webkit-animation: bgiLoop 30s linear infinite;
  	animation: bgiLoop 30s linear infinite;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	    -ms-border-radius: 3px;
	     -o-border-radius: 3px;
	        border-radius: 3px;
}

.modal-title {
	padding: .75em 0 .25em 0;
}
.modal-bg {
	padding: 0 8px 4px 8px;
}
.modal-content p {
	margin: 0 12px;
	padding: 6px 0;
}
.modal-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 120%;
	background-color: rgba(0,0,0, 0.35);
	z-index: 101;
}
.modal-wrap {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	z-index: 112;
}
.modal-open {
	text-decoration: underline;
}

.modal-open:hover {
	cursor: pointer;
}
.modal-close {
	/*position: absolute;
	right: 0; */
	width: calc(1.5em + 16px);
    height: calc(1.5em + 16px);
    position: absolute;
    right : 0;
	top: -2px;
	z-index: 101;
}
.modal-close:before,
.modal-close:after{
    display: block;
    width: 50%;
    position: absolute;
    left: 8px;
}
.modal-close:before{
    content: "";
    top: calc(50% - 1px);
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
	z-index: 101;
	border-top: 2px solid #fff;
}
.modal-close:after{
    content: "";
    bottom: calc(50% - 1px);
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
	z-index: 101;
	border-top: 2px solid #fff;
	border-bottom: none;
}
.modal-close:before,
.modal-close:after{
    display: block;
    width: 50%;
    position: absolute;
    left: 8px;
}
.modal-close:before{
    content: "";
    top: calc(50% - 1px);
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
	z-index: 101;
	border-top: 2px solid #fff;
}
.modal-close:after{
    content: "";
    bottom: calc(50% - 1px);
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
	z-index: 101;
	border-top: 2px solid #fff;
	border-bottom: none;
}
.btn_modal-close {
    width: calc(5.5em + 3.25px);
}
.btn_modal-close:before,
.btn_modal-close:after{
    display: none;
}
.btn_long .modal-close {
	position: relative;
}
.modal-content > ul {
	overflow: hidden;
	margin: 0;
	padding: 0;
}
.modal-content > ul li.lavel,
.modal-title {
	padding: 8px 32px;
	background: #eee;
	text-align: center;
	background-color: #c5b057;
}
.modal-content > ul li.lavel {
	font-size: 1.15em;
}
.modal-title {
	font-size: 1.1em;
}
.modal-title,
.modal-content > ul li.lavel a,
.modal-title {
	color: #fff;
	text-decoration: none;
}
.modal-title {
	line-height: 1.3em;
	font-weight: normal;
}
ul.nav_box {
	margin: 0;
	padding: 16px 5px 4px 5px;
	overflow: hidden;
}
ul.nav_box li {
	width: 46%;
	float: left;
	margin: 0 2% 12px 2%;
	list-style: none;
}
ul.nav_box li img {
	width: 100%;
}

ul.nav_box li a {
	display: block;
}


p.close_bottom {
	overflow: hidden;
	text-align: center;
}


p.close_bottom a {
	display: block;
	background-color: #fff;
	padding: 10px 30px;
	font-size: 1.4em;
}

/* アコーディオン */
label {
	margin: 0;
}

.accordion {
	width: 15%;
	position: absolute;
	left: 1.5%;
	z-index: 99;
	text-align: right;
}

#infobar ul li.infobar_btn img.ac_btn_img {
	vertical-align: middle;
	width: 15%;
	position: relative;
	z-index: 98;
}

input[type="checkbox"].on-off {
	display: none;
}

.accordion ul {
	-webkit-transition: all 0.5s;
	   -moz-transition: all 0.5s;
	    -ms-transition: all 0.5s;
	     -o-transition: all 0.5s;
	        transition: all 0.5s;
	margin: 0;
	padding: 0;
	list-style: none;
}

.accordion ul li img {
	padding: 2px 0;
}

input[type="checkbox"].on-off + ul {
	height: 0;
	overflow: hidden;
}

input[type="checkbox"].on-off + .accordion ul li span.value {
	height: 0;
	overflow: hidden;
}

input[type="checkbox"].on-off:checked + ul {
	height: auto;
	overflow: visible;
}

input[type="checkbox"].on-off:checked + .accordion ul li span.value {
	height: auto;
}
/* checkbox */
input[type=radio], input[type=checkbox] {
  display: none;
}
.radio, .checkbox {
  box-sizing: border-box;
  -webkit-transition: background-color 0.1s linear;
  transition: background-color 0.1s linear;
  position: relative;
	display: inline-block;
  border-radius: 4px;
  vertical-align: middle;
	font-size: .9em;
	margin: .75em 0 .25em;
}
.radio {
  padding: 4px 8px 4px 26px;
}
.checkbox {
  padding: 4px 8px 4px 32px;
margin: 0;
	background: #fff;
	border: 1px solid #d7cfe2;
}
.vertical_align_middle.checkbox {
	background: none;
	border: none;
}
.radio:after, .checkbox:after {
  -webkit-transition: border-color 0.1s linear;
  transition: border-color 0.1s linear;
  position: absolute;
  top: 50%;
  display: block;
  margin-top: -9px;
  width: 16px;
  height: 16px;
  border: 1px solid #ddd;
  background-color: #fff;
  content: '';
}
.checkbox:after {
  border: solid 1px #ddd;
  left: 8px;
}
.radio:after {
  border: 2px solid #ddd;
  left: 0;
}
.radio:after { border-radius: 50%; }
.checkbox:after { border-radius: 0; }

.radio:before {
  -webkit-transition: opacity 0.1s linear;
  transition: opacity 0.1s linear;
  position: absolute;
  top: 50%;
  left: 5px;
  display: block;
  margin-top: -4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #ee4762;
  content: '';
  opacity: 0;
  z-index: 99;
}
input[type=radio]:checked + .radio:before {
  opacity: 1;
}
.checkbox:before {
  -webkit-transition: opacity 0.1s linear;
  transition: opacity 0.1s linear;
  position: absolute;
  top: 34%;
  left: 11px;
  display: block;
  margin-top: -5px;
  width: 10px;
  height: 10px;
  border-right: 3px solid #ee4762;
  border-bottom: 3px solid #ee4762;
  content: '';
  opacity: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 99;
}
input[type=checkbox]:checked + .checkbox:before {
  opacity: 1;
}
input[type=radio]:checked + .radio,
input[type=checkbox]:checked + .checkbox {
font-size: .9em;
}
span.underlinelink, a span.underlinelink:visited, a span.underlinelink:hover, a span.underlinelink:active, a span.underlinelink:focus {
	color: #ff3939;
	text-decoration: underline;
}

/* バッチ風アイコン */
span.value,
span#value02, span#value03, span#value04, span#value05, span#value06, span#value07, span#value08, span#value09, span#value10, span#value11, span#value12 {
	top: 0;
	font-weight: bold;
	font-size: .75em;
	color: #fff;
	padding: 1px 6px;
	z-index: 99;
	background: #ff335f;
	-webkit-border-radius: 100px;
	   -moz-border-radius: 100px;
	    -ms-border-radius: 100px;
	     -o-border-radius: 100px;
	        border-radius: 100px;
	width: auto;
	display: block;
	text-align: right;
	box-sizing: border-box;
	border: solid 1px #ff6984;
	box-shadow: 0 3px rgba(0, 0, 0, 0.25);
}
span.value {
	position: relative;
	top: 0;
	margin: 0 0 -22px 0;
	float: right;
}
span#value02 {
	position: absolute;
	top: 4px;
	right: 60.7%;
}
span#value03 {
	position: absolute;
	top: 4px;
	right: 39.6%;
}
span#value04 {
	position: absolute;
	top: 4px;
	right: 21.8%;
}
span#value05 {
	position: absolute;
	right: 1.8%;
}
span#value06 {
	position: absolute;
	left: -.45em;
	top: -1em;
	height:20px;
	width:20px;
}
span#value07 {
	position: absolute;
	left: -1.1em;
	top: -1em;
}
span#value08 {
	position: absolute;
	left: -1.15em;
	top: -1.25em;
	height:20px;
	width:20px;
}
span#value09 {
	position: absolute;
	left: 23%;
	top: 5.5em;
	height:20px;
	width:20px;
}
span#value10 {
	position: absolute;
	left: 45%;
	top: 5.5em;
	height:20px;
	width:20px;
}
span#value11 {
	position: absolute;
	left: 68%;
	top: 5.5em;
	height:20px;
	width:20px;
}
span#value12 {
	position: absolute;
	left: 90%;
	top: 5.5em;
	height:20px;
	width:20px;
}
.accordion ul li a {
	text-decoration: none;
}

/* テンプレートパーツ */
/* テキスト */
.text_area {
	padding: 10px 0;
	margin: 0 12px;
}

hr {
	border-width: 1px 0px 0px 0px; 
	border-style: solid;
	border-color: #e5e5e5;
	height: 1px;
	margin: 8px 12px;
}

h1 {
	font-size: 1.2em;
	color: #333;
	line-height: 1.5em;
	display: block;
	padding: 4px 0;
	text-align: center;
}
.p-normal,
p,
.list_d h1, .list_f h1{
	display: block;
	padding: 6px 0;
	margin: 0 8px;
}
.list_d .btn_long, .list_f .btn_long {
	margin-left: 8px;
}
.float_48 h1,
.list_d h1, .list_f h1{
	text-align: left;
	font-size: 1.1em;
	color: #ab9c5b;
text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
.list_f h1 {
	text-indent: .25em;
	padding: 0;
}
.float_48 p,
.list_d p, .list_f p{
	text-align: left;
	padding: 2px 4px 3px 4px;
}
.p-normal,
p {
	font-size: .9em;
}

.red {
	color: red !important;
}
.blue {
	color: blue !important;
}

.caution {
	display: block;
	padding: 4px 0;
	font-size: .8em;
	font-weight: normal;
}
h1.sub_liner {
    text-align: center;
    padding: 0;
    background: linear-gradient(-45deg, #b8a347 0%, #b8a347 3%, #e0c8c9 3%, #e0c8c9 97%, #b8a347 97%, #b8a347 100%);
    background-position: right, left;
    background-repeat: no-repeat;
    background-size: auto 100%;
    overflow: hidden;
    font-weight: bold;
    margin: 18px calc(12px + 1.5em) 6px calc(12px + 1.5em);
    box-sizing: border-box;
    border-radius: 2px;
    border: solid 1px #b8a347;
    font-size: 1.05em;
    line-height: 1.6em;
    color: #a94557;
    letter-spacing: 0;
    text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
p.greeting {
	background: #fff;
	border: solid 1px #d1d4e3;
	padding: 8px 10px;
	border-radius: 3px;
	min-height: 3em;
	white-space: pre-wrap;
	word-break: break-all;
	word-wrap: break-word;
	overflow-wrap: break-word;
}
/* コミュニティ用仮 start */
.line_frame_yellow .line_frame_margin .list_f .greeting_com a {
	font-weight: bold;
	color: #ab9c5b;
	text-decoration: none;
	position: relative;
}

p.greeting_com {
	background: #fff;
	border: solid 1px #e5e5e5;
	padding: 8px 10px;
	border-radius: 3px;
	min-height: 3em;
	white-space: pre-wrap;
	word-break: break-all;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

/* コミュニティ用仮 end */
.line_frame_margin p.greeting {
	margin: 0 0 1% 3%;
}
p.login_time {
	text-align: center;
	margin: 0;
	padding: 0;
	font-size: .7em;
	color: #999;
	background: #fafafa;
	border: solid 1px #e5e5e5;
	border-radius: 100px;
}
/* アコーディオンテキスト */
.accordion_ul section {
	background: #fff;
}
.accordion_ul section p {
	padding: 12px 0;
}
.accordion_ul section div.detail {
	display: none;
	padding: 12px 0;
	margin: 0 12px;
}
.accordion_ul section div.detail input.btnType01 {
	display: block;
}
.infospan {
	position: relative;
	display:inline-block;
	padding: 0 8px;
	-webkit-border-radius: 100px;
	   -moz-border-radius: 100px;
	    -ms-border-radius: 100px;
	     -o-border-radius: 100px;
	        border-radius: 100px;
	color: #fff;
	margin-right: 8px;
	font-size: .75em;
	background: #a94557;
	box-sizing: border-box;
	font-weight: bold;
}
.accordion_ul li:last-of-type {
	border-bottom: solid 1px #ededed;
}
section h1 {
	background-color: #f3f3f3;
	border-bottom: solid 1px #c9c9c9;
	margin-bottom: 1px;
	padding: 10px 40px 10px 20px;
	color: #333;
	position: relative;
	font-weight: normal;
	font-size: 1.05em;
	text-align: left;
}
section h1:before {
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
	top: 50%;
	right: 15px;
	width: 13px;
	height: 13px;
	margin-top: -8px;
	background: #b8a347;
}
section h1:after {
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
	top: 50%;
	right: 15px;
	width: 13px;
	height: 13px;
	margin-top: -13px;
	background: #f3f3f3;
}
section h1.active:before {
	margin-top: -2px;
}
section h1.active:after {
	margin-top: 3px;
}
.accordion_ul {
	padding: 4px 0;
}
/* ボタン */
a.btn_active,
a.btn_inactive,
a.btn_red,
.btn_active_input,.btn_inactive_input,.btn_red_input,
.btn_inactive_input_mini,
p.btn_active_p,
p.btn_inactive_p {
	display: inline-block;
	padding: 0 12px;
	text-decoration: none;
	margin: 0 auto;
	box-sizing: border-box;
	box-shadow: 0 2px 0 1px rgba(0,0,0,0.25);
	margin-bottom: 3px;
	position: relative;
	-webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
	font-weight: bold;
}
a.btn_active,
a.btn_inactive,
a.btn_red,
.btn_active_input,.btn_inactive_input,.btn_red_input,
p.btn_active_p,
p.btn_inactive_p {
	font-size: 1.1em;
	line-height: 2.25em;
}
.btn_inactive_input_mini {
	font-weight: bold;
		font-size: .9em;
}
a.btn_active,
.btn_active_input, p.btn_active_p {
	    background: linear-gradient(180deg, #e0cb6a 0%, #e0cb6a 50%, #ccb043 50%, #ccb043 100%) ;
    color: #fff;
    text-shadow: #a58f33 1px 1px 0, #a58f33 -1px -1px 0, #a58f33 -1px 1px 0, #a58f33 1px -1px 0, #a58f33 0px 1px 0, #a58f33 0-1px 0, #a58f33 -1px 0 0, #a58f33 1px 0 0;
    border: solid 2px #faf2b9;
    border-radius: 5px;
}

.btn_active_input input {
	color: #fff;
	text-shadow: 
    #d28831 1px 1px 0, #d28831 -1px -1px 0, #d28831 -1px 1px 0, #d28831 1px -1px 0,      #d28831 0px 1px 0, #5998a8  0-1px 0, #d28831 -1px 0 0, #d28831 1px 0 0;
}
.btn_active_input input, .btn_red_input input,
.btn_red_input button {
	color: #fff;
}
.btn_inactive_input input,
.btn_inactive_input_mini input,
p.btn_inactive_p {
	color: #97863d;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0,
    #fff -1px 1px 0, #fff 1px -1px 0,
    #fff 0px 1px 0, #fff  0-1px 0,
    #fff -1px 0 0, #fff 1px 0 0;
}
.btn_active_input input, .btn_inactive_input input, .btn_red_input input,
.btn_inactive_input_mini input, .btn_red_input button {
		background: transparent;
	font-weight: bold;
}
a.btn_inactive, .btn_inactive_input,
.btn_inactive_input_mini,
p.btn_inactive_p {
	background: linear-gradient(180deg,#eff1f7 0%,#eff1f7 50%,#dadde6 50%,#dadde6 100%);
	color: #97863d;
	border: solid 2px #fff;
	border-radius: 5px;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0,
    #fff -1px 1px 0, #fff 1px -1px 0,
    #fff 0px 1px 0, #fff  0-1px 0,
    #fff -1px 0 0, #fff 1px 0 0;
}
.btn_inactive_input_mini {
	width: 40%;
	/*display: inline-flex;*/
	display: inline-block;
	  justify-content: center;
  align-items: center;
	padding: 2px;
	margin: 8px ;
}
a.btn_red, .btn_red_input {
	background: linear-gradient(180deg, #fb90a6 0%, #fb90a6 50%, #f77792 50%, #f77792 100%);
	color: #FFF;
	border: solid 2px #ffc0c8;
	border-radius: 5px;
}
a.btn_red, .btn_red_input input, .btn_red_input button {
	text-shadow: #cd5d7d 1px 1px 0, #cd5d7d -1px -1px 0, #cd5d7d -1px 1px 0, #cd5d7d 1px -1px 0, #cd5d7d 0px 1px 0, #cd5d7d 0-1px 0, #cd5d7d -1px 0 0, #cd5d7d 1px 0 0;
	line-height: 2.25em;
}
.btn_active_input input, .btn_active_input button {
	line-height: 2.25em;
}
a.btn_active:active,
a.btn_inactive:active,
a.btn_red:active,
.btn_active_input:active,
.btn_inactive_input:active,
.btn_red_input:active,
.btn_inactive_input_mini:active,
p.btn_active_p:active,
p.btn_inactive_p:active {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}
a.btn_active:before,
a.btn_inactive:before,
a.btn_red:before,
.btn_active_input:before,
.btn_inactive_input:before,
.btn_red_input:before,
.btn_inactive_input_mini:before,
p.btn_active_p:before,
p.btn_inactive_p:before {
	content: "";
	width: calc(100% + 3.5px);
	height: calc(100% + 3.5px);
	border: solid 1px #bbbbbb;
	position: absolute;
	border-radius: 6px;
}
.btn_inactive_input_mini:before {
	display: block;
	margin: -5px 0 0 -4.55px;
}
a.btn_active:before,
a.btn_inactive:before,
a.btn_red:before,
.btn_active_input:before,
.btn_inactive_input:before,
.btn_red_input:before,
p.btn_active_p:before,
p.btn_inactive_p:before {
	margin: -3px 0 0 -14.7px;
}

ul.nav_box a.btn_inactive,
ul.nav_box a.btn_red{
	font-size: 1em;
	padding: 0 4px;
}
ul.nav_box a.btn_inactive:before,
ul.nav_box a.btn_red:before{
	left: 12px;
	display: -webkit-box;
    display: -moz-box;
}

.btn_long {
	/* clear: both; */
	/* overflow: hidden; */
	padding: 4px 4px;
	position: relative;
	text-align: center;
}
.btn_inline {
	display: inline-block;
	padding: 8px 4px 0 4px;
	vertical-align: middle;
}

.btn_active_input input, .btn_inactive_input input, .btn_red_input input, .btn_inactive_input_mini input, .btn_red_input button, .btn_active_input button, .btn_inactive_input button {
	background:transparent;
	font-weight: bold;
}
.btn_active_input input, .btn_active_input button {
	color: #fff;
text-shadow: #a58f33 1px 1px 0, #a58f33 -1px -1px 0, #a58f33 -1px 1px 0, #a58f33 1px -1px 0, #a58f33 0px 1px 0, #a58f33 0-1px 0, #a58f33 -1px 0 0, #a58f33 1px 0 0;
}

.line_frame_margin .list_d .btn_inline {
	text-align: right;
}

/* ミッション アイテム紹介エリア */
.area_item,
.area_shopitem {
	padding: 12px 0;
	margin: 0 12px;
	position: relative;
	overflow: hidden;
}

.area_item, .right_item {
	text-align: right;
}
.area_item h1 {
	text-indent: 0.75em;
    color: #ab9c5b;
    border-radius: 8px;
    margin-bottom: 6px;
    border: solid 1px #fff;
    background: #f2f1e9;
    text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
.right_item ul {
 margin: 0 !important;
}
.area_shopitem {
	text-align: center;
}
.float_img img{
	width: 100%;
	border-radius: 2px;
}
.float_img,
.float_d,
.float_48,
.list_d,.list_f,
.area_float_left {
	float: left;
	position: relative;
}

.list_d,.list_f {
	width: 80%;
	box-sizing: border-box;
	text-align: right;
}
.list_d {
	position: relative;
}
.area_float_right {
	position: relative;
	float: right;
	z-index: 3;
}
.area_abs_right {
	position: absolute;
	right: 12px;
	z-index: 3;
}
.area_abs_right_thin {
	position: absolute;
	right: 1px;
	z-index: 3;
}
.float_img {
	box-sizing: border-box;
	width: 20%;
}

.float_d {
	width: 80%;
	font-size: .9em;
	padding-left: 5%;
	box-sizing: border-box;
}
.float_left {
	float:left;
}
.border_none {
	border:none;
	background:none;
}
/* clearfix */
.boxContainer:before,
.boxContainer:after {
	content: "";
	display: table;
}

.boxContainer:after {
	clear: both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.boxContainer {
	zoom: 1;
}


.area_shopitem .num {
	right: 0;
	padding-top: 0;
	font-size: .9em;
}

.area_item .num {
	text-align: left;
	padding: 2px 3px 3px 3px;
}

.area_item .num .area02 {
	width: 49%;
	box-sizing: border-box;
}

/* ショップアイテム */
/* セレクトボックス */
select.shopitem {
	width: 65%;
}

select.shopitemlist {
	width: 8em;
	margin-left: 12px;
	float: right;
	position: absolute;
	bottom: 1px;
	right: 5em;
}

select.friend {
	width: 38%;
	text-align: center;
	margin-bottom: 12px;
}
.line_frame_yellow,
.line_frame_blue {
	position: relative;
	margin: 10px;
	-webkit-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	   -moz-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	    -ms-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	     -o-box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	        box-shadow: 0 2px rgba(0, 0, 0, 0.15);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 8px 0;
	background-color: #f2f1e9;
	border: solid 3px rgba(255, 255, 255, 1);
	box-sizing: border-box;
	border-radius: 3px;
	z-index: 1;
}
.line_frame_yellow:before,
.line_frame_blue:before {
	/*outline: solid 2px #dcdf9f;
	outline-offset: -5px;*/
		box-sizing: border-box;
		content: "";
	width: calc(100% + 6px);
	height: calc(100% + 7.5px);
	border: solid 1px #dadbdd;
	position: absolute;
	margin: -11.5px 0 0 -3px;
	z-index: -1;
	border-radius: 2px;
}
.line_frame_margin {
	margin: 2px 8px 4px 8px;
}
.float_48 h1,
.float_48 p {
	margin: 0 2%;
}
.float_48 h1,
.list_d h1 {
	color: #ab9c5b;
	font-size: 1.1em !important;
	line-height: 1em;
	text-align: left;
	display: block;
	text-align: left;
	line-height: 1.35em;
	-webkit-border-radius: 2px;
	   -moz-border-radius: 2px;
	    -ms-border-radius: 2px;
	     -o-border-radius: 2px;
	        border-radius: 2px;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
.float_48 h1 {
	padding: 2px 0 0 0;
}
.list_d h1 {
	padding: 2px 2em 2px 4px;
}
/* 小ボタン */
.small_btn .btn_long {
	padding: 6px 2px;
}
.small_btn .btn_active,
.small_btn .btn_inactive,
.small_btn .btn_red {
	height: 32px;
	line-height: 29px;
	font-size: .85em;
	box-shadow: 0 2px 0 1px rgba(0,0,0,0.25);
}
.small_btn button.btn_inactive {
	background: linear-gradient(180deg,   #eee 0%,   #eee 50%,   #ddd 50%,   #ddd 100%);
	font-weight: bold;
	color: #aaa;
	border: solid 2px #fff;
	border-radius: 3px;
	padding: 0 12px;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0,     #fff -1px 1px 0, #fff 1px -1px 0,     #fff 0px 1px 0, #fff  0-1px 0,     #fff -1px 0 0, #fff 1px 0 0;
}
.float_48 {
	width: 49%;
	padding: 0 1% 0 2%;
}
.line_frame_yellow .line_frame_margin .float_48 a,
.line_frame_blue .line_frame_margin .float_48 a,
.line_frame_yellow .line_frame_margin .list_f a,
.line_frame_blue .line_frame_margin .list_f a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
}
.line_frame_yellow .line_frame_margin .float_48 a.battle,
.line_frame_blue .line_frame_margin .float_48 a.battle,
.line_frame_yellow .line_frame_margin .list_f a.battle,
.line_frame_blue .line_frame_margin .list_f a.battle {
	position: relative;
	text-decoration: none;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
}
.line_frame_yellow .line_frame_margin .area_float_right .btn_long,
.line_frame_blue .line_frame_margin .area_float_right .btn_long,
.line_frame_yellow .line_frame_margin .area_abs_right .btn_long,
.line_frame_blue .line_frame_margin .area_abs_right .btn_long,
.line_frame_yellow .line_frame_margin .area_abs_right_thin .btn_long,
.line_frame_blue .line_frame_margin .area_abs_right_thin .btn_long {
	text-align: right !important;
}
.line_frame_margin h4 {
	color: #88bea6;
	font-size: 1.1em;
}
a.battle_input,
.battle_input {
	line-height:3.25em;
}
/* ページング */
.paging,
.paging_single {
	vertical-align: middle;
	text-align: center;
	padding-top: 4px;
}
.paging a p,
.paging_single a {
	font-weight: bold;
}
.paging p.page_number,
.paging a p.page_number{
	margin: 0 4px 4px;
	padding : 2px 4px 0px;
	text-decoration: none;
	font-weight: bold;
	line-height: 15px;
	color: #B3B3B3;
	border-width: 1px;
	border-color: #B3B3B3;
	border-style: solid;
	background-color: #FFFFFF;
}
.paging p.current_page_number{
	margin: 0 4px 4px;
	padding : 2px 4px 0px;
	text-decoration: none;
	font-weight: bold;
	line-height: 15px;
	color: #488da9;
	border-width: 1px;
	border-color: #488da9;
	border-style: solid;
	background-color: #FFFFFF;
}
.paging p,
.paging a,
.paging_single a {
	display: inline-block;
	text-decoration: none;
}
.paging p:nth-child(2){
	display: inline-block;
	background: #fff;
	color: #999;
	border: 1px solid #edf2fa;
	padding: 2px 12px 1px 12px;
	border-radius: 100px;
	font-size: 0.7em;
}
.paging p:nth-child(1),
.paging p:nth-child(3){
	color: #ccc;
	padding: 3px 16px 6px 12px;
	font-size: 1.25em;
}
.paging a p:nth-child(1),
.paging a p:nth-child(3){
	color: #b8a347 !important;
	background: none;
	padding: 3px 12px 6px 16px;
	font-size: 1.25em;
	border-radius: 3px;
	/*border: solid 2px #d89bb3;*/
	box-sizing: border-box;
}
.paging_single a,
.paging_single span {
	font-size: .9em;
	margin: 0 .25em;
	border-style: none;
	padding: 2px 4px 1px 4px;
}
.paging_single span {
	color: #aaa;
}
.paging_single span.current {
	border-bottom: 2px solid #ccc;
	padding: 2px 6px 1px 6px;
}
.paging_single a {
	color: #948cfa;
}
/* 画像3列 */
ul.image_list_3 {
	text-align: center;
	padding: 4px 0;
}

ul.image_list_3 li {
	display: inline-block;
	width: 28%;
	margin: 0 4px;
}

ul.image_list_3 li img {
	width: 100%;
	height: auto;
}

img.w10  { width:  10%; height: auto; }
img.w20  { width:  20%; height: auto; }
img.w30  { width:  30%; height: auto; }
img.w40  { width:  40%; height: auto; }
img.w50  { width:  50%; height: auto; }
img.w60  { width:  60%; height: auto; }
img.w70  { width:  70%; height: auto; }

img.w80  { width:  80%; height: auto; }
img.w90  { width:  90%; height: auto; }
img.w100 { width: 100%; height: auto; }
img.h100 { width: auto; height: 100%; }
img.thumb {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}


/* 画像拡大 */
#image_zoom {
	background: none;
	padding: 12px;
	border: none;
}


/* 数値ボックスと説明が並んだ場合 */
.column_2 {
	padding: 4px 0;
	margin: 0 4px 0 6px;
}

.column_2 .area02 {
	font-size: .85em;
	width: 32%;
}

.column_2 .area02 .text {
	padding: 0;
	margin: 0;
}
/* ログインボーナス */
/*#loginb {
	padding-bottom: 24px;
}*/
.modal-content .title_big {
	margin-top: 0;
}
.loginb_img {
	width: 100%;
	text-align: center;
	padding: 12px 0;
}
.loginb_img img {
	display: inline-block;
	width: 20%;
	height: auto;
	vertical-align: bottom;
	margin: 0 12px;
	/*border-radius: 10px;
	border: 2px solid #def1f6; */
}
.area_stamp {
	text-align: center;
	width: 98%;
	margin: .75em auto;
	padding: .5em;
	box-sizing: border-box;
	z-index: -1;
	background-color: rgba(255,255,255,1);
	border: 1px solid #f5effc;
	border-radius: 2px;
}
.area_stamp img {
	width: 18%;
	box-sizing: border-box;
	padding: 2px 4px;
	vertical-align: middle;
}
.hide { display: none; }
.block { display: block; }
.inline { display: inline; }
.inline-block { display: inline-block; }
/* テロップ */
.terop {
	position:relative;
	width: 100%;
	margin: 0 0 12px 0;
	padding: 5px 12px 6px 12px;
	line-height: 22px;
	-webkit-box-shadow: 0 2px #716c76;
	   -moz-box-shadow: 0 2px #716c76;
	    -ms-box-shadow: 0 2px #716c76;
	     -o-box-shadow: 0 2px #716c76;
	        box-shadow: 0 2px #716c76;
	font-weight: bold;
	font-size: 12.5px;
	color: #fff;
	background-color: #4e4953;
	box-sizing: border-box;
	z-index: 1;
}
.terop a {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.terop_inner {
	margin: 0 1px;
	overflow: hidden;
}
.terop_inner span:after {
	content: "詳細を見る";
	border: solid 1px #ccc;
	background: #fff;
	color: #ff335f;
	box-shadow: 0 2px rgba(0, 0, 0, 0.5);
	padding: 2px 6px;
	margin: 2px 0 2px 8px;
	font-size: .9em;
	border-radius: 6px;
	box-sizing: border-box;
	vertical-align: top;
}

/* 決済画面 */
.table_frame_yellow img,
.table_frame_blue img,
.table_frame_pink img {
	border-style: none;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	    -ms-border-radius: 3px;
	     -o-border-radius: 3px;
	        border-radius: 3px;
}

.table_frame_yellow,
.table_frame_blue,
.table_frame_pink,
.table_frame_violet {
	background-color: #f2f1e9;
	border: solid 3px rgba(255, 255, 255, 1);
	box-sizing: border-box;
		width: 78%;
	padding: 3px 0;
	margin: 2% 11%;
	position: relative;
	-webkit-border-radius: 2px;
	   -moz-border-radius: 2px;
	    -ms-border-radius: 2px;
	     -o-border-radius: 2px;
	        border-radius: 2px;
	-webkit-box-shadow:0 2px 0 rgba(0,0,0, .15);
	   -moz-box-shadow:0 2px 0 rgba(0,0,0, .15);
	    -ms-box-shadow:0 2px 0 rgba(0,0,0, .15);
	     -o-box-shadow:0 2px 0 rgba(0,0,0, .15);
	        box-shadow:0 2px 0 rgba(0,0,0, .15);
}
.table_frame_yellow:before,
.table_frame_blue:before,
.table_frame_pink:before,
.table_frame_violet:before {
	display: block;
	outline-offset: -4px;
		box-sizing: border-box;
		content: "";
	width: calc(100% + 7px);
	height: calc(100% + 6px);
	border: solid 1px #d1d4e3;
	position: absolute;
	margin: -6px 0 0 -3px;
	border-radius: 2px;
}
.table_frame_yellow .btn_long {
	padding: 0;
}

ul.incentive li {
	display: block !important;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: 0 auto;
	padding: 0;
	font-size: 1.0em;
	line-height: 2.75em;
}

/* 読切シナリオ */
div.chapter_title > div {
	display: block;
	background-color: #d2ebec;
	border-bottom: solid 1px #91b3b5;
	margin-bottom: 2px;
	padding: 0 30px;
	position: relative;
	font-size: 1.1em;
	text-align: left;
	text-decoration: none;
	clear: both;
}

div.chapter_title div.inactive {
	background-color: #c9c9c9;
	border-bottom: solid 1px #999999;
}

div.chapter_title div.chapter {
	float: left;
	text-align: left;
	margin: 1em 0 0;
}

div.chapter_title div.btn_long {
	padding: 6px 0 0;
}
div.greeting_template > div {
	display: block;
	background-color: #d2ebec;
	border-bottom: solid 1px #91b3b5;
	padding: 0 16px;
	margin-bottom: 1px;
	position: relative;
	font-size: 1.1em;
	text-align: left;
	text-decoration: none;
	clear: both;
	font-weight: bold;
	color: #000;
}

div.greeting_template div.comment {
	float: left;
	text-align: left;
	padding-top: 16px;
}

div.greeting_template p {
	font-weight: normal;
}

/* 20161028 アバターショップUI更新 */
.tab{
	overflow: hidden;
	width:90%;
	margin: 16px auto 0 auto;
	text-align: center;
}
.tab a {
	text-decoration: none;
}
.tab .tab_li {
	background: #f1f1f1;
	width: 23%;
	padding: 0.5em 0;
	float:left; 
	margin: 4px 1% 0 1%;
	font-weight: bold;
	font-size: 1em;
	-webkit-border-radius: 2px 2px 0 0;
	   -moz-border-radius: 2px 2px 0 0;
	    -ms-border-radius: 2px 2px 0 0;
	     -o-border-radius: 2px 2px 0 0;
	        border-radius: 2px 2px 0 0;
	text-shadow: 1px 1px #fff;
	-webkit-box-shadow: 2px 2px rgba(0, 0, 0, 0.15);
	   -moz-box-shadow: 2px 2px rgba(0, 0, 0, 0.15);
	    -ms-box-shadow: 2px 2px rgba(0, 0, 0, 0.15);

	     -o-box-shadow: 2px 2px rgba(0, 0, 0, 0.15);
	        box-shadow: 2px 2px rgba(0, 0, 0, 0.15);
}
.tab .tab_li2 {
	background: #f1f1f1;
	width: 31%;
	padding: 0.5em 0;
	float:left; 
	margin: 4px 1% 0 1%;
	font-weight: bold;
	font-size: 1em;
	-webkit-border-radius: 2px 2px 0 0;
	   -moz-border-radius: 2px 2px 0 0;
	    -ms-border-radius: 2px 2px 0 0;
	     -o-border-radius: 2px 2px 0 0;
	        border-radius: 2px 2px 0 0;
	text-shadow: 2px 1px #fff;
	-webkit-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
	   -moz-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
	    -ms-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
	     -o-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
	        box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
}
.tab .tab_li3 {
	background: #f1f1f1;
    width: 23%;
    padding: 0.5em 0;
    float: left;
    margin: 4px 1% 0 1%;
    font-weight: bold;
    font-size: 1em;
    -webkit-border-radius: 2px 2px 0 0;
    -moz-border-radius: 2px 2px 0 0;
    -ms-border-radius: 2px 2px 0 0;
    -o-border-radius: 2px 2px 0 0;
    border-radius: 2px 2px 0 0;
    text-shadow: 1px 1px #fff;
    -webkit-box-shadow: 3px 3px rgb(0 0 0 / 15%);
    -moz-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
    box-shadow: 3px 3px rgb(0 0 0 / 15%);
}
.tab .tab_li4 {
	background: #f1f1f1;
    width: 18%;
    padding: 0.5em 0;
    float: left;
    margin: 4px 1% 0 1%;
    font-weight: bold;
    font-size: 1em;
    -webkit-border-radius: 2px 2px 0 0;
    -moz-border-radius: 2px 2px 0 0;
    -ms-border-radius: 2px 2px 0 0;
    -o-border-radius: 2px 2px 0 0;
    border-radius: 2px 2px 0 0;
    text-shadow: 1px 1px #fff;
    -webkit-box-shadow: 3px 3px rgb(0 0 0 / 15%);
    -moz-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 3px 3px rgba(0, 0, 0, 0.15);
    box-shadow: 3px 3px rgb(0 0 0 / 15%);
}
.tab .textcolor_my {
	color: #f87faa;
}
.tab .textcolor_his {
	color: #7dd5fa;
}
.tab .textcolor_rec {
	color: #bcb910;
}
.tab .textcolor_small {
	color: #9e81cf;
}
.tab .select,
.tab .select_his,
.tab .select_rec,
.tab .select_small {
	font-weight: bold;
	font-size: 1em;
	border: none;
	text-shadow: none;
}
.tab .select {
	color: #fff;
	background:-webkit-linear-gradient(top, #ffabd2 12%, #ff91b8 13%);
	background:   -moz-linear-gradient(top, #ffabd2 12%, #ff91b8 13%);
	background:    -ms-linear-gradient(top, #ffabd2 12%, #ff91b8 13%);
	background:     -o-linear-gradient(top, #ffabd2 12%, #ff91b8 13%);
	background:        linear-gradient(to bottom, #ffabd2 12%, #ff91b8 13%);
}
.tab .select_his {
	color: #fff;
	background:-webkit-linear-gradient(top, #a7ebff 12%, #7dd5fa 13%);
	background:   -moz-linear-gradient(top, #a7ebff 12%, #7dd5fa 13%);
	background:    -ms-linear-gradient(top, #a7ebff 12%, #7dd5fa 13%);
	background:     -o-linear-gradient(top, #a7ebff 12%, #7dd5fa 13%);
	background:        linear-gradient(to bottom, #a7ebff 12%, #7dd5fa 13%);
}
.tab .select_rec {
	color: #fff;
	text-shadow: #acab15 1px 1px 0, #acab15 -1px -1px 0,/*右下、左上*/
    #acab15 -1px 1px 0, #acab15 1px -1px 0,/*右上、左下*/
    #acab15 0px 1px 0, #acab15  0-1px 0,/*右、左*/
    #acab15 -1px 0 0, #acab15 1px 0 0;
	background:-webkit-linear-gradient(top, #fffc2d 12%, #f2ef02 13%);
	background:   -moz-linear-gradient(top, #fffc2d 12%, #f2ef02 13%);
	background:    -ms-linear-gradient(top, #fffc2d 12%, #f2ef02 13%);
	background:     -o-linear-gradient(top, #fffc2d 12%, #f2ef02 13%);
	background:        linear-gradient(to bottom, #fffc2d 12%, #f2ef02 13%);
}
.tab .select_small {
	color: #fff;
	background:-webkit-linear-gradient(top, #d7beed 12%, #b9a2e2 13%);
	background:   -moz-linear-gradient(top, #d7beed 12%, #b9a2e2 13%);
	background:    -ms-linear-gradient(top, #d7beed 12%, #b9a2e2 13%);
	background:     -o-linear-gradient(top, #d7beed 12%, #b9a2e2 13%);
	background:        linear-gradient(to bottom, #d7beed 12%, #b9a2e2 13%);
}
.tab_content {
	background: #fff;
	border-bottom: solid 1px #e0cb63;
}
.tab_contentt .tab_cont_li {
	padding: 0;
}
.hide {
	display:none;
}
.tab_content,
.tab_top {
	border-top: solid 2px #ff91b8;
	background: rgba(231, 233, 239, .5);
}
.tab_top_his {
	border-top: solid 2px #7dd5fa;
	background: rgba(231, 233, 239, .5);
}
.tab_top_rec {
	border-top: solid 2px #f2ef02;
	background: rgba(231, 233, 239, .5);
}

#forcecentered ul {
	width: 2070px !important;
	overflow: hidden;
}



/* ラジオボタン */
.custom02 {
	padding: 12px 0;
	margin: 4px 0 2px 0;
	/*ackground: rgba(255,255,255,0.4);*/
}
/*.tab_top .custom02 {
	background: rgba(255,255,255,0.55);
}*/
.tab_top_rec .custom02 {
	background: transparent ;
}
/*.tab_content.tab_top_rec {
	border-bottom: solid 2px #f2ef02;
	box-shadow: 0 1px 0 0 #efefef;
}*/
.custom02 input[type="radio"] {
	display: none;
}
.custom02 label {
	background: #d2c48b;
	border: 1px solid #ddd;
	position: relative;
	display: inline-block;
	padding: 8px 8px 8px 28px;
	cursor: pointer;
	margin: 0 2%;
	color: #fff;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	    -ms-border-radius: 3px;
	     -o-border-radius: 3px;
	        border-radius: 3px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	box-sizing: border-box;
}
.custom02 label::before,
.custom02 label::after {
	position: absolute;
	content: '';
	top: 50%;
	-webkit-border-radius: 100%;
	   -moz-border-radius: 100%;
	    -ms-border-radius: 100%;
	     -o-border-radius: 100%;
	        border-radius: 100%;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
	    -ms-transition: all .2s;
	     -o-transition: all .2s;
	        transition: all .2s;
}
.custom02 label::before {
	left: 8px;
	width: 14px;
	height: 14px;
	margin-top: -8px;
	background: #fff;
	border: 1px solid #e5e5e5;
}
.custom02 label:hover::before {
	background: #fff;
}
.custom02 label::after {
	opacity: 0;
	left: 12px;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	background: #a58f33;
}
.custom02 input[type="radio"]:checked + label::before {
	background: #fff;
	border: 1px solid #e5e5e5;
}
.custom02 input[type="radio"]:checked + label::after {
	opacity: 1;
}

.custom02 input[type="radio"]:checked + label {
	background: #ccb043;
	color: #fff;
	font-weight: bold;
	/*text-shadow: #d28831 1px 1px 0, #d28831 -1px -1px 0, #d28831 -1px 1px 0, #d28831 1px -1px 0, #d28831 0px 1px 0, #5998a8  0-1px 0, #d28831 -1px 0 0, #d28831 1px 0 0;*/
}

body { background: none; }
.container { margin: 0 auto; }

/* Example wrapper */
.wrap {
	position: relative;
	margin: 0 /*24px*/ ;
}

/* Frame */
.frame {
	height: 72px;
	line-height: 72px;
	overflow: hidden;
}
.frame ul {
	list-style: none;
	margin: 0;
	padding: 0;
	height: 100%;
	font-size: 1em;
}
.frame ul li {
	float: left;
	width: 80px ;
	height: 100%;
	margin: 0 1px 0 0;
	padding: 0;
	background: #333;
	color: #ddd;
	text-align: center;
	cursor: pointer;
}

.frame ul li#fwearing {
	background: url(../img/avatarshop/shopmenu_ware.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#fall {
	background: url(../img/avatarshop/shopmenu_fall.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#set {
	background: url(../img/avatarshop/shopmenu_set.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#shoes {
	background: url(../img/avatarshop/shopmenu_shoes.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#fashionacce {
	background: url(../img/avatarshop/shopmenu_fashionacce.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#avatarback {
	background: url(../img/avatarshop/shopmenu_avatarback.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hair {
	background: url(../img/avatarshop/shopmenu_hair.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#make {
	background: url(../img/avatarshop/shopmenu_make.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#tops {
	background: url(../img/avatarshop/shopmenu_tops.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#bottoms {
	background: url(../img/avatarshop/shopmenu_bottoms.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#auter {
	background: url(../img/avatarshop/shopmenu_auter.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#accessory {
	background: url(../img/avatarshop/shopmenu_accessory.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}

.frame ul li#hiswearing {
	background: url(../img/avatarshop/shopmenu_hisware.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisall {
	background: url(../img/avatarshop/shopmenu_mall.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#histops {
	background: url(../img/avatarshop/shopmenu_histops.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisbottoms {
	background: url(../img/avatarshop/shopmenu_hisbottoms.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisset {
	background: url(../img/avatarshop/shopmenu_hisset.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisshoes {
	background: url(../img/avatarshop/shopmenu_hisshoes.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisaccessory {
	background: url(../img/avatarshop/shopmenu_hisaccessory.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisfashionacce {
	background: url(../img/avatarshop/shopmenu_hisfashionacce.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisauter {
	background: url(../img/avatarshop/shopmenu_hisouter.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hishair {
	background: url(../img/avatarshop/shopmenu_hishair.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisface {
	background: url(../img/avatarshop/shopmenu_hisface.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallwearing {
	background: url(../img/avatarshop/shopmenu_smallware.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallall {
	background: url(../img/avatarshop/shopmenu_small.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallleft {
	background: url(../img/avatarshop/shopmenu_smallleft.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallcenter {
	background: url(../img/avatarshop/shopmenu_smallcenter.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallright {
	background: url(../img/avatarshop/shopmenu_smallright.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}

.frame ul li#smallroomwearing {
	background: url(../img/avatarshop/shopmenu_smallroomware.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomall {
	background: url(../img/avatarshop/shopmenu_smallroom.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomclothes {
	background: url(../img/avatarshop/shopmenu_smallroomclothes.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomfurniture {
	background: url(../img/avatarshop/shopmenu_smallroomfurniture.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomavatarback {
	background: url(../img/avatarshop/shopmenu_smallroomavatarback.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomaccessory {
	background: url(../img/avatarshop/shopmenu_smallroomaccessory.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomhairface {
	background: url(../img/avatarshop/shopmenu_smallroomhairface.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}


.frame ul li.active {
	color: #fff;
	background: #a03232;
}

.frame ul li#fwearing.active {
	background: url(../img/avatarshop/shopmenu_ware_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#fall.active {
	background: url(../img/avatarshop/shopmenu_fall_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#make.active {
	background: url(../img/avatarshop/shopmenu_make_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#set.active {
	background: url(../img/avatarshop/shopmenu_set_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#shoes.active {
	background: url(../img/avatarshop/shopmenu_shoes_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#fashionacce.active {
	background: url(../img/avatarshop/shopmenu_fashionacce_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#avatarback.active {
	background: url(../img/avatarshop/shopmenu_avatarback_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hair.active {
	background: url(../img/avatarshop/shopmenu_hair_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#make.active {
	background: url(../img/avatarshop/shopmenu_make_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#tops.active {
	background: url(../img/avatarshop/shopmenu_tops_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#bottoms.active {
	background: url(../img/avatarshop/shopmenu_bottoms_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#auter.active {
	background: url(../img/avatarshop/shopmenu_auter_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#accessory.active {
	background: url(../img/avatarshop/shopmenu_accessory_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}

.frame ul li#hiswearing.active {
	background: url(../img/avatarshop/shopmenu_hisware_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisall.active {
	background: url(../img/avatarshop/shopmenu_mall_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#histops.active {
	background: url(../img/avatarshop/shopmenu_histops_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisbottoms.active {
	background: url(../img/avatarshop/shopmenu_hisbottoms_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}

.frame ul li#hisset.active {
	background: url(../img/avatarshop/shopmenu_hisset_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisshoes.active {
	background: url(../img/avatarshop/shopmenu_hisshoes_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisaccessory.active {
	background: url(../img/avatarshop/shopmenu_hisaccessory_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisfashionacce.active {
	background: url(../img/avatarshop/shopmenu_hisfashionacce_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisauter.active {
	background: url(../img/avatarshop/shopmenu_hisouter_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hishair.active {
	background: url(../img/avatarshop/shopmenu_hishair_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#hisface.active {
	background: url(../img/avatarshop/shopmenu_hisface_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallwearing.active {
	background: url(../img/avatarshop/shopmenu_smallware_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallall.active {
	background: url(../img/avatarshop/shopmenu_small_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallleft.active {
	background: url(../img/avatarshop/shopmenu_smallleft_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallcenter.active {
	background: url(../img/avatarshop/shopmenu_smallcenter_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallright.active {
	background: url(../img/avatarshop/shopmenu_smallright_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomwearing.active {
	background: url(../img/avatarshop/shopmenu_smallroomware_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomall.active {
	background: url(../img/avatarshop/shopmenu_smallroom_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomclothes.active {
	background: url(../img/avatarshop/shopmenu_smallroomclothes_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomfurniture.active {
	background: url(../img/avatarshop/shopmenu_smallroomfurniture_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomavatarback.active {
	background: url(../img/avatarshop/shopmenu_smallroomavatarback_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomaccessory.active {
	background: url(../img/avatarshop/shopmenu_smallroomaccessory_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.frame ul li#smallroomhairface.active {
	background: url(../img/avatarshop/shopmenu_smallroomhairface_y.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}




/* Scrollbar */
.scrollbar {
	margin: 0;
	height: 2px;
	background: #ccc;
	line-height: 0;
}
.scrollbar .handle {
	width: 100px;
	height: 100%;
	background: #292a33;
	cursor: pointer;
}
.scrollbar .handle .mousearea {
	position: absolute;
	top: -9px;
	left: 0;
	width: 100%;
	height: 20px;
}

/* Pages */
.pages {
	list-style: none;
	margin: 20px 0;
	padding: 0;
	text-align: center;
}
.pages li {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin: 0 4px;
	text-indent: -999px;
	-webkit-border-radius: 10px;
	   -moz-border-radius: 10px;
	    -ms-border-radius: 10px;
	     -o-border-radius: 10px;
	        border-radius: 10px;
	cursor: pointer;
	overflow: hidden;
	background: #fff;
	-webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
	   -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
	    -ms-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
	     -o-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
	        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
}
.pages li:hover {
	background: #aaa;
}
.pages li.active {
	background: #666;
}

/* Controls */
.controls {
	margin: 25px 0;
	text-align: center;
}

/* One Item Per Frame example*/
.oneperframe {
	height: 300px;
	line-height: 300px;
}
.oneperframe ul li {
	width: 1140px;
}
.oneperframe ul li.active {
	background: #333;
}

/* Crazy example */
.crazy ul li:nth-child(2n) {
	width: 100px;
	margin: 0 4px 0 20px;
}
.crazy ul li:nth-child(3n) {
	width: 300px;
	margin: 0 10px 0 5px;
}
.crazy ul li:nth-child(4n) {
	width: 400px;
	margin: 0 30px 0 2px;
}

/* page arrow */
.wrap {
	position: relative;
}
.bpstyle,
.bnstyle,
.bpstyle_his,
.bnstyle_his,
.bpstyle_sdroom,
.bnstyle_sdroom {
	position: absolute;
	top: 21px;
	width: 26px;
	height: 26px;
}
.bpstyle p,
.bnstyle p,
.bpstyle_his p,
.bnstyle_his p,
.bpstyle_sdroom p,
.bnstyle_sdroom p,
.frame ul li p {
	visibility: hidden;
}
.bpstyle, .bpstyle_his, .bpstyle_sdroom {
	left: 0 ;
}
.bnstyle, .bnstyle_his, .bnstyle_sdroom {
	right: 0 ;
}
.bpstyle {
	background: url(../img/avatarshop/shopmenu_left.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.bnstyle {
	background: url(../img/avatarshop/shopmenu_right.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.bpstyle_his {
	background: url(../img/avatarshop/shopmenu_left.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.bnstyle_his {
	background: url(../img/avatarshop/shopmenu_right.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.bpstyle_sdroom {
	background: url(../img/avatarshop/shopmenu_left.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}
.bnstyle_sdroom {
	background: url(../img/avatarshop/shopmenu_right.png);
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	    -ms-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}

.marginbottom-8 { margin-bottom: -8px; }

.slide {
	position: relative;
	width: 100%;
	height: auto;
	margin-bottom: 36px;
	margin-top: 12px;
}

.slide ul.variable {
	margin: 0 auto;
	width: 88%;
}

.slide ul.variable img {
	width: 100%;
	height: auto;
}

.title_big_h2p {
	width: 100%;
	text-align: right;
	padding: 0;
	background: url(../img/mypage/title_big.png) bottom repeat-x;
	-webkit-background-size: contain;
	   -moz-background-size: contain;
	    -ms-background-size: contain;
	     -o-background-size: contain;
	        background-size: contain;
	color: #e94f57;
	font-weight: bold;
	margin: 24px 0 6px 0;
	position: relative;
}

.title_big_h2p img {

	position: absolute;
	left: 12px;
	bottom: 0;
	width: 135px !important;
}

.title_big_h2p p {
	vertical-align: middle;
	margin: 0 24px;
	padding: 7px 0 5px 0 !important;
}
/* セール時用スタイル start */
/*割引時取り消し線*/
.discount_line{
    text-decoration:line-through;
    color:#03f;
    margin-right:10px;
}
/*割引時三角矢印*/
.arrow_blue {
    position: relative;
    display: inline-block;
    padding-left: 12px;
}
.arrow_blue:before {
    content: '';
    width: 0;
    height: 0;
    border: solid 5px transparent;
    border-left: solid 10px #03f;
    position: absolute;
    top: 40%;
    left: 0;
    margin-top: -4px;
}
/* セール時用スタイル end */

/* 玉手箱ゲーム用スタイル start */
.pointer{
    cursor: pointer;
}
.tamate_liner{
    padding: .5em .75em;
    background-color: #339;
    color: #fff;
    font-size: 1.0em;
    border-radius: 6px;
}
.tamate_box_bg{
    background-color: rgba(51, 255, 255, 0.09);
    border: solid 3px #c8fafa;
    min-height:135px;
}
.tamate_box_img{
    width:140px;
    cursor: pointer;
}
.tamate_reward_exchange_btn_area{
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 210px;
}
#tamate_lead{
    padding: 5px;
    margin: 2% 5%;
}
/*#tamate_free_area{
    padding: 5px;
    margin: 2% 5% 0 5%
}*/
#tamate_reward_notes_area{
    padding: 5px;
    margin: 2% 5%;
}
#tamate_notes{
    text-align: left;
    list-style:disc outside;
    padding-left: 15px;
}
#tamate_notes li{
    display:list-item;
}
/* 玉手箱ゲーム用スタイル end　*/

/* アバター用スタイル start */
.favoriteLink{
    position:absolute;
    top:30%;
    font-size:20px;
    text-decoration:none;
}
/* アバター用スタイル end　*/
/* margin調整用 */
.chosei_top08 {
	margin-top: 8px;
}
#content .right a {
    font-size: .8em;
    font-weight: bold;
    padding: 3px 1em;
    /*border-radius: 100px;*/
    text-decoration: none;
    /*border: solid 1px #f2ff7d;*/
    box-sizing: border-box;
}
span.game_h2p {
	padding: 4px 8px;
	font-size: 1.15em;
	font-weight: bold;
	color: #88a5e7;
	background: #b8a347;
	border-radius: 100px;
	color: #fff;
	margin-left: 8px;
	border-style: none;
}
.rec_catch h1 {
	margin: 0 0 0 8px;
	padding: 0 0 4px 4px;
	line-height: 1.35em;
}
button.slick-next,
button.slick-prev,
.slick-dots li button{
	   background-color: transparent;
        border: none;
        cursor: pointer;
        outline: none;
        padding: 0;
	box-shadow: none;
	transform: none;
	top: 0;
	text-shadow: none;
}
.tab_cont_li button {
	box-shadow: none;
	border: none;
}
.fav_position {
	position: absolute;
	right: 3em;
}
.fav_comment {
	text-align: right;
	font-size: .9em;
	margin-top: -2px;
	color: #ab9c5b;
	margin: 10px 12px;
	z-index: 3;
	position: relative;
}
.fav_comment a {
	text-decoration: none;
}
.fav_comment .favoriteLink {
	top: 5px;
	position: relative;
}
.fav_comment .react {
	margin-right: 8px;
	background: #fff;
	color: #ab9c5b;
	padding: 6px calc(10px - .1em) 6px 10px;
	border: solid 1px #e5e5e5;
	border-radius: 2px;
	font-weight: bold;
	margin-top: -4px;
}
.fav_comment img.react {
	font-size: 14px;
	border: none;
	background: transparent;
    padding: 0;
    margin-bottom: -1px;
    margin-right: 4px;

}
.fav_comment span.aline {
	vertical-align: 1px;
}
a.favoriteLink img {
	width: 1.5em; height: auto;
}
img.fav_btn {
	width: 1.1em; height: auto;
	bottom: 2px;
	vertical-align: middle;
	position: relative;
}
.marT10 { margin-top : 10px !important; }
.list_d a h1 {
	color: #ab9c5b;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
.list_d a {
text-decoration: none;
}
#main_visual .member_comment {
    text-align: center;
    padding: 8px 12px;
}
#main_visual .member_comment:before {
	content: "";
	top: 0;
	left: 0;
	margin: -3px 0 0 -3px;
	position: absolute;
	border: solid 1px #c5b057;
	width: calc(100% + 4.5px);
	height: calc(100% + 4px);
	border-radius: 100px;
	/*background-image: ;*/
	background-position: 99% 94%;
	background-size: auto 27%;
	background-repeat: no-repeat;
}
/* 報酬一覧 */
.incen_img {
	margin: 2px;
	border-radius: 3px;
	box-sizing: border-box;
	background-color: #ebe0ff;
	background-size: 50px;
	background-image: url(img/bg_incen.svg);
	background-repeat: repeat;
	border: solid 2px #d4bffa;
}

.incen_frame span.spsmall {
	font-size: .5em;
}
/*
	-webkit-animation: bgiLoop 30s linear infinite;
  	animation: bgiLoop 30s linear infinite;
}
@-webkit-keyframes bgiLoop {
    0% { background-position: 0 0;}
  100% { background-position: 200px -400px;}
}
@keyframes bgiLoop {
    0% { background-position: 0 0;}
  100% { background-position: 200px -400px;}
}*/
.incen_img p.caution {
	line-height: 1.5em;
}
.rank_img1, .rank_img2 {
	display: block;
	margin: 0 auto -10px auto;
	max-width: 86px !important;
	position: relative;
	z-index: 2;
}
.rank_img1 {
	width: 40%;
}
.rank_img2 {
	width: 40%;
}
.rank_ribbon {
	text-align: center;
	padding-top: 8px;
	position: relative;
	z-index: 1;
}
.ribbon7 {
  display: inline-block;
  position: relative;
  height: 36px;
  vertical-align: middle;
  text-align: center;
  box-sizing: border-box;
box-shadow: 0 3px 0 rgba(0,0,0,.25);
	min-width: 75%;
}
.ribbon7:before {
  content: '';
  position: absolute;
  width: 10px;
  bottom: -10px;
  left: -25px;
  z-index: 0;
  border: 15px solid #d63023;
  border-left-color: transparent;
box-shadow: 0 3px 0 rgba(0,0,0,.25);
}
.ribbon7:after {
  content: '';
  position: absolute;
  width: 10px;
  bottom: -10px;
  right: -25px;
  z-index: 0;
  border: 15px solid #d63023;
  border-right-color: transparent;
	box-shadow: 0 3px 0 rgba(0,0,0,.25);
}
.ribbon7 h3 {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 20px;
  line-height: 36px;
  font-size: 1.25em;
  color: #fdff8a;
  background: -webkit-repeating-linear-gradient(-45deg, #f8716c, #f8716c 3px,#f75e59 3px, #f75e59 7px);
    background: repeating-linear-gradient(-45deg, #f8716c, #f8716c 3px,#f75e59 3px, #f75e59 7px);
	z-index: 1;
	font-weight: bold;
	text-shadow: #d63023 1px 1px 0, #d63023 -1px -1px 0,
 #d63023 -1px 1px 0, #d63023 1px -1px 0,
 #d63023 0px 1px 0, #d63023 0-1px 0,
 #d63023 -1px 0 0, #d63023 1px 0 0;
	width: 100%;
	box-sizing: border-box;
}
.ribbon7 h3:before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-right: solid 15px #83001c;
}
.ribbon7 h3:after {
  position: absolute;
  content: '';
  top: 100%;
  right: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-left: solid 15px #83001c;
}
.incen_frame {
	background-color: #f2f1e9;
	text-align: center;
	font-style: oblique;
	font-weight: bold;
	font-size: 18px;
	color: #cd9817;
	line-height: 1em;
	margin-bottom: 4% !important;
	padding: 8px !important;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff  0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
	border: solid 3px rgba(255, 255, 255, 1);
}
.incen_frame:before {
	display: block;
	/*outline: solid 1px #d9b63b;*/
	/*outline-offset: -4px;*/
		box-sizing: border-box;
		content: "";
	width: calc(100% + 8px) !important;
	height: calc(100% + 7px) !important;
	border: solid 1px #e2ce9c !important;
	position: absolute;
	margin: -11.5px 0 0 -11px !important;
	border-radius: 8px;
}
.incen_frame span {
	font-size: .8em;
	line-height: 1em;
}
.incen_frame span span.incen_subtext {
	font-size: .75em;
}
.half_frame, .third_frame{
	font-size: 1.1em;
	display: inline-block;
	box-sizing: border-box;
	text-align: center;
	font-size: 15px;
}
.split {
	position: relative;
	font-size: 0;
}
.split .half_frame span, .split .third_frame span {
	top: 0;
}
.half_frame span.incen_name, .third_frame span.incen_name {
	color: #b1851a;
	font-weight: bold;
	font-size: .7em;
	padding: 1px 2px;
	border-radius: 100px;
	border: solid 1px #d6ba75;
	background: #fefafe;
	box-sizing: border-box;
	display: block;
	margin-bottom: -10px;
}
.half_frame > .table_frame_yellow,
.half_frame > .table_frame_blue,
.half_frame > .table_frame_pink,
.half_frame > .table_frame_violet,
.third_frame > .table_frame_yellow,
.third_frame > .table_frame_blue,
.third_frame > .table_frame_pink,
.third_frame > .table_frame_violet {
	margin: 2% 0 !important;
	width: 100% !important;
	padding-right: .5em;
	padding-left: .5em;
}
.half_frame {
	width: 47% !important;
	margin: 1% 1% 2% 2% !important;
}
.half_frame img {
	/*width: 50%;*/
	display: block;
	margin: 0 auto -10% auto;
}
.half_frame img, .third_frame img {
	border: solid 2px #cf86c9;
	border-radius: 3px;
	box-sizing: border-box;
}
.split .half_frame:nth-child(even){
	margin: 1% 2% 2% 1% !important;
}
.split .third_frame {
	width: 30.6% !important;
	margin: 1% 1% 2% 1% !important;
}
.third_frame img {
	width: 65%;
	display: block;
	margin: 0 auto -10% auto;
}
.third_frame img.yoko {
	width: 100%;
}
.split .third_frame:nth-child(1),
.split .third_frame:nth-child(3n+1) {
	margin: 1% 1% 2% 2% !important;
}
.split .third_frame:nth-child(3n){
	margin: 1% 2% 2% 1% !important;
}
.incen_images20, .incen_images30, .incen_images40, .incen_images50, .incen_images60, .incen_images70, .incen_images80, .incen_images90, .incen_images100 {
	display: block;
	margin: 0 auto;
	box-sizing: border-box;
		/*-webkit-box-shadow:0 3px 0 rgba(0,0,0, .25);
	   -moz-box-shadow:0 3px 0 rgba(0,0,0, .25);
	    -ms-box-shadow:0 3px 0 rgba(0,0,0, .25);
	     -o-box-shadow:0 3px 0 rgba(0,0,0, .25);
	        box-shadow:0 3px 0 rgba(0,0,0, .25);*/
}
.incen_images20, .incen_images30, .incen_images40, .incen_images50, .incen_images60, .incen_images70, .incen_images80, .incen_images90 {
	border: solid 2px #cf86c9;
	border-radius: 3px;
}
.border-cancel {
	border-style: none !important;
}
.incen_images20 {
	width: 20%;
}
.incen_images30 {
	width: 30%;
}
.incen_images40 {
	width: 40%;
}
.incen_images50 {
	width: 50%;
}
.incen_images60 {
	width: 60%;
}
.incen_images70 {
	width: 70%;
}
.incen_images80 {
	width: 80%;
}
.incen_images90 {
	width: 90%;
}
.incen_images100 {
	width: 100%;
}
span.numbering {
	top: 0;
	/*font-weight: bold;*/
	font-size: 1em;
	color: #fff;
	padding: 2px 6px;
	z-index: 99;
	background: #5545ed;
	border-radius: 100px;
	width: auto;
	display: block;
	text-align: right;
	box-sizing: border-box;
	border: solid 1px #7466ef;
	box-shadow: 0 3px rgba(0, 0, 0, 0.25);
	position: relative;
	margin: 0 -1.75em 0 0;
	float: left;
}
.ribbon3 {
  display: inline-block;
  position: relative;
  height: 32px;
  vertical-align: middle;
  text-align: center;
  box-sizing: border-box;
/*box-shadow: 0 3px 0 rgba(0,0,0,.25);*/
	margin-top: -12px;
}
.ribbon3:before {
  content: '';
  position: absolute;
  width: 10px;
  bottom: 12px;
  left: -25px;
  z-index: 0;
  border: 15px solid #8c54e2;
  border-left-color: transparent;
box-shadow: 0 3px 0 rgba(0,0,0,.25);
}
.ribbon3:after {
  content: '';
  position: absolute;
  width: 10px;
  bottom: 12px;
  right: -25px;
  z-index: 0;
  border: 15px solid #8c54e2;
  border-right-color: transparent;
	box-shadow: 0 3px 0 rgba(0,0,0,.25);
}
.ribbon3 h3 {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 4px 20px;
  /*line-height: 32px; */ line-height: 1.3em;
  font-size: 1em;
  color: #FFF;
  background: -webkit-repeating-linear-gradient(-45deg, #af80e9, #af80e9 3px,#ba91ec 3px, #ba91ec 7px);
  background: repeating-linear-gradient(-45deg, #af80e9, #af80e9 3px,#ba91ec 3px, #ba91ec 7px);
	z-index: 1;
	font-weight: bold;
	text-shadow: #8c54e2 1px 1px 0, #8c54e2 -1px -1px 0,     #8c54e2 -1px 1px 0, #8c54e2 1px -1px 0,     #8c54e2 0px 1px 0, #8c54e2  0-1px 0,     #8c54e2 -1px 0 0, #8c54e2 1px 0 0;
}
.ribbon3 h3:before {
  position: absolute;
  content: '';
  top: -10px;
  left: 0;
  border: none;
  border-top: solid 10px transparent;
  border-right: solid 15px #5c2ea2;
}
.ribbon3 h3:after {
  position: absolute;
  content: '';
  top: -10px;
  right: 0;
  border: none;
  border-top: solid 10px transparent;
  border-left: solid 15px #5c2ea2;
}
.ribbon3 h3 span {
	display: inline-block;
}
.incen_avatar {
	position: relative;
}
.incen_avatar .rank_ribbon {
	position: absolute;
	bottom: -24px; 
	left: 50%;
	transform: translate(-50%, -50%);
}
.bl_body {
	display: inline-block;
	margin:0 auto;
}
.block .bl_title .bl_title_inner h2 .p{
	display: inline-block;
	margin: .5em auto;
}
.btn_inactive_input button {
	color: #97863d;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0,
    #fff -1px 1px 0, #fff 1px -1px 0,
    #fff 0px 1px 0, #fff  0-1px 0,
    #fff -1px 0 0, #fff 1px 0 0;
}
.area_item .float_d {
	padding-left: 8px;
}
.paytypelist .btn_active_input {
	margin-top: 12px;
}
.right_btn .btn_long {
	text-align: right;
	margin-right: 8px;
}
label.kakin input {
  line-height: 2.25em;
}
.w60 { width: 60%; }
.w40 { width: 40%; }

p.catch_happy span{
	font-size: 0.75em;
	/*color: #ffc5ee;
	text-shadow: 1px 1px 1px #d276b7, -1px 1px 1px #d276b7, 1px -1px 1px #d276b7, -1px -1px 1px #d276b7, 1px 1px 1px #d276b7, -1px 1px 1px #d276b7, 1px -1px 1px #d276b7, -1px -1px 1px #d276b7, 2px 4px #5a73cc;*/
}
p.catch_happy {
	font-size: 1.75em;
    transform: rotate(-4deg) translate3d(0, 0, 0);;
	border-radius: 2px;
    display: block;
    background: -webkit-repeating-linear-gradient(-45deg, #ee8383, #ee8383 7px,#f4989d 7px, #f4989d 15px);
    background: repeating-linear-gradient(-45deg, #ee8383, #ee8383 7px,#f4989d 7px, #f4989d 15px);
    padding: .15em .15em .4em .15em;
	width: 75%;
	max-width: 500px;
	margin: 0 auto 8px auto;
	line-height: 1.1em;
    font-weight: bold;
    color: #fff;
    box-shadow: 0 2px 0 0 rgba(0,0,0,.2);
    text-shadow: #786fee 1px 1px 0, #786fee -1px -1px 0, #786fee -1px 1px 0, #786fee 1px -1px 0, #786fee 0px 1px 0, #786fee 0-1px 0, #786fee -1px 0 0, #786fee 1px 0 0, 2px 3px #786fee;
	position: relative;
    z-index: 2;
	text-align: center;
	outline: 1px solid transparent;
}
.padT10 {
	padding-top: 10px !important;
}
p.tamate_free_area {
    font-size: .9em;
    color: #97863d;
}
#tamate_lead {
	text-align: center;
}
.tuto .radio_label:before, .tuto .radio_label:after {
    content: none;
}
.tuto .radio_label img {
    width: 75%;
}
.tuto .radio_label {
    padding: 6px 8px;
    text-align: center;
}
.tuto input[type=radio]:checked + .radio_label {
    box-shadow: 0 .5px rgba(0, 0, 0, 0.25);
}
p.early_text {
    font-size: 1.3em;
    vertical-align: baseline;
    line-height: 1.3em;
    text-align: center;
    text-shadow: #d63023 1px 1px 0, #d63023 -1px -1px 0, #d63023 -1px 1px 0, #d63023 1px -1px 0, #d63023 0px 1px 0, #d63023 0-1px 0, #d63023 -1px 0 0, #d63023 1px 0 0;
    font-weight: bold;
    color: #fbff3e;
}
	
.frame_center {	
margin: 1% auto 2%!important;
display: block;
}  
	  
span.reprint {
    background: #c9a81e;
    border: 1px solid #efd55c;
}	  
span.reprint_new {
    background: #5545ed;
    border: solid 1px #7466ef;
}	  
span.signboard,
span.signboard_gold {
	font-size: 1.2em;
    transform: rotate(-10deg);
    display: block;
    background: -webkit-repeating-linear-gradient(-45deg, #d191ec, #d191ec 3px,#c980e9 3px, #c980e9 7px);
    background: repeating-linear-gradient(-45deg, #d191ec, #d191ec 3px,#c980e9 3px, #c980e9 7px);
    padding: .5em;
    position: absolute;
	font-weight: bold;
    left: 12px;
	color: #fff;
    box-shadow: 0 2px 0 0 rgba(0,0,0,.2);
    text-shadow: #b054e2 1px 1px 0, #b054e2 -1px -1px 0, #b054e2 -1px 1px 0, #b054e2 1px -1px 0, #b054e2 0px 1px 0, #b054e2 0-1px 0, #b054e2 -1px 0 0, #b054e2 1px 0 0;
	z-index: 2;
}
span.half_place{
	left: calc(50% + 12px) !important;
}
span.center_place {
	left: calc(25% + 12px) !important;
}
span.signboard_gold {
	background: -webkit-repeating-linear-gradient(-45deg, #edcf45, #edcf45 3px,#e1c139 3px, #e1c139 7px);
    background: repeating-linear-gradient(-45deg, #edcf45, #edcf45 3px,#e1c139 3px, #e1c139 7px);
    text-shadow: #c0a230 1px 1px 0, #c0a230 -1px -1px 0, #c0a230 -1px 1px 0, #c0a230 1px -1px 0, #c0a230 0px 1px 0, #c0a230 0-1px 0, #c0a230 -1px 0 0, #c0a230 1px 0 0;
}
.pickupribbon {
	background: -webkit-repeating-linear-gradient(-45deg, #d191ec, #d191ec 3px,#c980e9 3px, #c980e9 7px);
    background: repeating-linear-gradient(-45deg, #d191ec, #d191ec 3px,#c980e9 3px, #c980e9 7px);
	border-radius: 0px 00px 100px 00px;
	box-sizing: border-box;
	border: solid 2px #d4bffa;
	position: absolute;
	height: 6em;
	width: 6.5em;
	padding: 1.25em .75em .75em .75em;
	margin: 0;
}
.pickupribbon span {
	color: #fff;
	text-shadow: #b054e2 1px 1px 0, #b054e2 -1px -1px 0, #b054e2 -1px 1px 0, #b054e2 1px -1px 0, #b054e2 0px 1px 0, #b054e2 0-1px 0, #b054e2 -1px 0 0, #b054e2 1px 0 0;
	text-align: center;
	font-weight: bold;
	display: table;
	line-height: 1.3em;
	transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
-webkit-transform:rotate(-30deg);
	font-size: .85em;
}
.pickupribbon span.pickribbon_s, .pickupribbon_gold span.pickribbon_s{
	font-size: .7em;
}
.pickupribbon span, .pickupribbon_gold span,
.btn_active_input input, .btn_inactive_input input, .btn_red_input input, .btn_inactive_input_mini input, .btn_red_input button, .btn_active_input button, .btn_inactive_input button {
	background:transparent;
	font-weight: bold;
}
.pickupribbon_gold {
	background: -webkit-repeating-linear-gradient(-45deg, #edcf45, #edcf45 3px,#e1c139 3px, #e1c139 7px);
	background: repeating-linear-gradient(-45deg, #edcf45, #edcf45 3px,#e1c139 3px, #e1c139 7px);
	border-radius: 0px 00px 100px 00px;
	box-sizing: border-box;
	border: 2px solid #d4bffa;
	position: absolute;
	height: 6em;
	width: 6.5em;
	padding: 1.25em .75em .75em .75em;
	margin: 0;
}
.pickupribbon_gold span {
	color: #fff;
    text-shadow: #c0a230 1px 1px 0, #c0a230 -1px -1px 0, #c0a230 -1px 1px 0, #c0a230 1px -1px 0, #c0a230 0px 1px 0, #c0a230 0-1px 0, #c0a230 -1px 0 0, #c0a230 1px 0 0;
	text-align: center;
	font-weight: bold;
	display: table;
	line-height: 1.3em;
	transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
-webkit-transform:rotate(-30deg);
	font-size: .85em;
}
.hec-img{position: relative;
}
.numbering_center .numbering {
	left: 35%;
}
.numbering_quarter .numbering {
	left: 20%;
}
.incen_img img.upper {
	position: relative;
	z-index: 1;
}
.pickupribbon, .pickupribbon_gold {
	z-index: 0;
}

/* ミッション */
.missioncard {
	text-align: center;
	padding: 4px;
	margin: 8px;
	
	/*background: -webkit-repeating-linear-gradient(-90deg, #fff, #fff 1px, #f7ece6 1px, #f7ece6 7px, #fff 7px, #fff 8px, #f2e8ff 8px, #f2e8ff 14px, #fff 14px, #fff 15px, #ffffe2 15px, #ffffe2 21px, #fff 21px, #fff 22px, #ffedf9 22px, #ffedf9 28px);
    background: repeating-linear-gradient(-90deg, #fff, #fff 1px, #f7ece6 1px, #f7ece6 7px, #fff 7px, #fff 8px, #f2e8ff 8px, #f2e8ff 14px, #fff 14px, #fff 15px, #ffffe2 15px, #ffffe2 21px, #fff 21px, #fff 22px, #ffedf9 22px, #ffedf9 28px);*/
	
	background: -webkit-repeating-linear-gradient(105deg, #faf6e8, #faf6e8 7px, #f6e7fd 7px, #f6e7fd 14px, #e3f3f7 14px, #e3f3f7 21px);
    background: repeating-linear-gradient(-15deg, #faf6e8, #faf6e8 7px, #f6e7fd 7px, #f6e7fd 14px, #e3f3f7 14px, #e3f3f7 21px);
	box-sizing: border-box;
	border: 2px solid #f2defc;
	border-radius: 3px;
	-webkit-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    box-shadow: 0 3px rgba(0, 0, 0, 0.15);
}
.missioncard p.mark-purple {
	line-height: 1.35em;
	color: #fff;
	font-size: 1.5em;
	font-weight: bold;
    text-shadow: #b385e8 1px 1px 0, #b385e8 -1px -1px 0, #b385e8 -1px 1px 0, #b385e8 1px -1px 0, #b385e8 0px 1px 0, #b385e8 0-1px 0, #b385e8 -1px 0 0, #b385e8 1px 0 0, 1px 2px #b385e8;
}
.missioncard .area02,
.missionboard li .area02 {
	padding: 4px 4px 0 4px !important;
	position: relative;
	-webkit-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px rgba(0, 0, 0, 0.15);
    box-shadow: 0 3px rgba(0, 0, 0, 0.15);
}
.missioncard .area02 a.flamelink-mi,
.missionboard li .area02 a.flamelink-mi {
	position: absolute;
	top: 0;
  	right: 0;
  	bottom: 0;
  	left: 0;
	z-index: 0;
}
.missioncard .area02 img,
.missionboard li .area02 img {
	width: 65%;
	display: block;
	margin: 6px auto 4px;
	box-sizing: border-box;
}
a.missionlink {
	/*color: #5a73cc !important;*/
	/*text-decoration: none;*/
	font-weight: bold;
}
.missionclear,
.missionboard li .area02 {
	-webkit-box-shadow: 0 0 rgba(0, 0, 0, 0) !important;
    -moz-box-shadow: 0 0 rgba(0, 0, 0, 0) !important;
    -ms-box-shadow: 0 0 rgba(0, 0, 0, 0) !important;
    -o-box-shadow: 0 0 rgba(0, 0, 0, 0) !important;
    box-shadow: 0 0 rgba(0, 0, 0, 0) !important;
}
.missionclear:after {
    content: "CLEAR";
    font-size: 1.2em;
    position: absolute;
    color: #fff;
	text-shadow: none;
    display: inline-block;
    text-align: center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    transform: rotate(-15deg);
    border: 2px solid #fff;
    padding: 3px;
    height: 1.8em;
    box-sizing: border-box;
    border-radius: 4px;
	width: 90%;
	z-index: 2;
}
.missioncard .step1column4 .missionclear:after {
	color: /*#fa4573*/#fff !important;
    border: 2px solid #fff !important;
	/*text-shadow: none;*/
}
.missionclear:before {
    content: "";
    position: absolute;
    background: rgba(0,0,0, .4) !important;
	z-index: 2;
}
.missioncard .step1column4 .missionclear:before {
    background: rgba(0,0,0, .4) !important;
}
.missioncard .area02 .headspan,
.missionboard li .area02 .headspan {
	text-align: center;
	display: block;
	margin: 0 auto;
	background: #f9959e;
	color: #fff ;
	padding: 3px;
	border-radius: 10px;
	font-size: .9em;
	line-height: 1.25em;
	text-shadow: #f66572 1px 1px 0, #f66572 -1px -1px 0, #f66572 -1px 1px 0, #f66572 1px -1px 0, #f66572 0px 1px 0, #f66572 0-1px 0, #f66572 -1px 0 0, #f66572 1px 0 0 /*1px 2px #5a73cc*/;
    border: 1px solid #faadbc;
}
.missioncard .area02 .count,
.missionboard li .area02 .count {
	text-align: center;
	margin: 5px 6px 3px 6px;
}
.missioncard .area02 .btn_long,
.missionboard li .area02 .btn_long {
	z-index: 1;
	position: relative;
}
.missioncard .area02:before {
    margin: -6.6px 0 0 -6.7px;
}
.missionboard li .area02:before {
    margin: -6.6px 0 0 -6.1px;
}
.step1column2, .step1column3, .step1column4 {
	font-size: 0;
}
.step1column2 .area02 {
	width: calc(50% - 8px);
	margin: 4px;
}
.step1column3 .area02,
.missionboard li .area02 {
	width: calc(33.33% - 8px);
	margin: 4px;
}
.step1column4 .area02 {
	width: calc(25% - 8px);
	margin: 4px;
}
.step1column4 .area02:first-of-type {
	width: calc(25% - 7px);
	margin: 4px 4px 4px 0px;
}
.step1column4 .area02:last-of-type {
	width: calc(25% - 7px);
	margin: 4px 0px 4px 4px;
}
.areacontainer {
	display: table;
	width: 100%;
}
.areacontainer .areacover,
.areacontainer .areacoverlarge {
	width: 33.33%;
    vertical-align: middle;
	display: inline-block;
}
.missioncard .areacoverlarge {
}
.missioncard .areacover .area02,
.missioncard .areacoverlarge .area02 {
	width: calc(100% - 8px);
	margin: 4px;
	display: block;	
}
.missioncard .areacoverlarge .area02 {
	height: 100%;
}
.marT8 {
	margin-top: 8px !important;
}
.marB8 {
	margin-bottom: 8px !important;
}
.heading-mission {
	font-size: 1.25em;
	font-weight: bold;
	display: inline-table;
	vertical-align: middle;
	line-height: 1.35em;
	width: 50%;
	text-align: left;
	color: #fff;
    text-shadow: #b385e8 1px 1px 0, #b385e8 -1px -1px 0, #b385e8 -1px 1px 0, #b385e8 1px -1px 0, #b385e8 0px 1px 0, #b385e8 0-1px 0, #b385e8 -1px 0 0, #b385e8 1px 0 0, 1px 2px #b385e8;
	margin: 0 4px !important;
}
.heading-mission-center {
	text-align: center;
	display: block;
	width: 100%;
}
.num ul li.middle-mission {
	vertical-align: middle !important;
}
.middle-mission img {
	width: calc(25% - 8px);
}
.middle-mission .area02 span.headspan {
	background: none;
	text-shadow: #ffffff 1px 1px 0, #ffffff -1px -1px 0, #ffffff -1px 1px 0, #ffffff 1px -1px 0, #ffffff 0px 1px 0, #ffffff 0-1px 0, #ffffff -1px 0 0, #ffffff 1px 0 0 /*1px 2px #5a73cc*/;
	border-style: none;
	color: #97863d;
}
.sub_head {
	text-align: center;
    color: #97863d;
    font-size: 1.1em;
    font-weight: bold;
    text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
.missioncard a.btn_active,
.missioncard a.btn_inactive,
.missioncard a.btn_red,
.missioncard .btn_active_input,
.missioncard .btn_inactive_input,
.missioncard .btn_red_input,
.missioncard .btn_inactive_input {
	padding: 0 6px;
}
.missioncard a.btn_active:before,
.missioncard a.btn_inactive:before,
.missioncard a.btn_red:before,
.missioncard .btn_active_input:before,
.missioncard .btn_inactive_input:before,
.missioncard .btn_red_input:before,
.missioncard p.btn_active_p:before {
	margin: -3px 0 0 -9px;
}
.missioncard .small_btn,
.missioncard .btn_active,
.missioncard .small_btn .btn_inactive,
.missioncard .small_btn .btn_red {
	height: 28px;
	line-height: 25px;
}
.headspan .dai {
	font-size: 1.5em;
	line-height: 1.5em;
	color: #fffd60; 
}
.headspan-ki {
	color: #fffd60 !important; 
}
.num ul.missionboard {
}
.tab_top_rec-mission {
	border-top: solid 2px rgba(242,239,2, 1);
	border-bottom: solid 1px rgba(242,239,2, 1);
	background: rgba(242,239,2, .1);
}
.tab_top_his-mission {
	border-top: solid 2px #7dd5fa;
	border-bottom: solid 1px #7dd5fa;
	background: rgba(125,213,250, .1);
}
#infobar ul li.infobar_btn img.ac_btn_img {
	vertical-align: middle;
	width: 15%;
	position: relative;
	z-index: 98;
}
#infobar_parameters .infobar_area span#value02 {
    position: absolute;
    top: calc( 3.25vh - 2px );
    right: 4px;
}
#infobar_parameters .infobar_area a img {
	width: 69%;
	right: 0;
	margin-bottom: 4px;
}
#infobar ul#infobar_parameters {
	padding-top: 3.25vh;
	padding-right: 2.25%;
	width: 27%;
	float: right;
	text-align: right;
	position: relative;
}
/* 20191004 報酬一覧 */
.quarter {
    left: 25% !important;	
}
.coin-link a {
	border-radius: 100px;
    background: #edf1f7;
    color: #97863d;
}
.missioncard .area02 {
	background: rgba(255, 255, 255, .68);
}
/* 20200210 報酬一覧 */
span.medium {
    font-size: 1.5em;
}
/* 20200408 コミュニティ */
span.midoku {
    top:9px;
}
span.new {
    right:100.5%;
    top:9px;
/*
    padding:0px;
    writing-mode: vertical-rl;
    text-orientation: upright;
*/
}
.balloon-container1,
.balloon-container2 {
    width: 95%;
    box-sizing: border-box;
    padding: 12px 12px 24px 12px;
}
.balloon-container1 {
    margin-left: 5%;
    text-align: right;
}
.balloon-container2 {
    margin-right: 5%;
}
.balloon_1,
.balloon_2 {
    box-sizing: border-box;
    display: inline-block;
    position: relative;
    max-width: 82.5%;
    vertical-align: middle;
    text-align: left;
    min-width: 30%;
}
.balloon_1 a.talk-name,
.balloon_2 a.talk-name {
    text-align: left;
    display: block;
    position: relative;
    color: #aaa !important;
    font-size: .8em;
}
.balloon_1 a.talk-name {
    padding-left: 16px;
}
.balloon_2 a.talk-name {
    padding-left: 32px;
}
.balloon-container2 {
    text-align: left;
    margin-right: 5%;
}
img.balloon-icon {
    /*width: 15%;
    box-sizing: border-box;
    padding: 20px 0;
    vertical-align: middle;*/
    border-radius: 3px; width: 100%;
}
.ball-icon-container {
    display: inline-block;
    width: 15%;
    box-sizing: border-box;
    padding: 2em 0 0 0;
    vertical-align: middle;
    border-radius: 3px;
    text-align: left;
}
.ball-icon-container a {
    color: #aaa !important;
    font-size: .8em;
}
.balloon1{
    box-sizing: border-box;
    position: relative;
    margin: 2px 16px 4px 0;
    padding: 14px 18px 14px 18px;
    background: #f1e8ce;
    color: #97863d;
    border-radius: 20px;
}
.balloon1::after{
    content: "";
    position: absolute;
    margin: auto 0;
    top: 0;
    bottom: 0;
    right: -12px;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-left: 20px solid #efe3bf;
    border-bottom: 10px solid transparent;
}
.balloon2{
    box-sizing: border-box;
    position: relative;
    margin: 2px 0 4px 16px;
    padding: 14px 18px 14px 18px;
    background: #eee;
    border-radius: 20px;
}
.balloon2::after{
    content: "";
    position: absolute;
    margin: auto 0;
    top: 0;
    bottom: 0;
    left: -12px;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-right: 20px solid #eee;
    border-bottom: 10px solid transparent;
}
.form-window {
    position: fixed;
    box-sizing: border-box;
    height: 29vh;
    bottom: 60px;
    width: 100%;
    padding: 12px 0 28px 0;
    background: #f6f6f6;
    box-shadow: 0 -1px rgba(0, 0, 0, 0.1);
}
.conversation {
    box-sizing: border-box;
    padding: calc(36px + 1.15em + 8px) 0 8px 0;
    height: calc(71vh - 58px);
	height: calc((var(--vh, 1vh) * 71) - 58px);
    overflow:auto;
    overflow-x:auto;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    width: 100%;
    position: relative;
    /*background: #fff;
    background-image: url(img/bg.svg);
    background-repeat: repeat;
    background-size: 100px;
    -webkit-animation: bgiLoop 30s linear infinite;
    animation: bgiLoop 30s linear infinite;*/
	will-change: transform;
	-webkit-transform: translate3d(0, 0, 0);	
}
.shadow {
    height: auto;
    overflow: hidden;
    box-shadow: 0 1px rgba(0, 0, 0, 0.1);
    z-index: 1;
    position: fixed;
    width: 100%;
    background: #fff;
    /*background-image: url(img/bg.svg);*/
    background-repeat: repeat;
    background-size: 100px;
}
.balloon1 a, .balloon2 a {
    font-weight: bold;
    margin-bottom: 3px;
    display: block;
}
.balloon1 a {
    color: #fff;
    text-shadow: #d8b53b 1px 1px 0, #d8b53b -1px -1px 0,
    #d8b53b -1px 1px 0, #d8b53b 1px -1px 0,
    #d8b53b 0px 1px 0, #d8b53b  0-1px 0,
    #d8b53b -1px 0 0, #d8b53b 1px 0 0;
}
.balloon2 a {
    color: #aa870e /*#d8b53b*/;
}
.talk-fav {
    position: absolute;
    display: inline-block;
    right: 32px;
}
.talk-fav .favoriteLink {
    font-size: 14px;
    vertical-align: middle;
    top: -5%;
}
a.favoriteLink + span {
    margin-left: 2.5em;
    color: #aaa;
    font-size: .85em;
}
span.talk-time-1 {
    color: #aaa;
    font-size: .8em;
}
span.talk-time-2 {
    color: #aaa;
    font-size: .8em;
    margin-left:5%;
}
span.report {
    color:#ccc;
    font-size: .8em;
}
/* 20200408 コミュニティ追加 */
span.new {
	padding: 0 .8em;
}
.shadow p {
	padding: 1px 0 3px 0 !important;
}
.balloon1 {
    background: #ecdedf;
    color: #a04656;
}
.balloon1::after{
    border-left: 20px solid #ecdedf;
}
.balloon2 {
	color: #444;
}
/* ボイス設定 */
.line_frame_margin {
	box-sizing: border-box;
}
.line_frame_margin p.daytime {
	font-size: 1em;
	margin: 0;
	padding: 4px 0;
	background: #ab9c5b;
	color: #fff;
	font-weight: bold;
	border-radius: 3px;
	display: block;
	box-sizing: border-box;
	border: solid 1px #acb8d9;
	text-shadow: #97863d 1px 1px 0, #97863d -1px -1px 0, #97863d -1px 1px 0, #97863d 1px -1px 0, #97863d 0px 1px 0, #97863d 0-1px 0, #97863d -1px 0 0, #97863d 1px 0 0;
}
.seventhree10 {
	display: table;
	width: 100%;
	box-sizing: border-box;
}
.seventhree7, .seventhree3 {
	box-sizing: border-box;
	display: table-cell;
	vertical-align: middle;
}
.seventhree7 {
	width: 70%;
}
.seventhree3 {
	width: 30%;
}
.seventhree3 img {
	border-radius: 3px;
}
.voice-list {
	color: #97863d;
	margin: 0 8px 0 0;
	display: block;
	background: #fff;
	font-weight: bold;
	border-radius: 3px;
	padding: 1em;
	font-weight: bold;
	border: solid 1px #d1d4e3;
}
.voice-list:before {
	content: "";
  	display: inline-block;
  	width: 1.5em;
  	height: 1.5em;
  	background-image: url("img/voice.png");
  	background-size: contain;
  	vertical-align: middle;
	margin-right: .5em;
}
.no-voice:before {
	content: "";
  	display: inline-block;
  	width: 1.5em;
  	height: 1.5em;
  	background-image: url("img/no-voice.png");
  	background-size: contain;
  	vertical-align: middle;
	margin-right: .5em;
}
.seventhree7 .voice-list:before,
.seventhree7 .no-voice:before {
    margin-bottom: .15em;
}
.mar-B10 {
	margin-bottom: -10px !important;
}
/* ボイスリスト */
div.voice_title > div {
	display: block;
	background-color: #f4ff97;
	border-bottom: solid 1px #d2de6c;
	padding: 0 16px 0 30px;
	margin-bottom: 1px;
	position: relative;
	font-size: 1.1em;
	text-align: left;
	text-decoration: none;
	clear: both;
	font-weight: bold;
	color: #fff;
	text-shadow: #b5bc42 1px 1px 0, #b5bc42 -1px -1px 0,
    #b5bc42 -1px 1px 0, #b5bc42 1px -1px 0,
    #b5bc42 0px 1px 0, #b5bc42  0-1px 0,
    #b5bc42 -1px 0 0, #b5bc42 1px 0 0;
}
div.voice_title > div > div.voice:before {
	content: "";
  	display: inline-block;
  	width: 1.35em;
  	height: 1.35em;
  	background-image: url("img/voice.png");
  	background-size: contain;
  	vertical-align: middle;
	margin-right: .8em;
	margin-bottom: .15em;
	background-repeat: no-repeat;
}
div.voice_title > div > div.no-voice:before {
	content: "";
  	display: inline-block;
  	width: 1.35em;
  	height: 1.35em;
  	background-image: url("img/no-voice.png");
  	background-size: contain;
  	vertical-align: middle;
	margin-right: .8em;
	margin-bottom: .15em;
	background-repeat: no-repeat;
}
div.voice_title div.inactive {
	background-color: #c9c9c9;
	border-bottom: solid 1px #999999;
		text-shadow: #999999 1px 1px 0, #999999 -1px -1px 0,
    #999999 -1px 1px 0, #999999 1px -1px 0,
    #999999 0px 1px 0, #999999  0-1px 0,
    #999999 -1px 0 0, #999999 1px 0 0;
}
div.voice_title div.voice {
	float: left;
	text-align: left;
	margin: .85em 0 0;
}
div.voice_title div.btn_long {
	padding: 6px 0 0;
}
/* マイページボイス吹き出し */
#infobar ul#infobar_parameters_left-bottom {
	padding-top: 20vh;
	padding-left: 12px;
	width: 27%;
	float: left;
	text-align: left;
}
#infobar_parameters_left .infobar_area a img {
	width: 69%;
	left: 0;
	margin-bottom: 4px;
}
.voice-comment {
	font-size: .9em;
	position: relative;
	margin: 0 0 12px 0;
    display: inline-block;
    width: 90%;
	margin-right: 10%;
	box-sizing: border-box;
	padding: 8px 8px 2px 8px;
	font-weight: normal;
	text-align: left;
	border: solid 2px #fff;
	background: rgba(255,255,255,0.85);	
	border-radius: 8px;
	box-shadow: 0 4px rgba(0, 0, 0, 0.25);
	color: /*#4e557c;*/ #fa7792;
	box-sizing: border-box;
	font-weight: bold;
	text-shadow: #fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
.voice-comment:before {
	content: "";
	margin: -11px 0 0 -10.5px;
	position: absolute;
	border: solid 1px #bbb;
	width: calc(100% + 3.5px);
	height: calc(100% + 3.5px);
	border-radius: 9px;
}
.voice-comment:after {
    content: "";
    position: absolute;
    top: -16px;
    right: 32px;
    height: 0;
    width: 0;
    border: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-right: 8px solid #fff;
}
.voice-comment img {
	width: 1.2em; height: 1.2em; margin:0 .25em -0.15em 0;
	display: inline-block;
}
.voice-btn {
	display: inline-block !important;
    position: absolute;
    right: 8px;
    bottom: 6px;
}
.voice-btn .btn_long {
	padding: 0 0 0 .5em;
	margin-bottom: -0.65em;
    margin-top: -0.15em;
}
.voice-btn .btn_long .btn_active {
	position: relative;
	height: 3.25em;
	width: 3.25em;
	border-radius: 100px;
}
.voice-btn .btn_long .btn_active img {
	position: absolute;
	display: block;
	left: 0;
	box-sizing: border-box;
	height: 80%;
	width: 80% !important;
	margin: 10%;
}
.voice-btn .btn_long a.btn_active:before {
	margin: -2.25px 0 0 -18px;
	width: calc(100% + 4.25px);
	height: calc(100% + 3.5px);
	border-radius: 100px;
}
#main_visual .member_comment, #main_visual .mypage_comment {
    min-height: 3.5em;
}
/* 20200413 マイページフォトガチャ */
#animation_container-cardgacha {
	width: 100%;
	position: absolute;
	margin-top: 10vh;
}
#card {
  margin: 15vh auto 0;
  width: 150px;
  height: 200px;
  position: relative;
  list-style: none;
}
#card li {
  position: absolute;
}
#card li img {
	height: 200px;
	width: auto;
	border: solid 2px #ddd;
	border-radius: 12px;
	box-sizing: border-box;
}
.tap {
	color: #aa870e;
}
img.pulse{
	animation-name: pulse;
	-webkit-animation-name: pulse;	

	animation-duration: 1.75s;	
	-webkit-animation-duration: 1.75s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@keyframes pulse {
	0% {
		transform: scale(0.97);
		opacity: 0.9;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.97);
		opacity: 0.9;	
	}			
}
@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale(0.97);
		opacity: 0.9;		
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(0.97);
		opacity: 0.9;	
	}			
}
#main_visual img.cardresult {
	width: 75%;
	margin: 2.5vh 12.5%;
	box-sizing: border-box;
	box-shadow: 0 4px 0 0 rgba(0,0,0,.1);
	border-radius: 24px;
}
img.cardresult + .member_comment {
	bottom: -7vh !important;
	/*padding: 8px 4.25em 8px 14px;*/
	padding: 8px 14px !important;
}
.fade-in {
	animation: fadeIn .5s ease 0s 1 normal;
    -webkit-animation: fadeIn .5s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
.star {
	position: absolute;
	background: url("../img/mypagephotogachas/sparkle.png") no-repeat;
	background-size: contain;
	overflow: hidden;
}
.star-1 {
	width: 50px;
	height: 34px;
	top: 5vh;
	left: 14%;	
}
.star-2 {
	width: 83px;
	height: 77px;
	top: 5vh;
	left: 70%;
}
.star-3 {
	width: 74px;
	height: 70px;
	top: 20vh;
	left: 50%;
}
.star-4 {
	width: 68px;
	height: 70px;
	top: 38vh;
	left: 27%;
}
.star-5 {
	width: 50px;
	height: 34px;
	top: 45vh;
	left: 65%;
}
.mar0 { margin: 0 !important; }
.area06 .text+.count {
	margin: 6px 5px 2px 0 !important;
}
.column_2 .area02 + .list_d {
	width: 68%;
}
.num ul li.btn-friend-list {
    width: 30%;
    display: inline-block;
}
.aisatsu-bonus {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.6em;
	line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: -12px;
    display: inline-block;
	box-sizing: border-box;
	border: solid 1px #ff7e9f;
    margin-left: calc(-2.1em - 8px);
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
	-webkit-animation: 0.7s jump infinite alternate linear;
	animation: 0.7s jump infinite alternate linear;
}
@-webkit-keyframes jump {
  to { transform: transtateY(0); }
  from { transform: translateY(3px); }
}
@keyframes jump {
  to { transform: transtateY(0); }
  from { transform: translateY(3px); }
}
span.aisatsu-bonus:after {
    content: "";
    position: absolute;
    top: -10px;
    left: calc(50% - 6px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-bottom: 6px solid #ff7e9f;
}
.point-up {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.6em;
	line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: -12px;
    display: inline-block;
	box-sizing: border-box;
	border: solid 1px #ff7e9f;
    margin-left: calc(5.6em - 8px);
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
	-webkit-animation: 0.7s jump infinite alternate linear;
	animation: 0.7s jump infinite alternate linear;
}
span.point-up:after {
    content: "";
    position: absolute;
    top: -10px;
    left: calc(50% - 6px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-bottom: 6px solid #ff7e9f;
}
span.payment_point_add {
    font-size:.8em;
}
div.payment_coin {
    width:94%;
    margin:2% 3%;
}
h1.ichioshi_sale {
    color:#ab9c5b;
    font-size:1.1em !important;
    text-shadow:#fff 1px 1px 0, #fff -1px -1px 0, #fff -1px 1px 0, #fff 1px -1px 0, #fff 0px 1px 0, #fff 0-1px 0, #fff -1px 0 0, #fff 1px 0 0;
}
h1.ichioshi_sale a {
    text-decoration: none;
}
.sale {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: -24px;
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px #ff7e9f;
    margin-left: 64%;
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
    -webkit-animation: 0.7s jump infinite alternate linear;
    animation: 0.7s jump infinite alternate linear;
    z-index:11;
}
span.sale:after {
    content: "";
    position: absolute;
    top: 19px;
    left: calc(50% - 3px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-top: 6px solid #ff7e9f;
}
.sale-event {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: -24px;
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px #ff7e9f;
    margin-left: 69%;
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
    -webkit-animation: 0.7s jump infinite alternate linear;
    animation: 0.7s jump infinite alternate linear;
    z-index:11;
}
span.sale-event:after {
    content: "";
    position: absolute;
    top: 19px;
    left: calc(50% - 3px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-top: 6px solid #ff7e9f;
}
.num ul li a.btn_inactive {
	font-size: .9em;
}
.num ul li.btn-friend-list {
	width: 30%;
    display: inline-block;
}
.setting-card {
	position: relative;
	background: -webkit-repeating-linear-gradient(-45deg,#323436 0,#323436 3px,#36373a 3px,#36373a 6px);
    background: -o-repeating-linear-gradient(-45deg,#323436 0,#323436 3px,#36373a 3px,#36373a 6px);
    background: repeating-linear-gradient(-45deg,#323436 0,#323436 3px,#36373a 3px,#36373a 6px);
	padding: 0 0 8px 0;
	border-radius: 3px;
	width: calc(100% - 20px);
	border: solid 1px #97863d;
	box-sizing: border-box;
	margin-right: 10px;
	margin-left: 10px;
}
ul.deck-line {
	padding: 10px 10px 2px 2px;
}
ul.deck {
	padding: 8px 10px 0 2px;
}
ul.deck-line, ul.deck {
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
}
.setting-card ul.deck-line, .setting-card ul.deck {
	justify-content: center;
}
ul.deck-line li {
	width: calc(20% - 8px);
	box-sizing: border-box;
	margin: 0 0 0 8px;
}
ul.deck-line li, ul.deck li {
	position: relative;
	display: inline-block;
	/*border: solid 2px #eee;*/
	/*border-radius: 2px; */
	vertical-align: middle;
	font-size: 0;
	line-height: normal;
}
.setting-card ul.deck-line li img,
.setting-card ul.deck-line li.deck-emp,
.setting-card ul.deck li img,
.setting-card ul.deck li a.deck-emp {
	border: solid 1px #222;
	border-radius: 2px;
}
ul.deck-line li img,
ul.deck li img {
	width: 100%;
	box-sizing: border-box;
}
ul.deck li {
	width: calc(33.33% - 8px);
	box-sizing: border-box;
	margin: 2px 0 0 8px;
}
/*
.area08 { 
	position: relative;
	background: rgba(231, 233, 239, .9)
}
.area08:before {
	content: "";
	position: absolute;
	border: solid 1px #bbb;
	border-radius: 19px;
	margin: -7.75px 0 0 -7.5px;
	width: calc(100% + 5.8px);
	height: calc(100% + 5.75px);
	box-sizing: border-box;
}
*/
ul.deck li a.deck-emp,
ul.deck-line li.deck-emp {
	box-sizing: border-box;
	/*background: -webkit-repeating-linear-gradient(-45deg,#f9eaef 0,#f9ebef 10px,#fff 10px,#fff 20px);
    background: -o-repeating-linear-gradient(-45deg,#f9eaef 0,#f9ebef 10px,#fff 10px,#fff 20px);
    background: repeating-linear-gradient(-45deg,#f9eaef 0,#f9ebef 10px,#fff 10px,#fff 20px);*/
	background: #48494d;
	display: flex;
	align-items: center;
	position: relative;
}
ul.deck li.deck-emp {
	padding-top: calc(44.44% - 13px);
}
ul.deck-line li.deck-emp {
	padding-top: calc(26.67% - 13px);	
}
.deck-emp span {
	display: block;
	padding: 0 !important;
	margin: 0 auto !important;
	width: 100%;
	box-sizing: border-box;
	border-radius: 2px;
}
li a.deck-emp {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
}
ul.deck li a.deck-emp {
	height: calc(100% - 2px);
	padding-top: calc(133.33% - 13px);
}
li.deck-emp span,
ul.deck li a.deck-emp span {
    font-size: 13px;
	font-weight: bold;
	color: #f9ff61;/*
	text-shadow: #ee96b2 1px 1px 0, #ee96b2 -1px -1px 0, #ee96b2 -1px 1px 0, #ee96b2 1px -1px 0, #ee96b2 0px 1px 0, #ee96b2 0-1px 0, #ee96b2 -1px 0 0, #ee96b2 1px 0 0;*/
	text-shadow: #222 1px 1px 0, #222 -1px -1px 0, #222 -1px 1px 0, #222 1px -1px 0, #222 0px 1px 0, #222 0-1px 0, #222 -1px 0 0, #222 1px 0 0;
	position: absolute;
	top: calc(50% - 10px);
}
ul.deck li a.deck-emp span {
	top: calc(50% - 10px);
}
.area09, .container-power .area02 {
	background: rgba(231, 233, 239, .95);
}
.container-power .area02 {
	width: calc(50% - 16px);
}
ul li .card-status {
	border: none !important;
}
ul li p.card-status {
	font-size: 11px;
	line-height: 1.2;
	border-radius: 3px;
	padding: 3px 0;
	margin: 4px 0 2px 0;
	background: #f6f6f6;
	color: #444;
	font-weight: bold;
}
.setting-card ul li p.card-status {
	color: #fff;
	background: #27282a;
}
ul li p.invisible {
	visibility: hidden;
}
.refine {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	margin-right: 10px; margin-left: 10px;
	border-radius: 3px;
	background: #f6f6f6;
	padding: 2px 0 6px;
	border: solid 1px #eee;
	box-sizing: border-box;
}
.refine span {
	display: inline-block;
	margin: 4px 8px;
}
.refine span p {
	padding: 2px 4px 0 4px !important;
	box-sizing: border-box;
	margin: 0;
	color: #999;
	font-weight: bold;
}
ul.cardselectmodal {
	padding-top: 8px ;
	text-align: center;
}
.cardselectmodal img {
	display: block;
	width: 67%;
	margin: 8px auto;
	border: solid 2px #eee;
	border-radius: 3px;
	box-sizing: border-box;
}
.power {
	background: #ee96b2;
	padding: 1px 4px;
	border-radius: 100px;
	color: #fff;
	border: 1px solid #fdb0c8;
	font-size: 9px;
	margin-top: 2px;
}
.status {
	padding: 2px 8px 0 5px;
}
.power, .status {
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
}
a.favoriteLinkCard img {
	width: 1.5em !important;
    height: auto !important;
}
.favoriteLinkCard {
position: absolute;
    top: 30%;
    font-size: 20px;
    text-decoration: none;
}
.fav_position_card {
	position: relative;
    right: -1.5em;
}
ul.image_list_3 li a img{
	border: solid 2px #eee;
}
.fuchi { text-shadow: #56525a 1px 1px 0, #56525a -1px -1px 0, #56525a -1px 1px 0, #56525a 1px -1px 0, #56525a 0px 1px 0, #56525a 0-1px 0, #56525a -1px 0 0, #56525a 1px 0 0; }
.tab .tab_li_mypage {
	width: 47%;
}
/* 20200929追加 */
.setting-card ul.deck-line li.special-power img,
.setting-card ul.deck li.special-power img,
ul.deck-line li.special-power img,
ul.deck li.special-power img {
	border: solid 2px #be717f ;
	border-radius: 2px;
}
ul.deck-line li.special-power a,
ul.deck li.special-power a {
	position: relative;
}
.bonus-container {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 85px;
	height: 85px;
	overflow: hidden;
	z-index: 1;
  }
.bonus {
	font-weight: bold;
	display: inline-block;
    position: absolute;
    padding: 4px 0;
    left: -62px;
    top: 58px;
    width: 160px;
    text-align: center;
    font-size: 10px;
    line-height: 10px;
    background: #ff3d44;
    color: #fff;
    letter-spacing: 0.05em;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    box-shadow: -2px 2px rgba(0, 0, 0, 0.35);
}
/* 動画リスト */
div.video_title > div {
    display: block;
/**
    background-color: #f4ff97;
    border-bottom: solid 1px #d2de6c;
**/
    padding: 0 16px 0 30px;
    margin-bottom: 1px;
    position: relative;
    font-size: 1.1em;
    text-align: left;
    text-decoration: none;
    clear: both;
    font-weight: bold;
/**
    color: #fff;
    text-shadow: #b5bc42 1px 1px 0, #b5bc42 -1px -1px 0,
    #b5bc42 -1px 1px 0, #b5bc42 1px -1px 0,
    #b5bc42 0px 1px 0, #b5bc42  0-1px 0,
    #b5bc42 -1px 0 0, #b5bc42 1px 0 0;
**/
}
div.video_title > div > div.video:before,
div.video_title > div > a > div.video:before {
    content: "";
    display: inline-block;
    width: 1.35em;
    height: 1.35em;
    background-image: url("img/video.png");
    background-size: contain;
    vertical-align: middle;
    margin-right: .8em;
    margin-bottom: .15em;
    background-repeat: no-repeat;
}
div.video_title div.inactive {
    background-color: #c9c9c9;
    border-bottom: solid 1px #999999;
    text-shadow: #999999 1px 1px 0, #999999 -1px -1px 0,
    #999999 -1px 1px 0, #999999 1px -1px 0,
    #999999 0px 1px 0, #999999  0-1px 0,
    #999999 -1px 0 0, #999999 1px 0 0;
}
div.video_title div.video {
    float: left;
    text-align: left;
    margin: .85em 0 0;
}
div.video_title div.btn_long {
    padding: 6px 0 0;
}
.embed-container {
  height: 0;
  overflow: hidden;
  max-width: 100%;
  padding-bottom: 90%;
  position: relative;
}
.embed-container iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
a.underline {
  text-decoration: underline;
}
.modal-close-medal {
    right: 10px;
    top: 10px;
    background-color:#c0c0c0;
    border-radius:20px;
}
.modal-close-medal:before, .modal-close-medal:after {
    border-top:2px solid #000;
}
.mission-challenge {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.6em;
    line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: 78px;
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px #ff7e9f;
    margin-left: calc(22.3em - 8px);
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
    -webkit-animation: 0.7s jump infinite alternate linear;
    animation: 0.7s jump infinite alternate linear;
}
span.mission-challenge:after {
    content: "";
    position: absolute;
    top: -10px;
    left: calc(50% - 6px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-bottom: 6px solid #ff7e9f;
}

/* 20210608 */
.my-info {
	text-align: center;
	text-decoration: none;
    font-size: .9em;
    padding: 0.25em 0;
    border: 1px solid #e6e6e6;
    color: #97863d;
    font-weight: normal;
    border-radius: 100px;
    background: #f8f8f8;
    box-sizing: border-box;
}
.num ul li a.btn_inactive {
	font-size: .9em;
}
.num ul li.btn-friend-list {
	width: 30%;
    display: inline-block;
}

.circles li{
    position: absolute;
    display: block;
    list-style: none;
    width: 40px;
    height: 40px;
    background: /*rgba(255, 255, 255, 0.2)*/url(img/heart03.svg);
	background-size: contain;
    animation: animate 25s linear infinite;
    bottom: -150px;   
}
.circles li:nth-child(1){
    left: 25%;
    width: /*80px*/ 60px ;
    height: /*80px*/ 60px;
    animation-delay: 0s;
}
.circles li:nth-child(2){
    left: 7%;
    width: 20px;
    height: 20px;
    animation-delay: -3s;
    animation-duration: 12s;
}
.circles li:nth-child(3){
	background: url(img/heart02.svg);
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: -1s;
}
.circles li:nth-child(4){
	background: url(img/heart02.svg);
    left: 40%;
    width: /*60px*/ 40px;
    height: /*60px*/ 40px;
    animation-delay: -5s;
    animation-duration: 18s;
}
.circles li:nth-child(5){
	background: url(img/heart01.svg);
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 5s;
}
.circles li:nth-child(6){
    left: 75%;
    width: /*110px*/ 70px;
    height: /*110px*/ 70px;
    animation-delay: -2s;
    animation-duration: 20s;
}
.circles li:nth-child(7){
    left: 20%;
    width: /*150px*/ 80px;
    height: /*150px*/ 80px;
    animation-delay: 10s;
}
.circles li:nth-child(8){
    left: 50%;
    width: /*25px*/ 40px;
    height: /*25px*/ 40px;
    animation-delay: 7s;
    animation-duration: 45s;
}
.circles li:nth-child(9){
	background: url(img/heart02.svg);
    left: 20%;
    width: /*15px*/ 30px;
    height: /*15px*/ 30px;
    animation-delay: -3s;
    animation-duration: 35s;
}
.circles li:nth-child(10){
	background: url(img/heart01.svg);
    left: 85%;
    width: /*80px*/ 60px ;
    height: /*80px*/ 60px;
    animation-delay: -5s;
    animation-duration: 11s;
}
.circles li:nth-child(11){
	background: url(img/heart01.svg);
    left: 16%;
    width: 40px;
    height: 40px;
    animation-delay: -14s;
    animation-duration: 16s;
}
.circles li:nth-child(12){
    left: 18%;
    width: 60px ;
    height: 60px;
    animation-delay: -9s;
}
.circles li:nth-child(13){
	background: url(img/heart01.svg);
    left: 2%;
    width: 40px;
    height: 40px;
    animation-delay: 6s;
}
.circles li:nth-child(14){
    left: 33%;
    width: 60px ;
    height: 60px;
    animation-delay: -19s;
}
.circles li:nth-child(15){
    left: 66%;
    width: 60px ;
    height: 60px;
    animation-delay: -23s;
}
.circles li:nth-child(16){
    left: 78%;
    width: 40px;
    height: 40px;
    animation-delay: -8s;
    animation-duration: 15s;
}
.circles li:nth-child(17){
	background: url(img/heart01.svg);
    left: 8%;
    width: 30px;
    height: 30px;
    animation-delay: -15s;
    animation-duration: 26s;
}
.circles li:nth-child(18){
	background: url(img/heart01.svg);
    left: 80%;
    width: 40px;
    height: 40px;
    animation-delay: -18s;
}
.circles li:nth-child(19){
    left: 95%;
    width: 40px;
    height: 40px;
    animation-delay: -20s;
    animation-duration: 23s;
}
.circles li:nth-child(20){
	background: url(img/heart02.svg);
    left: 12%;
    width: 20px;
    height: 20px;
    animation-delay: -16s;
    animation-duration: 30s;
}
.circles li:nth-child(21){
	background: url(img/heart01.svg);
    left: 65%;
    width: 70px;
    height: 70px;
    animation-delay: -15s;
    animation-duration: 28s;
}
.circles li:nth-child(22){
    left: 80%;
    width: 60px ;
    height: 60px;
    animation-delay: -12s;
}
@keyframes animate {
    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }
    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
    }
}
.bg-random {
	overflow: hidden;
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}
.raid-event {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: -24px;
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px #ff7e9f;
    margin-left: 18%;
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
    -webkit-animation: 0.7s jump infinite alternate linear;
    animation: 0.7s jump infinite alternate linear;
    z-index:11;
}
span.raid-event:after {
    content: "";
    position: absolute;
    top: 19px;
    left: calc(50% - 3px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-top: 6px solid #ff7e9f;
}
h1.ichioshi_raid {
    border: solid;
    border-color:#ab9c5b;
    color:#ab9c5b;
}
a.ichioshi_raid {
    text-decoration: none;
}
/* 20210720 フォトガチャ追加 */
#card li a {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 100vh;
    transform: translateX(-50%) translateY(-50%);
}
.rainbow {
    color:#f6bfbc !important;
}
ul.box_scratch {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
ul.box_scratch li {
     -webkit-flex-grow: 1;
    flex-grow: 1;
    width: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.box_scratch h1 {
  margin: 18px 1em 6px 1em;
}
.box_scratch img {
  width: 80%;
}
.get_all {
  background-color: #D0D2D3;
}
ul.nav_box_voice li {
    width: 96%;
    float: center;
    margin: 0 2% 12px 2%;
    list-style: none;
}
ul.nav_box_voice li a {
    display: block;
}
ul.nav_box_voice a.btn_active{
    font-size: 1em;
    padding: 0 4px;
}
ul.nav_box_voice a.btn_active:before{
    left: 12px;
    display: -webkit-box;
    display: -moz-box;
}
/* 20210817 いいね */
#main_visual .split .half_frame .member_comment {
    position: relative;
	display: flex;
    width: 95%;
	margin: auto 2.5%;
    bottom: 0;
    left: auto;
    transform: none;
    padding: 0 24px;
	font-size: .9em;
}
#main_visual .split .half_frame .member_comment img {
	width: 17.5%;
	display: inline-block;
	margin: 0 auto;
	flex: 1;
}
#main_visual .split .half_frame .member_comment span {
	font-size: 1.5em;
	flex: 3;
}
#main_visual .split .half_frame .member_comment img,
#main_visual .split .half_frame .member_comment span {
	display: -webkit-box;
	display: -ms-flexbox;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.iine-btn a.btn_active,
.iine-btn a.btn_inactive {
	display: flex;
}
.iine-btn a.btn_active:before,
.iine-btn a.btn_inactive:before {
	margin: -3px 0 0 -14.6px;
	width: calc(100% + 3.5px);
	height: calc(100% + 4.2px);
}
.iine-btn svg/*img*/ {
	width: 7.5vw;
	height: 7.5vw;
	margin: 4px 0;
	overflow: visible;
}
.iine-btn a#goodYesLink svg path {
	paint-order: stroke;
	stroke: rgba(255,255,255,.55);
    stroke-width: 6px;
	stroke-linecap: round;
	stroke-linejoin: round;
}
#goodYesLink .st0 {
    fill:#EE4762 !important;
}
#goodNoLink .st1 {
    display: block !important;
}
h1.event_user {
    margin:0;
}
div.margintop10 {
    margin-top:10px;
}
div.margintop20 {
    margin-top:20px;
}
div.inlineblock {
    position: relative;
    display:inline-block;
    text-align: center;
}
/* メニュー変更(陣内) */
.game-btn-img.menu-custom a {
	border-radius: 4px;
}
.game-btn-img.menu-custom a.btn_active:before,
.game-btn-img.menu-custom a.btn_inactive:before {
	border: solid 1px #7b2c35;
	margin: -3.5px 0 0 -34px;
	width: calc(100% + 5.5px);
	height: calc(100% + 5px);
	border-radius: 10px;
}
.game-btn-img.menu-custom a svg path,
.game-btn-img.menu-custom a:hover svg path,
.game-btn-img.menu-custom a:focus svg path,
.game-btn-img.menu-custom a:active svg path,
.game-btn-img.menu-custom a:visited svg path {
	stroke: #a94557 !important;
	fill: #fff !important;
}
.game-btn-img.menu-custom a { 
	text-shadow: #7b2c35 1px 1px 0, #7b2c35 -1px -1px 0, #7b2c35 -1px 1px 0, #7b2c35 1px -1px 0, #7b2c35 0px 1px 0, #7b2c35 0-1px 0, #7b2c35 -1px 0 0, #7b2c35 1px 0 0 !important;
	color: #fff;
}
.menu-custom a.btn_inactive {
	background: linear-gradient(180deg, #be717f 0%, #be717f 50%, #a94557 50%, #a94557 100%);
	border: solid 3px #d5a0a1;
}
.scroll_parent{
	border-top: solid 3px rgba(197,176,87,.75);
}
/* 20211004 ブラックジャック追加 */
#main_visual_black_jack img {
    width: 20%;
}
#main_visual_black_jack {
    position: relative;
}
/* ブラックジャック追加分 */
#main_visual_black_jack img {
    width: 35%;
}
#main_visual_black_jack {
    position: relative;
}
.casino-bg:before {
	content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    background: url(../img/bj/card-left.png), url(../img/bj/card-right.png), url(../img/bj/coin-left.png), url(../img/bj/coin-right.png);
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    background-position: left 7% top 15%, right 7% top 15%, left 10% bottom 5%, right 10% bottom 5%;
    background-size: 30% auto, 30% auto, 20% auto, 20% auto;
}
.mar-T13 { margin-top: -13% !important; }
.mar-T15 { margin-top: -15% !important; }
.img_layer-01, .img_layer0, .img_layer_p01, .img_layer_p02 { position: relative; }
.img_layer-01 { z-index: -1 !important; }
.img_layer0 { z-index: 0 !important; }
.img_layer_p01 { z-index: 1 !important; }
.img_layer_p02 { z-index: 2 !important; }
.incen_images10 { width: 10%; }
.incen_images20 { width: 20%; }
.image-height-vs { height: 4em; width: auto; }
.marX15per { margin-right: 15%; margin-left: 15%; }
.line_frame_blue .num_avatar, .line_frame_blue .num { padding-top: 0; }
.line_frame_blue .num_avatar .area04 {
	width: calc(47.5% - 8px);
	box-sizing: border-box;
}
.line_frame_blue .num_avatar .area04,
.line_frame_blue .num_avatar .area04_right {
	margin-bottom: 2px;
}
.h-font-normal { font-weight: normal; }
.h-font-normal span {
	font-weight: bold;
	font-size: 1.1em;
	margin: 0 .25em;
}
.work-bonus {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.6em;
    line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: -15px;
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px #ff7e9f;
    margin-left: calc(3.5em - 8px);
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
    -webkit-animation: 0.7s jump infinite alternate linear;
    animation: 0.7s jump infinite alternate linear;
}
span.work-bonus:after {
    content: "";
    position: absolute;
    top: 13px;
    left: calc(50% - 6px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-top: 6px solid #ff7e9f;
}
.loupe {
    position: relative !important;
}
.loupe.collection-tmb-img a:before{
	content: "";
	display: block;
	position: absolute;
	bottom: .5em; left: calc(100% - 2.5em); width: 2em; height: 2em;
	background: url("./../img/common/loupe.png");
	background-size: contain;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
.loupe.float_img a img{ vertical-align: bottom; }
.loupe.float_img a:before{
	content: "";
	display: block;
	position: absolute;
	bottom: .25em; left: calc(100% - 2.5em); width: 2.25em; height: 2.25em;
	background: url("./../img/common/loupe.png");
	background-size: contain;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
.fav_position_greeting {
    position: relative;
    right: 3em;
    top: .75em;
}
.free-minigame {
    background: #fe5983;
    padding: 0 3px 1px 3px;
    position: absolute;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 1.5em;
    color: #fff;
    border-radius: 100px;
    margin-top: 5px;
    display: inline-block;
    box-sizing: border-box;
    border: solid 1px #ff7e9f;
    box-shadow: 0 3px rgba(0, 0, 0, 0.35);
    z-index:1;
}
span.free-minigame:after {
    content: "";
    position: absolute;
    top: 6px;
    left: calc(-10% - 5px);
    height: 0;
    width: 0;
    border: 4px solid transparent;
    border-right: 6px solid #ff7e9f;
}
.game-btn-img a.btn_active {
	border-width: 3px;
	box-shadow: 0 4px 0 0 rgb(0 0 0 / 25%) 
}
.missioncard .area02 .count,
.missionboard li .area02 .count {
	text-align: center;
	margin: 5px 6px 3px 6px;
	overflow-wrap: break-word;
}
.float_70 {
    width: 70%;
    padding: 0 1% 0 2%;
}
.video_img {
    display:block;
    margin:0 auto;
    max-height:20em;
    width:auto;
    max-width:100%;
}
.chat_img {
    display:block;
    margin: .25em auto;
    max-height:20em;
    width:auto;
    max-width:100%;
    border-radius: 6px;
}
.form-window-idol {
    height: 37vh !important;
}
label > input[type="file"] {
    display:none !important; /* アップロードボタンのスタイルを無効にする */
}
.frame ul li a {
    position:relative;
}
#infobar ul#infobar_parameters {
    display: block;
}
span#value09 {
    height: 20px;
    width: 20px;
}
#infobar_parameters .infobar_area.btn-step01,
#infobar_parameters .infobar_area.btn-step02,
#infobar_parameters .infobar_area.btn-step01 a,
#infobar_parameters .infobar_area.btn-step02 a {
    position: relative;
    display: block;
}
#infobar #infobar_parameters .infobar_area.btn-step01 a span,
#infobar #infobar_parameters .infobar_area.btn-step02 a span,
#infobar #infobar_parameters .infobar_area.btn-step02 a span#value02 {
    position: absolute;
    left: auto;
    top: -.5em;
    right: -.5em;
}
.marT20 { margin-top: 20px !important; }
.mission-challenge {
    right: 2.25%;
    margin-top: 80px;
}
.tab_top_small {
    border-top: solid 2px #b9a2e2;
}
.tab .textcolor_small.textcolor_sdroom {
	color: #e5a629;
}
.tab .select_small.select_sdroom {
    color: #fff;
    background: -webkit-linear-gradient(top, #f7be43 12%, #f7a45b 13%);
    background: -moz-linear-gradient(top, #f7be43 12%, #f7a45b 13%);
    background: -ms-linear-gradient(top, #f7be43 12%, #f7a45b 13%);
    background: -o-linear-gradient(top, #f7be43 12%, #f7a45b 13%);
    background: linear-gradient(to bottom, #f7be43 12%, #f7a45b 13%);
    text-shadow: none;
}
.tab_top_small.tab_top_sdroom, .tab_top_sdroom, .tab_top.tab_top_sdroom {
	border-top: solid 2px #f7a45b;
}
#smallroom_show {
    font-size:.8em;
    line-height:3.25em;
}
.div-inline-block p.inline-block,span.inline-block,a.inline-block {
    display: inline-block;
}
p#goods_request_explan {
    width:85%;
}
a#js_goods_request_help {
    background:#000;
    border: 1px solid #000;
    border-radius:10px;
    color:#fff;
    padding:0 2px 0 2px;
}
p#modal_wording {
    background-color:#fff;
    font-weight:bold;
}
/* sub btn */
#btn_sub .game-btn-img,
.under_btn .game-btn-img {
	width: calc(33.33% - 8px) !important;
    box-sizing: border-box;
	padding: 0;
}
#btn_sub .game-btn-img a:before, .under_btn .game-btn-img a:before {
	border-radius: 24px;
}
#btn_sub .game-btn-img a.btn_active {
	background: linear-gradient(
180deg, #ff9ccc 0%, #ff9ccc 50%, #ff5da8 50%, #ff5da8 100%);
	border: solid 3px #fec7e1 !important;
	box-shadow: 0 4px 0 1px #111;
	text-shadow: #ff0066 1px 1px 0, #ff0066 -1px -1px 0, #ff0066 -1px 1px 0, #ff0066 1px -1px 0, #ff0066 0px 1px 0, #ff0066 0-1px 0, #ff0066 -1px 0 0, #ff0066 1px 0 0 !important;
}
#btn_sub .game-btn-img a.btn_active:before,
.under_btn .game-btn-img a.btn_active:before {
	margin: -3.5px 0 0 -8px;
}
.game-btn-img a img,
.under_btn .game-btn-img a img { 
	width: 80%; 
	margin: 0 10%; box-sizing: border-box;
}
#btn_sub .game-btn-img a.btn_active:before,
.under_btn .game-btn-img a.btn_active:before {
    width: calc(100% + 5.5px);
    height: calc(100% + 5.5px);
}
#btn_sub .game-btn-img:first-child,
.under_btn .game-btn-img:first-child { margin: 0 8px 0 0; }
#btn_sub .game-btn-img:nth-child(2),
.under_btn .game-btn-img:nth-child(2) { margin: 0 4px; }
#btn_sub .game-btn-img:nth-child(3),
.under_btn .game-btn-img:nth-child(3),
.under_btn .game-btn-img:last-child { margin: 0 0 0 8px; }
#btn_sub .game-btn-img a,
.under_btn .game-btn-img a {
	width: 100% !important;
	line-height: 1.05em;
	padding-bottom: .25em;
	border-radius: 24px;
	font-size: 1em;
	box-sizing: border-box;
}
.setting p.center_bold {
    color:#000;
    font-weight: bold;
    text-align: center;
}
.half_third_frame {
    width: 30.1% !important;
}
.talk-fav { right: 20px; display: block;}
img.greeting_friend {
    vertical-align:middle;
    width:10%;
}
.sd-completion-image {
    color: #fff;
    border-radius: 4px;
    background: #999;
    font-size: .8rem;
    width: fit-content;
    position: absolute;
    left: .5rem;
    top: 9.5rem;
    padding: 0.5rem 1rem;
    text-align: center;
    font-weight: 700;
    z-index: 2;
}
area-center {
    text-align:center !important;
}