/*********************************
		    Analytics
*********************************/
@media screen and (min-width: 768px) and (max-width: 1199px){
	#stories_analytics .graph_wrap .stories_list{
		justify-content: space-between;
	}
}
@media screen and (max-width: 991px){
	.logo_main{
	    margin-left: 0;
	}
	#biz_account.wrapper{
		padding: 50px 15px;
	}
	#payment_history .content button.receipt{
		width: 100px;
	}
}
@media screen and (min-width: 992px){
	.sp_nav_btm,
	.sp_report_ftr{
		display: none !important;
	}
}
@media screen and (min-width: 768px){
	h1{
		font-size: 2rem;
	}
}
@media screen and (max-width: 768px){
	.analytics h1{
		font-size: 1.5em !important;
	}
	.footer_analytics{
		/* display: none !important; */
	}
	.summary{
		display: flex;
	}
	#audience_analytics .sumbox {
		width: 48%;
	}
	#stories_analytics .sumbox {
		width: 32%!important;
	}
	.summary .sumbox {
		/* width: 32% !important; */
	}
	.summary .sumbox .title{
		font-size: 10px !important;
		line-height: 15px !important;
	}
	.graph_wrap .graph_header button,
	.graph_wrap .graph_header h3{
		font-size: 14px !important;
	}
	#account_analytics .help{
		margin-right: -20px;
	}
	#stories_analytics .sumbox .btn_wrap{
		position: relative;
		margin-top: 20px;
		text-align: center;
		left: 0;
		right: 0;
	}
	#stories_analytics .sumbox .btn_wrap button{
		width: 60%;
	}
	#stories_analytics .sumbox .btn_wrap button a{
		font-size: 10px !important;
	}
	
	#biz_account .inner .desc_wrap{
		display: block;
	}
	#biz_account .inner .desc_wrap .img_wrap{
		width: 100%;
		margin: 0 0 50px !important;
	}
	#biz_account .inner .desc_wrap .desc{
		width: 100%;
	}
	#payment_history.change .inner h3{
		margin-left: 10px;
	}
	#payment_history.change .inner{
		width: 95%;
	}
	#payment_history.change .credit_wrap .form_wrap form .form-row{
		margin: 0 auto;
		width: 95%;
	}
}
@media screen and (min-width: 992px){
	.wrapper.analytics{
		display: flex;
		/*grid-template-columns: 300px 1fr;
		grid-template-rows: 1fr;*/
		/*height: 100%;*/
		min-height: 100%;
	}
	.wrapper.analytics .main_wrapper{
		width: calc(100% - 250px);
		height: 100%;
	}
	#overlay{
		width: calc(100% - 250px);
	}
	
	/*#forget,
	#reset,
	#reset_complete,
	#thanks,
	#top_payment_info,
	#auth,
	#fb_list{
		height: 100vh;
	}
	#payment_history .inner_wrap{
		height: 100vh;
	}*/
	.terms .inner{
		padding: 100px 0;
	}
}
@media screen and (min-width: 1200px){
	/*#signin,
	#signup,
	#top_payment_info,
	#plan{
		height: 100vh;
		min-height: 100%;
	}*/
	#stories_analytics .graph_wrap .stories_list .card{
		margin-right: 15px;
	}
	#stories_analytics .graph_wrap .stories_list .card:nth-of-type(3n){
		margin-right: 0;
	}
}
/*@media screen and (min-width: 1200px){
	.wrapper.analytics{
		display: flex;
		grid-template-columns: 300px 1fr;
		grid-template-rows: 1fr;
		height: 100%;
	}
	.wrapper.analytics .main_wrapper{
		width: calc(100% - 250px);
	}
}*/
@media screen and (max-width: 700px){
	.narrow .upper .narrow_btn,
	.narrow .upper .narrow_btn.selected{
		width: 100% !important;
		margin-bottom: 15px;
	}
}
@media screen and (max-width: 1199px) and (min-width: 992px){
	.wrapper.analytics .main_wrapper .inner{
		max-width: 700px;
	}
	#stories_analytics .graph_wrap .stories_list .card{
		margin-right: 70px;
	}
	#stories_analytics .graph_wrap .stories_list .card:nth-of-type(2n){
		margin-right: 0;
	}
	/*#signin{
		height: 100vh;
	}*/
	#stories_analytics .sumbox,
	#post_analytics .sumbox,
	#account_analytics .sumbox {
		background: #fff;
		padding: 10px 15px;
		position: relative;
		width: 31%;
		margin-bottom: 20px;
	}
	#audience_analytics .sumbox {
		width: 49%;
	}
	.stories_list .card{
		width: 300px !important;
	}
	#post_analytics .stories_list .card .card_header{
		width: 300px !important;
		height: 300px !important;
	}
	#account_info form .label_wrap{
		width: 100%;
	}
	#faq .content{
		width: 100%;
		padding: 30px;
	}
	#audience_analytics .inner_grid .graph_wrap{
		max-width: 335px;
		width: 100%;
	}
	.terms_mv h1{
		color: #fff;
		max-width: 700px;
		width: 100%;
		margin: 0 auto;
	}
	.terms .inner{
		max-width: 700px;
		width: 100%;
		margin: 0 auto;
		padding: 50px 0;
	}
}

/*********************************
		  SP02:General
*********************************/
@media screen and (max-width: 991px){
	.logo_main, .logo_white{
		width: 120px;
	}
	#overlay{
	    /*オーバーレイのCSS*/  
	    z-index: 100;
	    width: 100% !important;
	}
	.wrapper.analytics header{
		position: relative;
		z-index: 9999;
	}
	.agents_header{
		position: fixed;
		width: 100%;
		background: #fff;
		z-index: 9999999;
	}
	.sp_nav .nav_wrap{
		height: 60px;
	}
	.sp_header{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.sp_header .header_content{
		margin-bottom: 0;
		border-left: 1px solid #E9E9E9;
		width: 60px;
		height: 60px;
	}
	.sp_header .header_content a{
		display: block;
		padding: 7.5px;
		text-align: center;
	}
	.sp_header .header_content a img{
		width: 42px;
		height: 42px;

	}

	.hum_menu{
		z-index: 9999;
		background: #fff;
	    display: block;
	    width: 60px;
	    height: 60px;
        border-left: 1px solid #E9E9E9;
	}
	#top_wrapper .nav_wrap{
		border-bottom: 1px solid #E9E9E9;
	}
	#top_wrapper .hum_menu{
		border-bottom: 1px solid #E9E9E9;
	}
	#top_wrapper .entry{
		padding: 3px 20px;
		width: 120px;
		border-radius: 10px;
		text-align: center;
		margin-right: 10px;
	}

	.drawer-list {
	  position: fixed;
	  right: 0;
	  top: 0;
	  height: 100vh;
	  width: 100vw;
	  transform: translate(100vw, 0);
	  /* ie workaround */
	  -ms-transform: translatex(-100vw);
	  box-sizing: border-box;
	  pointer-events: none;
	  padding-top: 50px;
	  transition: width 475ms ease-out, transform 450ms ease, border-radius 0.8s 0.1s ease;
	  border-bottom-left-radius: 100vw;
	  background-color: #000;
	  background-color: rgba(0, 0, 0, 0.8);
	}
	.drawer-list form {
		width: 60%;
		margin: 0 auto;
	}
	@media (min-width: 768px) {
	  .drawer-list {
	    width: 40vw;
	  }
	}
	.drawer-list ul {
	  height: 100%;
	  width: 100%;
	  margin: 0;
	  padding: 0;
	  overflow: auto;
	  overflow-x: hidden;
	  pointer-events: auto;
	}
	.drawer-list li {
	  list-style: none;
	  text-transform: uppercase;
	  pointer-events: auto;
	  white-space: nowrap;
	  box-sizing: border-box;
	  transform: translatex(100vw);
	  /* ie workaround */
	  -ms-transform: translatex(-100vw);
	}
	.drawer-list li:last-child {
	  margin-bottom: 2em;
	}
	.drawer-list li a {
	  text-decoration: none;
	  color: #fefefe;
	  text-align: center;
	  display: block;
	  padding: 1rem;
	  font-size: calc(24px - 0.5vw);
	}
	@media (min-width: 768px) {
	  .drawer-list li a {
	    text-align: right;
	    padding: 0.5rem;
	  }
	}
	.drawer-list li a:hover {
	  cursor: pointer;
	  background-color: #B40019;
	  background-color: rgba(180, 0, 25, 0.6);
	}

	input.hamburger {
	  display: none;
	}
	input.hamburger:checked ~ .drawer-list {
	  transform: translatex(0);
	  border-bottom-left-radius: 0;
	}
	input.hamburger:checked ~ .drawer-list li {
	  transform: translatex(0);
	  width: 100% !important;
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(1) {
	  transition: transform 1s 0.08s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(2) {
	  transition: transform 1s 0.16s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(3) {
	  transition: transform 1s 0.24s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(4) {
	  transition: transform 1s 0.32s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(5) {
	  transition: transform 1s 0.4s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(6) {
	  transition: transform 1s 0.48s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(7) {
	  transition: transform 1s 0.56s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(8) {
	  transition: transform 1s 0.64s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(9) {
	  transition: transform 1s 0.72s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(10) {
	  transition: transform 1s 0.8s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(11) {
	  transition: transform 1s 0.88s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(12) {
	  transition: transform 1s 0.96s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(13) {
	  transition: transform 1s 1.04s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(14) {
	  transition: transform 1s 1.12s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(15) {
	  transition: transform 1s 1.2s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(16) {
	  transition: transform 1s 1.28s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(17) {
	  transition: transform 1s 1.36s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(18) {
	  transition: transform 1s 1.44s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(19) {
	  transition: transform 1s 1.52s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(20) {
	  transition: transform 1s 1.6s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(21) {
	  transition: transform 1s 1.68s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(22) {
	  transition: transform 1s 1.76s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(23) {
	  transition: transform 1s 1.84s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(24) {
	  transition: transform 1s 1.92s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(25) {
	  transition: transform 1s 2s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(26) {
	  transition: transform 1s 2.08s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(27) {
	  transition: transform 1s 2.16s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(28) {
	  transition: transform 1s 2.24s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(29) {
	  transition: transform 1s 2.32s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(30) {
	  transition: transform 1s 2.4s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(31) {
	  transition: transform 1s 2.48s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(32) {
	  transition: transform 1s 2.56s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(33) {
	  transition: transform 1s 2.64s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(34) {
	  transition: transform 1s 2.72s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(35) {
	  transition: transform 1s 2.8s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(36) {
	  transition: transform 1s 2.88s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(37) {
	  transition: transform 1s 2.96s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(38) {
	  transition: transform 1s 3.04s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(39) {
	  transition: transform 1s 3.12s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(40) {
	  transition: transform 1s 3.2s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(41) {
	  transition: transform 1s 3.28s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(42) {
	  transition: transform 1s 3.36s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(43) {
	  transition: transform 1s 3.44s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(44) {
	  transition: transform 1s 3.52s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(45) {
	  transition: transform 1s 3.6s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(46) {
	  transition: transform 1s 3.68s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(47) {
	  transition: transform 1s 3.76s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(48) {
	  transition: transform 1s 3.84s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(49) {
	  transition: transform 1s 3.92s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li:nth-child(50) {
	  transition: transform 1s 4s cubic-bezier(0.29, 1.4, 0.44, 0.96);
	}
	input.hamburger:checked ~ .drawer-list li a {
	  padding-right: 15px;
	}
	input.hamburger:checked ~ label > i {
	  background-color: transparent;
	  transform: rotate(90deg);
	  left: 15px;
	}
	input.hamburger:checked ~ label > i:before {
	  transform: translate(-50%, -50%) rotate(315deg);
      left: 50%;
	}
	input.hamburger:checked ~ label > i:after {
	  transform: translate(-50%, -50%) rotate(-315deg);
      width: 30px;
      left: 50%;
	}
	input.hamburger:checked ~ label close {
	  color: #fefefe;
	  width: 100%;
	}
	input.hamburger:checked ~ label open {
	  color: rgba(0, 0, 0, 0);
	  width: 0;
	}

	label.hamburger {
	  z-index: 9999;
	  position: relative;
	  display: block;
	  height: 60px;
	  width: 60px;
	  margin: auto;
	  margin-left: -15px;
	  text-align: center;
	position: fixed;}
	label.hamburger:hover {
	  cursor: pointer;
	}
	label.hamburger text close,
	label.hamburger text open {
	  text-transform: uppercase;
	  font-size: 11px !important;
	  align-text: center;
	  position: absolute;
	  transform: translateY(50px);
	  text-align: center;
	  overflow: hidden;
	  transition: width 0.25s 0.35s, color 0.45s 0.35s;
	}
	label.hamburger text close {
	  color: #B40019;
	  right: 0;
	  width: 0;
	}
	label.hamburger text open {
	  color: #B40019;
	  width: 100%;
	}
	label.hamburger > i {
	  position: absolute;
	  width: 30px;
	  height: 2px;
	  top: 50%;
	  background-color: #97989A;
	  pointer-events: auto;
	  transition-duration: 0.35s;
	  transition-delay: 0.35s;
	}
	label.hamburger > i:before{
	  position: absolute;
	  display: block;
	  width: 30px;
	  height: 2px;
	  left: 50%;
	  background-color: #97989A;
	  content: "";
	  transition: transform 0.35s;
	  transform-origin: 50% 50%;
	}
	label.hamburger > i:after {
	  position: absolute;
	  display: block;
	  width: 20px;
	  height: 2px;
	  left: 35%;
	  background-color: #97989A;
	  content: "";
	  transition: transform 0.35s;
	  transform-origin: 50% 50%;
	}
	label.hamburger > i:before {
	  transform: translate(-50%, -10px);
	}
	label.hamburger > i:after {
	  transform: translate(-50%, 10px);
	}
/*
	label.hamburger {
	  position: fixed;
	  top: 10px;
	  left: 15px;
	}*/
	.accordion_header.p1em{
		padding: 1em;
	}
	.accordion_one .accordion_header {
	  color: #fff;
	  text-align: center;
	  z-index: +1;
	  cursor: pointer;
	  transition-duration: 0.2s;
	  font-family: futura-pt, sans-serif !important;
      font-weight: 700 !important;
      letter-spacing: 1.5px !important;
      position: relative;
	}
	.accordion_one .accordion_header:after{
	  content: '＋';
	  display: inline-block;
	  color: #fff;
	  position: absolute;
	  right: 50%;
	  margin-right: -80px;
      top: 50%;
      margin-top: -14px;
      font-size: 20px;
	}
	.accordion_one .accordion_header.open:after{
	  content: 'ー';
	  display: inline-block;
	  color: #fff;
	  position: absolute;
	  right: 50%;
	  margin-right: -80px;
      top: 50%;
      margin-top: -14px;
      font-size: 20px;
	}
	.accordion_one:nth-of-type(1) .accordion_inner .accordion_header {
	  /*background-color: #B40019;*/
	  background-color: rgba(180, 0, 25, 0.8);
	}
	.accordion_one:nth-of-type(1) .accordion_inner .accordion_header:after{
	  content: '';
	  display: none;
	}
	.accordion_one:nth-of-type(1) .accordion_inner  .accordion_header {
	  background-color: rgba(35,47,95, 0.5);
	}
	.accordion_one:nth-of-type(1) .accordion_inner  .accordion_header a{
	  color: #fff;
	  padding: 1em;
	  display: block;
	}
	.accordion_one .accordion_header:hover {
	  opacity: .8;
	}
	.accordion_one .accordion_inner {
	  display: none;
	  padding: 0;
	  box-sizing: border-box;
	}
	.sp_nav .navbar-brand{
		margin-left: 10px;
	}
	#audience_analytics header,
	#post_analytics header,
	#stories_analytics header,
	#account_analytics header{
		height: 60px;
	}
}
@media screen and (max-width: 991px) and (min-width: 768px){
	.br_tb{
		display: block;
	}
	#stories_analytics .graph_wrap .stories_list .card{
		margin-right: 15px;
	}
	#stories_analytics .graph_wrap .stories_list .card:nth-of-type(2n){
		margin-right: 0;
	}
	#audience_analytics header,
	.sp_nav .nav_wrap{
		height: 60px;
	}
	.drawer-list ul{
		padding-top: 30px;
	}
	.accordion_header.p1em{
		text-align: right;
		padding-right: 50px;
	}
	.accordion_one .accordion_header.open:after,
	.accordion_one .accordion_header:after{
		right: 15px;
		margin-right: 0;
	}
	.accordion_one:nth-of-type(1) .accordion_inner .accordion_header{
		text-align: right;
	}

	header.agents_header ul{
		display: block;
	}
	/*#signin,
	#fb_list,
	#auth{
		height: 100vh;
	}*/
	#top_wrapper .inner{
		max-width: 700px;
		width: 100%;
	}
	#top_wrapper .dn_pc .navbar .navbar-brand{
		margin-left: 15px;
	}
	#top_wrapper .dn_pc .navbar button.navbar-toggler{
		margin-right: 15px;
	}
	#top_wrapper .dn_pc .navbar .collapse{
		background: #fff;
		width: 100%;
	    margin-top: 10px;
	    z-index: 99;
	}
	/*.dn_pc .navbar .collapse.show ul{
		background: #818181;
	}*/
	#top_wrapper .dn_pc .navbar .collapse.show ul li,
	#top_wrapper .dn_pc .navbar .collapse ul li{
		padding: 15px;
		margin: 0;
	    border-top: 1px solid #f1f1f1;
	    text-align: center;
	}
	#top_wrapper .dn_pc .navbar .collapse.show ul li a{
		color: #888;
	}
	.entry{
		padding: 10px 15px;
	    width: 300px;
	    display: block;
	    margin: 0 auto;
	}
	.mv{
    	background-size: 65%,100%;
    	background-position: 120% 150px,center 400px;
	}
	.card{
		/* width: 220px !important; */
	}
	#top #feature .inner .card_wrap .card .card_body h4.title{
		font-size: 16px !important;
		margin-bottom: 15px;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap .inner_wrap,
	#top .merit_wrap #func_03 .inner .desc_wrap .inner_wrap{
		width: 400px;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap,
	#top .merit_wrap #func_03 .inner .desc_wrap{
		background-position-x: 0;
	}
	#top .merit_wrap #func_02 .inner .desc_wrap{
		background-position-x: 400px;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap h4.title, 
	#top .merit_wrap #func_02 .inner .desc_wrap h4.title, 
	#top .merit_wrap #func_03 .inner .desc_wrap h4.title{
		font-size: 30px !important;
	}
	.card_wrap .card .card_body h4.title{
		margin-bottom: 15px;
	}
	#top .merit_wrap #func_03 .inner .card_wrap .card .card_body h4.title{
		font-size: 14px !important;
	}
	#top_plan .plan_wrap .card_wrap .card .price{
		font-size: 25px !important;
	}
	#top_plan .plan_wrap .card_wrap .card ul{
		padding: 0;
	margin-bottom: 20px;}
	#top_plan .plan_wrap .card_wrap .card h3.title.custom{
		padding-bottom: 29px;
	}
	#top_plan .plan_wrap .card_wrap .card ul li{
		font-size: 15px !important;
	}
	#top_faq .card{
		width: 100% !important;
	}

	/*#payment_history .inner_wrap{
		height: 100vh;
	}*/

	footer.footer_top .inner{
		-ms-align-items: flex-start !important;
		align-items: flex-start !important;
	}
	footer.footer_top .inner ul{
		padding: 0;
		margin-top: 0;
	}
	footer.footer_top .inner .left{
		max-width: 480px;
		margin-right: 15px;
	}
	footer.footer_top .inner ul li a{
		font-size: 10px !important;
	}
	footer .inner .right p.desc{
		font-size: 11px !important;
	}
	footer .inner .right button{
		width: 200px !important;
	}
	footer .inner .right button a{
		padding: 5px;
	    font-size: 13px !important;
	}
	
	
	#back-top {
		bottom: 100px;
	}
}
@media screen and (max-width: 1200px) and (min-width: 768px) {
	
	#plan .inner{
		max-width: 95%;
	}
	#plan .plan_wrap .card_wrap {
		justify-content: space-between;
    flex-wrap: wrap;
		
	}
	#plan .plan_wrap .card_wrap .card{
		width: 31%;
	}
}
@media screen and (max-width: 767px) and (min-width: 320px ) {
	.btn_back{
	    margin: 0 80px 0 0;
	}
	.alert:before{
		width: 40px;
		/*height: 30px;
*/	}
	#top_wrapper .dn_pc{
		display: block !important;
	}
	#top_wrapper .dn_pc .navbar{
		height: 60px;
		background: #fff;
		padding: 10px 0 !important;
	}
	#top_wrapper .dn_pc .navbar .navbar-brand{
		margin-left: 15px;
	}
	#top_wrapper .dn_pc .navbar button.navbar-toggler{
		margin-right: 15px;
	}
	#top_wrapper .dn_pc .navbar .collapse{
		background: #fff;
		width: 100%;
	    margin-top: 10px;
	    z-index: 99;
	}
	/*.dn_pc .navbar .collapse.show ul{
		background: #818181;
	}*/
	#top_wrapper .dn_pc .navbar .collapse.show ul li{
		padding: 15px;
		margin: 0;
	    border-top: 1px solid #f1f1f1;
	    text-align: center;
	}
	#top_wrapper .dn_pc .navbar .collapse.show ul li a{
		color: #888;
	}
	.entry{
		padding: 10px 15px;
	    display: block;
	    width: 300px;
	    margin: 0 auto;
	}

	/*********************************
	 Main Visual
	*********************************/
	.mv{
		background: url(img/top/bg_top_right.png) no-repeat,url(img/top/bg_top_bottom.png) no-repeat;
	    background-size: 90%,100%;
	    background-position: 120% 350px,center 550px;
	    height: 600px;
	}
	.mv .inner{
		max-width: 350px;
		margin: 0 auto;
		text-align: center;
	}
	.mv .inner .partner {
		padding-top: 15px;
		text-align: center;
	}
	.mv .inner .partner span {
	}
	.mv .inner .inner_wrap{
		width: 100%;
		top: 30px;
	}
	.mv .inner .inner_wrap h2.title{
		margin-top: 20px;
		font-size: 20px !important;
		text-align: center;
	}
	.mv .inner .inner_wrap p.desc{
		font-size: 14px !important;
		text-align: center;
	}
	#top section .inner{
		max-width: 350px;
		margin: 0 auto;
		text-align: center;
	}
	.footer_top .inner{
		max-width: 320px;
		margin: 0 auto;
	}
	#top #feature .inner .card_wrap{
		flex-flow: column;
		-ms-align-items: center;
		align-items: center;
	}
	#top #feature .inner .card_wrap .card{
		margin-bottom: 20px;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap h4.title, 
	#top .merit_wrap #func_02 .inner .desc_wrap h4.title, 
	#top .merit_wrap #func_03 .inner .desc_wrap h4.title{
		font-size: 22px !important;
		text-align: center;
		line-height: 1.5 !important;
		font-weight: 700;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap p.desc, 
	#top .merit_wrap #func_02 .inner .desc_wrap p.desc, 
	#top .merit_wrap #func_03 .inner .desc_wrap p.desc{
		font-size: 16px !important;
		text-align: center;
		line-height: 1.5 !important;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap button,
	#top .merit_wrap #func_02 .inner .desc_wrap button,
	#top .merit_wrap #func_03 .inner .desc_wrap button{
		width: 300px;
	}
	#top .merit_wrap #func_01 .inner p.subtitle{
		font-size: 30px !important;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap{
	    background-position-x: center;
    	background-position-y: -10px;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap .inner_wrap,
	#top .merit_wrap #func_02 .inner .desc_wrap .inner_wrap,
	#top .merit_wrap #func_03 .inner .desc_wrap .inner_wrap{
		padding-top: 450px;
		max-width: 350px;
		width: 100%;
	}
	#top .merit_wrap #func_01 .inner .desc_wrap p.subtitle,
	#top .merit_wrap #func_02 .inner .desc_wrap p.subtitle,
	#top .merit_wrap #func_03 .inner .desc_wrap p.subtitle{
		text-align: center;
		font-size: 14px !important;
	}
	#top .merit_wrap #func_01 .inner .card_wrap, #top .merit_wrap #func_02 .inner .card_wrap, #top .merit_wrap #func_03 .inner .card_wrap, #top #voices .inner .card_wrap, .plan_wrap .flex, #plan .flex {
		flex-flow: column;
		-ms-align-items: center;
		align-items: center;
	}
	#top .merit_wrap #func_01 .inner .card_wrap .card, #top .merit_wrap #func_02 .inner .card_wrap .card, #top .merit_wrap #func_03 .inner .card_wrap .card, #top #voices .inner .card_wrap .card{
		width: 300px;
	}
	#func_02 .inner{
		padding-top: 0 !important;
	}
	#top .merit_wrap #func_02 .inner .desc_wrap{
		background-position-x: center;
		background-position-y: 0px;
	}
	#top .merit_wrap #func_02 .inner .bottom_wrap{
		flex-flow: column;
		-ms-align-items: center;
		align-items: center;
	}
	#top .merit_wrap #func_02 .inner .bottom_wrap .left h4.title{
		font-size: 22px !important;
		text-align: center;
		line-height: 1.5 !important;
		font-weight: 700;
	}
	#top .merit_wrap #func_02 .inner .bottom_wrap .left p.desc{
		font-size: 14px !important;
		text-align: center;
	}
	#top .merit_wrap #func_03 .inner .card_wrap .card .card_body h4.title{
		font-size: 18px !important;
	}
	#top .merit_wrap #func_03 .inner .card_wrap .card .card_body p.desc{
		font-size: 13px !important;
	}
	#top #voices .inner p.subtitle{
		font-size: 30px !important;
	}
	#top #voices .inner .card_wrap .card .card_body p.desc{
		overflow: visible;
		height: auto;
	}
	#top_plan .inner p.subtitle{
		font-size: 25px !important;
	}
	#top_plan .plan_wrap .card_wrap {
		display: block;
	}
	#top_plan .plan_wrap .card_wrap .card{
		margin-bottom: 30px;
		width: 100%!important;
	}
	#top_plan .plan_wrap .card_wrap .card p.txt {
		margin-bottom: 30px;
		width: 100%!important;
	}
	.footer_top .inner{
		flex-flow: column;
	}
	.footer_top .inner .left{
		order: 2;
	}
	.footer_top .inner .right{
		order: 1;
		text-align: center;
		margin-bottom: 30px;
	}
	.footer_top .inner .left,
	.footer_top .inner .left .list_wrap{
		display: block !important;
	}
	.footer_top .inner .right h4,
	.footer_top .inner .right p.desc{

	}
	.footer_top .inner .left ul p{
		margin-top: 15px;
	}


	#payment_history .tb_payment{
		margin-top: 30px;
	}

	/* Post/Stories */
	#post_analytics .graph_wrap .header .header_left,
	#stories_analytics .graph_wrap .header .header_left{
		padding: 15px 0;
	}
	#post_analytics .inner .graph_wrap,
	#stories_analytics .inner .graph_wrap{
		padding: 0 !important;
		background: none;
	}
	#post_analytics .graph_wrap .stories_list .card:first-of-type,
	#stories_analytics .graph_wrap .stories_list .card:first-of-type{
		margin-top: 0;
	}
	#post_analytics .stories_list .card,
	#stories_analytics .stories_list .card{
		width: 100% !important;
	}
	#post_analytics .stories_list .card .card_header{
		width: 100% !important;
		height: 300px !important;
	}
	#stories_analytics .graph_wrap .stories_list .card .card_body{
		padding: 15px; 
	}
	#stories_analytics .sumbox .img_wrap{
		display: none;
	}
	#audience_analytics .less_follower{
		display: block;
	}
	#audience_analytics .less_follower .left, 
	#audience_analytics .less_follower .right{
		width: 100%;
		max-width: 100%;
	}
}
@media screen and (max-width: 767px) and (min-width: 501px ){
	#top .merit_wrap #func_01,
	#top .merit_wrap #func_02,
	#top .merit_wrap #func_03{
		background-size: 65%;
	}
	#top .merit_wrap #func_01{
	    background-position-y: 150px;
	}
	#top .merit_wrap #func_02{

	}
	#top .merit_wrap #func_03{
	    background-position-y: 0px;
	}
}
@media screen and (max-width: 500px) and (min-width: 320px ){
	#top .merit_wrap #func_01,
	#top .merit_wrap #func_02,
	#top .merit_wrap #func_03{
		background-size: 70%;
	}
	#top .merit_wrap #func_01{
	    background-position-y: 150px;
	}
	#auth .cb{
		position: relative;
		padding-bottom: 50px;
	}
	#auth .cb label{
		position: absolute;
		padding-left: 10px;
	}
	#auth #biz_account .inner{
		width: 100% !important;
	}
	#auth .contact{
		display: block;
	}
	#auth .contact .link_wrap{
		margin-top: 30px !important;
		margin: 0 auto;
	}
}
/*********************************
		  SP02:General
*********************************/
@media screen and (max-width: 350px) {
	.dn_pc{
		display: block !important;
	}
	.dn_sp{
		display: none !important;
	}
	.dn_pc .navbar{
		height: 60px;
		background: #fff;
		/*padding: 10px 0 !important;*/
	}
	.dn_pc .navbar .navbar-brand{
		margin-left: 15px;
	}
	.dn_pc .navbar button.navbar-toggler{
		margin-right: 15px;
	}
	.dn_pc .navbar .collapse{
		background: #fff;
		width: 100%;
	    z-index: 99;
	}
	/*.dn_pc .navbar .collapse.show ul{
		background: #818181;
	}*/
	.dn_pc .navbar .collapse.show ul li{
		padding: 15px;
		margin: 0;
	    border-top: 1px solid #f1f1f1;
	    text-align: center;
	}
	.dn_pc .navbar .collapse.show ul li a{
		display: block;
		color: #888;
	}
	header.agents_header .btn_back{
		margin-right: 10px;
	}
	header.agents_header a{

	}
}

/*********************************
	Media Query
	Breakpoint
	PC:992px~
	Tablet:768px~991px
	SP01:351~767px(最新スマホ系)
	SP02:~350px(iPhone SE .etc)
*********************************/

/*********************************
		  Tablet:Signinç³»
*********************************/
/*********************************
		   Tablet:Analytics
*********************************/

/*********************************
		      Tablet
*********************************/
@media screen and (max-width: 991px) and (min-width: 768px) {
	.term_nav ul{
		align-items: center;
	}
	.term_nav li{
		width: 100%;
	}
	.term_nav li a{
		padding: 10px 0;
	}
	.terms_mv h1{
		color: #fff;
		max-width: 700px;
		width: 100%;
		margin: 0 auto;
	}
	.terms .inner{
		max-width: 700px;
		width: 100%;
		margin: 0 auto;
		padding: 50px 0;
	}
	.dn_tb{
		display: none !important;
	}
	.dn_pc .navbar{
		height: 60px;
		background: #fff;
		/*padding: 0 !important;*/
	}
	.agents_header .dn_pc .navbar{
		padding: 0 !important;
	}
	.dn_pc .navbar .navbar-brand{
		margin-left: 15px;
	}
	.agents_header .hum_menu{
	    border-right: 1px solid #E9E9E9;
	}
	.dn_pc .navbar button.navbar-toggler{
		margin-right: 15px;
	}
	.agents_header .dn_pc .navbar button.navbar-toggler{
		margin-right: 0;
	}
	header.agents_header .btn_back{
		margin-right: 20px;
	}
	.dn_pc .navbar .collapse{
		background: #fff;
		width: 100%;
	    z-index: 99;
	    margin-top: 5px;
	}
	.dn_pc .navbar .collapse ul li,
	.dn_pc .navbar .collapse.show ul li{
		padding: 15px;
		margin: 0;
	    border-top: 1px solid #f1f1f1;
	    width: 100%;
	    text-align: center;
	}
	.dn_pc .navbar .collapse ul li a,
	.dn_pc .navbar .collapse.show ul li a{
		color: #888;
	}
	.wrapper.analytics {
	    display: block;
	}
	.wrapper.analytics .main_wrapper .inner,
	.wrapper.agents .main_wrapper .inner,
	#create_plan .main_wrapper,
	#plan_list .main_wrapper{
		width: 100%;
		max-width: 750px;
	}
	.agents_header .sp_nav{
	    max-width: 750px;
	    margin: 0 auto;
	}
	#sidebar{
		display: none;
	}
	.br_sp{
		display: block;
	}
	#agents_user_list .inner .user_list .user{
		width: 360px;
	}
	.wrapper.agents .inner .table_wrap{
		width: 95%;
	}
	#agents_info .inner .table_wrap{
		width: 100%;
	}
	#create_agents form .label_wrap{
		width: 100%;
	}
	#stories_analytics .sumbox,
	#post_analytics .sumbox,
	#account_analytics .sumbox {
		background: #fff;
		padding: 10px 15px;
		position: relative;
		margin-bottom: 20px;
		width: 32%;
	}
	#audience_analytics .sumbox {
		width: 49%;
	}
	.stories_list .card{
		width: 350px !important;
	}
	.stories_list .card .card_header{
		width: 350px !important;
		height: 350px !important;
	}
	#stories_analytics .card .card_header{
		height: auto !important;
	}
	#faq .content{
		width: 100%;
		padding: 30px;
	}
	#faq .card,
	#account_info .content,
	#account_info form .label_wrap{
		width: 100% !important;
	}
	#audience_analytics .inner_grid .graph_wrap{
		max-width: 365px;
		width: 100%;
	}
}


/*********************************
		  SP01:General
*********************************/
@media screen and (max-width: 767px) and (min-width: 320px) {
	.agents_header .dn_pc .navbar{
		padding: 0 !important;
	}
	.agents_header .hum_menu{
		border-right: 1px solid #e9e9e9;
	}
	.term_nav ul{
		align-items: center;
	}
	.term_nav li{
		width: 100%;
	}
	.term_nav li a{
		display: block;
		text-align: center;
		width: 100%;
		padding: 10px 0;
	}
	.terms_mv h1{
		color: #fff;
		max-width: 360px;
		width: 100%;
		margin: 0 auto;
		text-align: center;
	}
	.terms .inner{
		max-width: 360px;
		width: 100%;
		margin: 0 auto;
		padding: 50px 0;
	}
	.wrapper.analytics {
	    display: block;
	}
	.wrapper.analytics .main_wrapper .inner,
	.wrapper.agents .main_wrapper .inner{
		width: 100%;
	}
	#sidebar{
		display: none;
	}
	.wrapper h1.title img{
		display: block;
		margin: 0 auto 30px;
		width: 150px;
	}
	#account_info .terms .content{
		max-width: 360px !important;
		width: 100% !important;
	}
	#payment_history .content{
		padding: 30px 0px;
	}
	#stories_analytics .bottom form{
		display: block;
	}
	#stories_analytics .bottom form .dropdown_wrap,
	#stories_analytics .bottom form .term_wrap{
		width: 100%;
	}
	#stories_analytics .bottom form .dropdown_wrap{
		justify-content: space-between;
		margin-bottom: 15px;
	}
	#stories_analytics .bottom form .dropdown_wrap select{
		width: 49%;
	}
	#stories_analytics .bottom form .term_wrap,
	#post_analytics .bottom form .term_wrap{
		flex-wrap: wrap;
	}
	#stories_analytics .bottom form .term_wrap input,
	#post_analytics .bottom form .term_wrap input{
		width: 47%;
	}
	.page-link{
		font-size: 14px !important;
	}
}
/*********************************
		  SP01:Signinç³»
*********************************/
@media screen and (max-width: 960px) and (min-width: 320px) {
	.dn_sp{
		display: none !important;
	}
	.graph_header.outer{
		display: block;
		margin-top: 20px;
	}
	.graph_header.outer h3{
		margin-bottom: 5px;
	}
	.graph_header.outer button{
		width: 100%;
	}
	/* signin */
	#signin,
	#reset,
	#forget,
	#biz_account,
	#reset_complete,
	#thanks{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-ms-align-items: center;
		align-items: center;
	}
	#biz_account{
		flex-flow: column;
	}
	#biz_account h1{
		max-width: 360px;
		width: 100%;
	}
	#biz_account .inner h2{
	font-size: 1.2rem!important;
	}
	/*#top_payment_info{
		height: 100% !important;
	}*/
	#signup{
		height: auto;
	}
	#signin .inner, #reset .inner, #signup .inner, #forget .inner, #thanks .inner, #reset_complete .inner, #top_payment_info .inner, #fb_list .inner{
		max-width: 360px;
		width: 100%;
		padding: 100px 0px;
	}
	#biz_account .inner{
		max-width: 360px;
		width: 100%;
		padding: 50px 30px;
	}
	#fb_list .fb_list{
		width: 100%;
		margin: 0 auto;
	}

	/* payment_info */
	#top_payment_info .credit_wrap .form_wrap form{
		max-width: 350px;
		width: 100%;
	    padding: 50px 10px;
	}
	#top_payment_info .credit_wrap .form_wrap form label{
		margin-top: 0;
	}
	#top_payment_info .credit_wrap .form_wrap form input{
		margin-bottom: 15px;
	}
	#top_payment_info .credit_wrap button{
		padding: 10px;
		color: white;
	}


	/* payment_info */

	#signin form label input,
	#signup form label input,
	#reset form label input,
	#forget form label input{
		background: rgba(255,255,255,.8);
		border: 1px solid #fff !important;
	}

	#plan .plan_wrap .card_wrap{
		justify-content: space-between;
	    flex-wrap: wrap;
	}
	#plan .plan_wrap .card_wrap .card{
		margin: 0 auto 30px;
	width: 46%;}

	#plan .plan_wrap .card_wrap .card p.txt{
		
	height: auto;}

	/* auth */
	#auth .inner,
	.progress_wrap{
		max-width: 360px;
		width: 100%;
	}
	.progress_wrap .card{
		max-width: 100px;
		width: 100%;
	}
	.progress_wrap .card .num{
		width: 25px;
		height: 25px;
	}
	.progress_wrap .card p.title{
		font-size: 12px !important;
	}
	.progress_wrap .card .num span,
	.progress_wrap .card.active .num span{
		line-height: 25px;
	}
	.progress_wrap .hr_white{
		width: 85%;
		top: 45px;
	}
	#account_info .content,
	#account_info .content form{
		width: 100%;
	}
	/* Account_info */
	#account_info form .label_wrap,
	#payment_history .content{
		max-width: 100%;
		width: 100%;
	}

	footer.footer_signin{
		height: auto;
		padding: 15px !important;
	}
	footer.footer_signin .inner{
		flex-flow: column;
	}
	footer.footer_signin .inner .copy{
		order: 2;
	}
	footer.footer_signin .inner ul{
		order: 1;
		display: block !important;
		max-width: 360px;
    	width: 100%;
	}
	footer.footer_signin .inner li{
		margin-bottom: 15px;
		border: none !important;
	}
	.admin_header .inner{
		max-width: 360px;
	}
}
/*********************************
		   SP01:Analytics
*********************************/
@media screen and (max-width: 700px){
	.narrow .upper{
		display: block;
	}
	.narrow .upper .narrow_btn{
		margin-bottom: 15px;
		width: 100%;
	}
	.narrow .bottom{
		display: block;
	}
	.narrow .bottom input{
		width: 48%;
	}
	.narrow .bottom .narrow_btn{
		margin-top: 15px;
		width: 100%;
	}
}
@media screen and (max-width: 767px) and (min-width: 500px ) {
	#audience_analytics .inner .summary,
	#account_analytics .inner .summary,
	#stories_analytics .inner .summary,
	#post_analytics .inner .summary{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
	#stories_analytics .sumbox,
	#post_analytics .sumbox,
	#account_analytics .sumbox,
	#audience_analytics .sumbox{
		background: #fff;
		padding: 10px 9px;
		position: relative;
		width: 49%;
		margin-bottom: 20px;
	}
	#account_analytics .inner .summary .sumbox,
	#stories_analytics .inner .summary .sumbox,
	#post_analytics .inner .summary .sumbox{
		margin-bottom: 10px;
		width: 49%;
	}
}
@media screen and (max-width: 499px){
	/*#stories_analytics .sumbox,
	#post_analytics .sumbox,
	#account_analytics .sumbox,
	#audience_analytics .sumbox{
		background: #fff;
		padding: 10px 15px;
		position: relative;
		width: 100%;
		margin-bottom: 20px;
	}*/
	#account_analytics .inner .summary .sumbox,
	#stories_analytics .inner .summary .sumbox,
	#post_analytics .inner .summary .sumbox{
		margin-bottom: 10px;
		width: 100%;
		padding: 6px;
	}
	/*#account_analytics .inner .summary,
	#stories_analytics .inner .summary,
	#post_analytics .inner .summary{
		display: block !important;
	}*/
}
@media screen and (max-width: 767px) and (min-width: 320px ) {
	.wrapper.analytics .main_wrapper .inner{
		/*max-width: 360px;*/
	    max-width: 100%;
	    padding: 15px 15px 100px 15px;
		width: 100%;
	}
	.wrapper.analytics .main_wrapper .collapse{
	    z-index: 9999999;
	    margin-top: 50px;
	    background: #fff;
	}
	.wrapper.analytics .main_wrapper .collapse ul{
		/*margin-top: 50px;*/
		border-top: 1px solid #333;
	}
	.wrapper.analytics .main_wrapper .collapsing ul{
		border-top: 1px solid #333;
	}
	.wrapper.analytics .main_wrapper .collapsing{
		margin-top: 50px;
	}
	.wrapper.analytics .main_wrapper .collapsing li{
		text-align: center !important;
	}
	.wrapper.analytics .main_wrapper .collapse ul li{
		padding: 1em;
	}
	.wrapper.analytics .main_wrapper .collapse li a{
	    color: #888;
	    text-align: center;
	}
	#audience_analytics .inner_grid .graph_wrap{
		max-width: 100%;
	}

	/* General */
	/*.sp_nav ul{
		background: #fff;
	}*/
	.sp_nav ul li{
		padding: 1em;
	}
	.sp_nav ul li a{
		color: #fff;
		text-align: center;
		display: block;
	}
	
	
	.sumbox .img_wrap{
		display: none;
	}
	.sumbox .data,
	.sumbox .data_sub,
	.sumbox .data_sub{
		text-align: center;
		margin-top: 10px;
	}

	#stories_analytics .graph_wrap .stories_list,
	#post_analytics .graph_wrap .stories_list{
		justify-content: center;
	}


	#inner_sidebar{
		display: none;
	}

	/* Audience */
	
	#audience_analytics .inner .summary .sumbox{
		margin-bottom: 20px;
	}
	#audience_analytics .inner_grid{
		display: block !important;
	}

	/* Account */

	/* Stories */

	
	#payment_history .content .table_wrap{
	    background: #fff;
	    padding-top: 20px;
	    padding: 20px 5px;
	}
	/* FAQ */
	#faq .content{
		padding: 30px;
	}


	footer.footer_analytics{
		height: 100%;
		padding: 15px !important;
	}
	footer.footer_analytics .inner{
		flex-flow: column;
	}
	footer.footer_analytics .inner .copy{
		order: 2;
	}
	footer.footer_analytics .inner ul{
		order: 1;
		display: block !important;
		/* max-width: 360px; */
    	width: 100%;
	}
	footer.footer_analytics .inner li{
		margin-bottom: 15px;
		border: none !important;
	}
	#back-top {
		bottom: 80px;
	}
}


/*********************************
		    SP01:Admin
*********************************/
@media screen and (max-width: 767px) and (min-width: 320px ) {
	.dn_pc{
		display: block !important;
	}
	.dn_pc .navbar{
		height: 60px;
		/*background: #fff;*/
		padding: 10px 0 !important;
		/*flex-wrap: nowrap !important;*/
	}
	.dn_pc .navbar .navbar-brand{
		margin-left: 15px;
	}
	.dn_pc .navbar button.navbar-toggler{
		margin-right: 15px;
		position: absolute;
		right: 0;
	}
	.agents_header .navbar button.navbar-toggler{
		margin-right: 0;
	}
	.dn_pc .navbar{
		/*margin-right: 15px;*/
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
	}
	.agents_header .dn_pc .navbar{
		max-width: 360px;
	    width: 100%;
	    margin: 0 auto;
	    top: 0;
		right: 0;
		left: 0;
	}
	
	.dn_pc .navbar .collapse{
		background: #fff;
		width: 100%;
	    margin-top: 10px;
	    z-index: 99;
	}
	/*.dn_pc .navbar .collapse.show ul{
		background: #818181;
	}*/
	.dn_pc .navbar .collapse ul li,
	.dn_pc .navbar .collapse.show ul li{
		padding: 15px;
		margin: 0;
	    border-top: 1px solid #f1f1f1;
	    text-align: center;
	}

	.wrapper.agents .main_wrapper .inner,
	header.agents_header .inner{
		max-width: 360px;
		width: 100%;
	}
	header.agents_header ul{
		display: block;
	}
	header.agents_header .btn_back{
		margin-right: 30px;
	}
	.h_menu button{
		border-color: #888;
	}

	.wrapper.agents .title,
	.wrapper.agents .alert{
		max-width: 360px;
    	width: 100%;
	}
	.wrapper.agents .title{
		margin-bottom: 30px;
	}

	/*.wrapper.agents{
		height: 100;
	}*/
	.wrapper.agents .main_wrapper .inner .content_wrap,
	.wrapper.agents .main_wrapper .inner .under_content_wrap,
	.wrapper.agents .main_wrapper .inner .content_wrap .left table th,
	.wrapper.agents .main_wrapper .inner .content_wrap .left table td{
		display: block !important;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap .left table th,
	.wrapper.agents .main_wrapper .inner .content_wrap .left table td{
		width: 100% !important;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap .left table th{
		background: #888;
		color: #fff;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap .left,
	.wrapper.agents .main_wrapper .inner .content_wrap .right,
	.wrapper.agents .main_wrapper .inner .under_content_wrap .left,
	.wrapper.agents .main_wrapper .inner .under_content_wrap .right{
		margin-bottom: 50px;
	}
	/* 代理店ユーザー系 */
	#agents_user_list .inner #search .dropdown_wrap{
		display: block !important;
	}
	#agents_user_list .inner #search .dropdown_wrap .custom-select{
	    max-width: 360px;
    	margin-bottom: 15px;
	}
	/* 代理店管理 */
	#agents_info .inner .inner_header{
		display: block !important;
	}
	#agents_info .inner .inner_header .title{
	    margin-bottom: 20px;
	}
	#agents_info .inner .table_wrap,
	#plan_list .inner .table_wrap,
	#payment_history .inner .table_wrap{
		overflow-x: scroll;
	}
	#agents_info .inner .table_wrap table,
	#plan_list .inner .table_wrap table
	/*#payment_history .inner .table_wrap table*/{
		min-width: 1000px;
	}
	#plan_list .inner .inner_header{
		display: block;
	}
	#plan_list .inner .inner_header .title{
		margin-bottom: 20px;
	}
	#agents_user form .attachment_wrap{
		display: block !important;
	}
	#agents_user form label{
		margin-bottom: 15px !important;
	}
	#agents_user form .attachment button{
		width: 100% !important;
	}
	#create_agents .content{
		padding: 0 !important;
	}
	#create_agents form .label_wrap,
	#create_agents form .attachment_wrap{
		max-width: 360px;
		width: 100%;
		display: block !important;
	}
	#create_agents form .attachment{
		display: block !important;
	}
	#create_agents form .attachment button{
		margin: 10px 0;
		width: 100%;
	}

	.terms button{
		margin: 50px auto;
	}
}



/*********************************
		  SP02:General
*********************************/
@media screen and (max-width: 350px) {
	.dn_pc{
		display: block !important;
	}
	.dn_sp{
		display: none !important;
	}
	.dn_pc .navbar{
		height: 60px;
		background: #fff;
		padding: 10px 0 10px 10px !important
	}
	.dn_pc .navbar .navbar-brand{
		margin-left: 15px;
	}
	.dn_pc .navbar button.navbar-toggler{
		margin-right: 15px;
	}
	.dn_pc .navbar .collapse{
		background: #fff;
		width: 100%;
	    z-index: 99;
	}
	/*.dn_pc .navbar .collapse.show ul{
		background: #818181;
	}*/
	.dn_pc .navbar .collapse.show ul li{
		padding: 15px;
		margin: 0;
	    border-top: 1px solid #f1f1f1;
	    text-align: center;
	}
	.dn_pc .navbar .collapse.show ul li a{
		display: block;
		color: #888;
	}
	.wrapper.analytics {
	    display: block;
	}
	.wrapper.analytics .main_wrapper .inner,
	.wrapper.agents .main_wrapper .inner{
		width: 100%;
	}
	#sidebar{
		display: none;
	}
	.wrapper h1.title img{
		display: block;
		margin: 0 auto 30px;
		width: 150px;
	}

	#signin .inner,
	#reset .inner,
	#signup .inner,
	#plan .inner,
	#forget .inner,
	#thanks .inner,
	#reset_complete .inner,
	#biz_account .inner,
	#plan .inner,
	#auth .inner,
	#top_payment_info .inner,
	.wrapper.analytics .main_wrapper .inner,
	.wrapper.agents .main_wrapper .inner,
	header.agents_header .inner{
		max-width: 300px;
		width: 100%;
		padding: 50px 0px;
	}
	#account_info form .label_wrap{
		max-width: 300px;
		width: 100%;
	}
	#payment_history .inner_wrap{
		height: 100%;
	}
	#payment_history .content{
		max-width: 300px;
		width: 100%;
		padding: 50px 15px;
	}
	#payment_history .inner_wrap .table_wrap{
		overflow-x: scroll;
		background: #fff;
	    padding-top: 20px;
	    padding-left: 0;
	}
	#payment_history .inner_wrap .table_wrap table{
		min-width: 1000px;
	}

	#top_payment_info{
		height: 100% !important;
	}
	#top_payment_info .credit_wrap .form_wrap button{
		width: 250px;
	}
	#top_payment_info .credit_wrap .form_wrap form .form-row .col,
	#top_payment_info .credit_wrap .form_wrap form .form-row #card-element{
	    max-width: 280px;
    	margin: 0 auto;
	}

	/* payment_info */
	#top_payment_info .credit_wrap .form_wrap form{
		max-width: 300px;
		width: 100%;
	    padding: 50px 10px;
	}
	#top_payment_info .credit_wrap .form_wrap form label{
		margin-top: 0;
	}
	#top_payment_info .credit_wrap .form_wrap form input{
		margin-bottom: 15px;
	}
	#top_payment_info .credit_wrap button{
		padding: 10px;
		color: white;
	}


	/* payment_info */

	#signin form label input,
	#reset form label input,
	#signup form label input,
	#forget form label input{
		background: rgba(255,255,255,.8);
		border: 1px solid #fff !important;
	}

	#plan .plan_wrap .card_wrap{
		display: block;
	}
	#plan .plan_wrap .card_wrap .card{
		margin: 0 auto 30px;
	}

	/* auth */
	.progress_wrap .card{
		max-width: 100px;
		width: 100%;
	}
	.progress_wrap .card .num{
		width: 25px;
		height: 25px;
	}
	.progress_wrap .card p.title{
		font-size: 12px !important;
	}
	.progress_wrap .card .num span,
	.progress_wrap .card.active .num span{
		line-height: 25px;
	}
	.progress_wrap .hr_white{
		width: 50%;
		top: 45px;
	}

	footer.footer_signin{
		/*height: 100%;*/
		height: auto;
		padding: 15px !important;
	}
	footer.footer_signin .inner{
		flex-flow: column;
	}
	footer.footer_signin .inner .copy{
		order: 2;
	}
	footer.footer_signin .inner ul{
		order: 1;
		display: block !important;
		max-width: 300px;
    	width: 100%;
	}
	footer.footer_signin .inner li{
		margin-bottom: 15px;
		border: none !important;
	}

	footer.footer_analytics{
		height: 100%;
		padding: 15px !important;
	}
	footer.footer_analytics .inner{
		flex-flow: column;
	}
	footer.footer_analytics .inner .copy{
		order: 2;
	}
	footer.footer_analytics .inner ul{
		order: 1;
		display: block !important;
		max-width: 360px;
    	width: 100%;
	}
	footer.footer_analytics .inner li{
		margin-bottom: 15px;
		border: none !important;
	}



	/*#account_analytics .inner .summary,
	#stories_analytics .inner .summary,
	#post_analytics .inner .summary{
		display: block !important;
	}*/
	#account_analytics .inner .summary .sumbox,
	#stories_analytics .inner .summary .sumbox,
	#post_analytics .inner .summary .sumbox{
		margin-bottom: 10px;
		width: 100%;
	}
	.sumbox .img_wrap{
		display: none;
	}
	.sumbox .data,
	.sumbox .data_sub,
	.sumbox .data_sub{
		text-align: center;
	}

	#stories_analytics .graph_wrap .stories_list,
	#post_analytics .graph_wrap .stories_list{
		justify-content: center;
	}

	#post_analytics .graph_wrap .stories_list .card .card_header{
		width: 270px;
		height: 270px;
	}


	#inner_sidebar{
		display: none;
	}

	#audience_analytics .inner .summary .sumbox{
		margin-bottom: 20px;
	}
	#audience_analytics .inner_grid{
		display: block !important;
	}

	/* Account */
	#account_info .content{
		max-width: 310px;
		width: 100%;
	}
	#account_info button.btn_center{
		max-width: 250px;
		width: 100%;
	}
	/* FAQ */
	#faq .content{
		padding: 30px 5px;
	}
	#stories_analytics .bottom form{
		display: block;
	}
	#stories_analytics .bottom form .dropdown_wrap,
	#stories_analytics .bottom form .term_wrap{
		width: 100%;
	}
	#stories_analytics .bottom form .dropdown_wrap{
		justify-content: space-between;
		margin-bottom: 15px;
	}
	#stories_analytics .bottom form .dropdown_wrap select{
		width: 49%;
	}
	#stories_analytics .bottom form .term_wrap{
		flex-wrap: wrap;
	}
	#stories_analytics .bottom form .term_wrap input{
		width: 49%;
	}
	.page-link{
		font-size: 14px !important;
	}

	/*********************************
	  SP02:Admin
	*********************************/
	.wrapper.agents .main_wrapper{
		max-width: 300px;
		width: 100%;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap,
	.wrapper.agents .main_wrapper .inner .under_content_wrap,
	.wrapper.agents .main_wrapper .inner .content_wrap .left table th,
	.wrapper.agents .main_wrapper .inner .content_wrap .left table td{
		display: block !important;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap .left table th,
	.wrapper.agents .main_wrapper .inner .content_wrap .left table td{
		width: 100% !important;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap .left table th{
		background: #888;
		color: #fff;
	}
	.wrapper.agents .main_wrapper .inner .content_wrap .left,
	.wrapper.agents .main_wrapper .inner .content_wrap .right,
	.wrapper.agents .main_wrapper .inner .under_content_wrap .left,
	.wrapper.agents .main_wrapper .inner .under_content_wrap .right{
		margin-bottom: 50px;
	}
	.wrapper.agents .under_content_wrap .change_plan button, 
	.wrapper.agents .under_content_wrap .change_plan .dropdown-menu{
		font-size: 12px !important;
	}
	#agents_user form button.btn_center,
	.wrapper.agents .under_content_wrap .right button,
	.wrapper.agents .under_content_wrap .right button a{
		max-width: 250px;
		width: 100%;
	}
	/* 代理店ユーザー系 */
	#agents_user_list .inner #search .dropdown_wrap{
		display: block !important;
	}
	#agents_user_list .inner #search .dropdown_wrap .custom-select{
	    max-width: 300px;
    	margin-bottom: 15px;
	}
	/* 代理店管理 */
	#agents_info .inner .inner_header{
		display: block !important;
	}
	#agents_info .inner .inner_header .title{
	    margin-bottom: 20px;
	}
	#agents_info .inner .inner_header button,
	#plan_list .inner .inner_header button,
	#create_plan form button.btn_center{
		max-width: 250px;
		width: 100%;
	}
	#agents_info .inner .table_wrap,
	#plan_list .inner .table_wrap,
	#payment_history .inner .table_wrap{
		overflow-x: scroll;
	}
	#agents_info .inner .table_wrap table,
	#plan_list .inner .table_wrap table,
	#payment_history .inner .table_wrap table,
	#payment_history .inner .tb_payment table{
	    max-width: 300px;
	    min-width: 0;
	    width: 100%;
	}
	#payment_history .inner .tb_payment table th,
	#payment_history .inner .tb_payment table td{
		font-size: 12px !important;
		padding: 5px 0;
	}
	#payment_history .inner .tb_payment{
		margin-top: 30px;
	}
	#payment_history .inner .tb_payment table button{
		width: 65px;
		border-radius: 5px;
	}
	#payment_history .content button a{
		padding: 0 5px;
	}
	#plan_list .inner .inner_header{
		display: block;
	}
	#plan_list .inner .inner_header .title{
		margin-bottom: 20px;
	}
	#agents_user form .attachment_wrap{
		display: block !important;
	}
	#agents_user form label{
		margin-bottom: 15px !important;
	}
	#agents_user form .attachment button{
		width: 100% !important;
	}
	#create_agents .content{
		padding: 0 !important;
	}
	#create_agents form .label_wrap,
	#create_agents form .attachment_wrap{
		max-width: 300px;
		width: 100%;
		display: block !important;
	}
	#create_agents form button.btn_center{
		max-width: 300px;
		width: 100%;
	}
	#create_agents form .attachment{
		display: block !important;
	}
	#create_agents form .attachment button{
		margin: 10px 0;
		width: 100%;
	}
	#agents_user_list .inner #search .dropdown_wrap{
		display: block;
	}
	#agents_user_list .inner #search .dropdown_wrap .custom-select{
		margin-bottom: 10px;
	}
	header.agents_header ul{
		display: block;
	}
	.admin_header .inner{
		max-width: 300px;
	}
}

@media screen and (max-width: 768px) {
	#plan .inner {
		width: 90%;
	}
}
/*********************************
		    Global Nav
*********************************/
/*********************************
		    Global Nav
*********************************/