﻿/* ==========================================================================
/* -- 画面の横幅が768pxまで
 ========================================================================== */
@media only screen and (max-width: 812px) {
	html {}
	body {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		word-wrap: break-word;
		-webkit-text-size-adjust: 100%;
		min-width: 100%;
		_display: inline;
		_zoom: 1;
	}
	/*
overflow:scroll; の指定がある場合は word-wrap:normal;　で解除
*/
	/*-------------------------------------------------------------------------------------*/
	#kamishibai_wrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		width: 100%;
		border-bottom: 1px solid #000000;
	}
	/*-----------------------------------------------*/
	.main_title_pc_outwrap {
		display: none;
	}
	.main_title_pc {
		display: none;
	}
	.main_title_sp {
		display: block;
		padding: 1.5vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	.main_title_sp img {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	/*-----------------------------------------------*/
	.rodoku_vote_banner {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 5.0vw auto 5.0vw;
		width: 100%;
	}
	.rodoku_vote_banner p a {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	/*-----------------------------------------------*/
	.coloring_book_title_pc {
		display: none;
	}
	.coloring_book_title_sp {
		display: block;
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	.coloring_book_title_sp img {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	/*-----------------------------------------------*/
	.title_wrap {
		padding: 5.0vw 0px 5.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.title_wrap h3 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		font-size: 4.0vw;
		text-align: left;
		font-weight: bold;
		color: #8b5926;
	}
	.title_wrap hr {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 2.0vw auto 0.0vw;
		height: 7px;
		background-color: #f3e8d8;
		border: none;
		width: 100%;
	}
	.news_wrap {
		padding: 3.0vw 0px 3.0vw 0px;
		margin: 5.0vw auto 5.0vw;
		width: 90%;
		background-color: #f3e8d8;
		border-radius: 10px;
		display: inherit;
		align-content: space-between;
	}
	.news_wrap .newslist00 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.news_wrap .newslist00 p {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 1.0vw;
		font-size: 4.5vw;
		line-height: 1.5em;
		text-align: left;
		color: #000000;
	}
	.news_wrap .newslist01 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.news_wrap .newslist01 p {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 3.0vw;
		font-size: 3.5vw;
		line-height: 1.5em;
		text-align: left;
		color: #000000;
	}
	.news_wrap .newslist01 p a {
		color: #000000;
		text-decoration: underline;
	}
	.news_wrap .newslist01 p a:hover {
		text-decoration: none;
	}
	/*-----------------------------------------------*/
	.stitle_wrap {
		padding: 0.0vw 0px 5.0vw 0px;
		margin: -0.0vw auto 0.0vw;
		width: 90%;
	}
	.stitle_wrap h4 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		font-size: 4.0vw;
		text-align: left;
		font-weight: bold;
		color: #8b5926;
	}
	.stitle_wrap hr {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 2.0vw auto 0.0vw;
		height: 1px;
		background-color: #8b5926;
		border: none;
		width: 100%;
	}
	/*-----------------------------------------------*/
	.kamishibai_menu {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 15.0vw;
		width: 90%;
	}
	.kamishibai_menu img {
		width: 100%;
	}
	.kamishibai_menu .menulist {
		padding: 3.0vw 3.0vw 3.0vw 3.0vw;
		margin: 0.0vw 0px 3.0vw 0px;
		width: 100%;
		float: inherit;
		border: 1px solid #8b5827;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		border-radius: 10px;
		font-size: 3.5vw;
		line-height: 1.5em;
		color: #8b5827;
	}
	.kamishibai_menu .menulist:nth-child(3n) {
		padding: 3.0vw 3.0vw 3.0vw 3.0vw;
		margin: 0.0vw 0px 3.0vw 0px;
		width: 100%;
		float: inherit;
	}
	.kamishibai_menu .menulist a {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		width: 100%;
		display: block;
		color: #8b5827;
	}
	.kamishibai_menu .menulist a:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
	}
	.kamishibai_menu .menulist .title {
		padding: 0.0vw 0px 0.0vw 0.0vw;
		margin: 0.0vw 0px 0.0vw 0px;
		float: left;
		text-align: center;
		width: 100%;
		font-weight: bold;
	}
	
  /*-----------------------------------------------*/
  .mutual_banner02_outwrap {
    padding: 10.0vw 0px 10.0vw 0px;
    margin: 0.0vw 0px 0.0vw 0px;
  }
  .mutual_banner02_inwrap {
    padding: 0.0vw 0px 0.0vw 0px;
    margin: 0.0vw auto 0.0vw;
    width: 90%;
		  display: inherit;
		justify-content: inherit;
}
  .mutual_banner02_inwrap img {
    width: 100%;
  }
  .mutual_banner02_banner01 {
    padding: 0.0vw 0px 5.0vw 0px;
    margin: 0.0vw 0px 0.0vw 0px;
    width: 100%;
  }
  .mutual_banner02_banner02 {
    padding: 0.0vw 0px 0.0vw 0px;
    margin: 0.0vw 0px 0.0vw 0px;
    width: 100%;
  }
  .mutual_banner02_banner03 {
    padding: 0.0vw 0px 0.0vw 0px;
    margin: 0.0vw 0px 0.0vw 0px;
    width: 48%;
  }
	
	/*-----------------------------------------------*/
	.mutual_banner_outwrap {
		padding: 10.0vw 0px 10.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.mutual_banner_inwrap01 {
		padding: 0.0vw 0px 8.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.mutual_banner_inwrap01 img {
		width: 100%;
	}
	.mutual_banner_inwrap02 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.mutual_banner_inwrap02 img {
		width: 100%;
	}
	.mutual_banner_banner01 {
		padding: 0.0vw 0px 5.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		float: inherit;
		width: 100%;
	}
	.mutual_banner_banner02 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		float: inherit;
		width: 100%;
	}
	/*-----------------------------------------------*/
	.fnscollabo_outwrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
		background-image: none;
	}
	.fnscollabo_inwrap00 {
		padding: 8.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 5.0vw 0px;
		width: 100%;
		float: inherit;
		border-left: none;
		border-top: 7px solid #f3e8d8;
	}
	.fnscollabo_inwrap00:nth-child(2n) {
		padding: 8.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 8.0vw 0px;
		width: 100%;
		float: inherit;
		border-left: none;
		border-top: 7px solid #f3e8d8;
	}
	.fnscollabo_inwrap00:first-child {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 8.0vw 0px;
		border-left: none;
		border-top: none;
	}
	.fnscollabo_inwrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		width: 100%;
		float: inherit;
	}
	.fnscollabo_inwrap00:nth-child(2n) .fnscollabo_inwrap {
		float: inherit;
	}
	.fnscollabo_inwrap img {
		width: 100%;
	}
	.fnscollabo_newicon {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	.fnscollabo_newicon p {
		padding: 1.5vw 0px 1.5vw 0px;
		margin: 0.0vw 1px 0.0vw 0px;
		background-color: #d9122e;
		width: 20%;
		text-align: center;
		color: #FFFFFF;
		font-size: 4.0vw;
		font-weight: bold;
		float: right;
	}
	.fnscollabo_newicon_not {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		height: 0;
	}
	.fnscollabo_titleswrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	.fnscollabo_titleleft {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		float: left;
		width: 42%;
		position: relative;
		height: 28.0vw;
	}
	.fnscollabo_titleleft hr {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		height: 7px;
		background-color: #f3e8d8;
		border: none;
		width: 100%;
	}
	.fnscollabo_titleleft h5 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 1.5vw 0px 0.0vw 0px;
		text-align: left;
		color: #d9152d;
		font-size: 3.75vw;
		font-weight: bold;
	}
	.fnscollabo_titleleft .corplogo {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		border: 2px solid #f3e8d8;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		position: absolute;
		bottom: 0;
	}
	.fnscollabo_titleleft a:hover .corplogo {
		-moz-opacity: 0.6;
		-khtml-opacity: 0.6;
		opacity: 0.6;
		zoom: 1;
	}
	.fnscollabo_titleright {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		float: right;
		width: 55%;
		position: relative;
		height: 28.0vw;
	}
	.fnscollabo_titleright .kamishibai_illust {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		border: 2px solid #f3e8d8;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		position: absolute;
		bottom: 0;
	}
	.fnscollabo_titleright a:hover .kamishibai_illust {
		-moz-opacity: 0.6;
		-khtml-opacity: 0.6;
		opacity: 0.6;
		zoom: 1;
	}
	.fnscollabo_announcerwrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 3.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	/*-----------------------------------------------------------------------*/
	.fnscollabo_announcerlistwrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 3.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	.fnscollabo_announcerlistwrap100 {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 3.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	/*-----------------------------------------------------------------------*/
	.fnscollabo_announcerlistwrap p {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 1.0vw 0px;
	}
	.fnscollabo_announcerlistwrap ul {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
		width: 100%;
	}
	.fnscollabo_announcerlistwrap ul li {
		padding: 0.0vw 0.0vw 0.0vw 0.0vw;
		margin: 0.0vw 0.2vw 0.0vw 0.2vw;
		width: 13.5vw;
	}
	.fnscollabo_announcerlistwrap ul li a:hover {
		-moz-opacity: 0.6;
		-khtml-opacity: 0.6;
		opacity: 0.6;
		zoom: 1;
	}
	.fnscollabo_announcerlistwrap ul.seclist {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 2.0vw 0px 0.0vw 0px;
	}
	/*-----------------------------------------------------------------------*/
	.fnscollabo_announcerlistwrap100 p {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 1.0vw 0px;
	}
	.fnscollabo_announcerlistwrap100 ul {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
		width: 100%;
	}
	.fnscollabo_announcerlistwrap100 ul li {
		padding: 0.0vw 0.0vw 0.0vw 0.0vw;
		margin: 0.0vw 0.2vw 0.0vw 0.2vw;
		width: 13.5vw;
	}
	.fnscollabo_announcerlistwrap100 ul li a:hover {
		-moz-opacity: 0.6;
		-khtml-opacity: 0.6;
		opacity: 0.6;
		zoom: 1;
	}
	.fnscollabo_announcerlistwrap100 ul.seclist {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 2.0vw 0px 0.0vw 0px;
	}
		/*-----------------------------------------------------------------------*/
	.fnscollabo_scriptwrap a {
		padding: 2.0vw 0px 2.0vw 0px;
		margin: 3.0vw 0px 0.0vw 0px;
		width: 100%;
				font-size: 3.0vw;

	}
	
	/*-----------------------------------------------------------------------*/
	.fnscollabo_mesgwrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 3.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	.fnscollabo_mesgwrap .fnscollabo_reader {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 3.0vw 0px 0.0vw 0px;
		font-size: 3.0vw;
		line-height: 1.5em;
	}
	.fnscollabo_mesgwrap .fnscollabo_mesg {
		padding: 2.0vw 2.0vw 2.0vw 2.0vw;
		margin: 2.5vw 0px 0.0vw 0px;
		font-size: 3.0vw;
		line-height: 1.5em;
		color: #8b5926;
		border: 2px solid #f3e8d8;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		border-radius: 8px;
	}
	/*-----------------------------------------------*/
	.movie_yb01 {
		padding: 5.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.movie_wrap {
		position: relative;
		padding-bottom: 51.00%;
		padding-top: 30px;
		height: 0;
		overflow: hidden;
	}
	.movie_wrap iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	/*-----------------------------------------------*/
	.chapter_wrap {
		padding: 2.0vw 0px 20.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	/*--------------------------------------*/
	.chapters {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 3.0vw 0px;
		width: 48%;
		float: left;
	}
	.chapters:nth-child(3n) {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 3.0vw 0px;
	}
	.chapters:nth-child(2n) {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 3.0vw 0px;
		float: right;
	}
	.chapters a:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
	}
	.chapters p {
		padding: 2.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		font-size: 2.2vw;
		line-height: 1.5em;
		color: #8b5926;
	}
	/*--------------------------------------*/
	.chapter_btm p a {
		padding: 5.0vw 0px 5.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		display: block;
		width: 100%;
		background-color: #8b5827;
		border-radius: 10px;
		text-decoration: none;
		text-align: center;
		color: #FFFFFF;
		font-weight: bold;
		font-size: 3.5vw;
	}
	.chapter_btm p a:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
	}
	/*-----------------------------------------------*/
	.splt_wrap {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.splt_wrap hr {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		height: 1px;
		background-color: #8b5827;
		border: none;
	}
	/*-------------------------------------------------------------------------------------*/
	.coloring_book_mainwrap {
		padding: 10.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	.coloring_book_main {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 90%;
	}
	.coloring_book_main img {
		width: 100%;
	}
	.coloring_book_list {
		padding: 0.0vw 0px 15.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		float: inherit;
		width: 100%;
	}
	.coloring_book_list:nth-child(2n) {
		padding: 0.0vw 0px 15.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		float: inherit;
		width: 100%;
	}
	.coloring_book_list .illust {
		padding: 0.0vw 0px 3.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	.coloring_book_list .illust img {
		width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		border: 4px solid #8b5827;
	}
	.coloring_book_list h4 {
		padding: 0.0vw 0px 3.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		color: #8b5827;
		text-align: center;
		font-size: 5.0vw;
		font-weight: bold;
	}
	.coloring_book_list .btm a {
		padding: 3.0vw 0px 3.0vw 0px;
		margin: 0.0vw auto 5.0vw;
		display: block;
		width: 90%;
		background-color: #8b5827;
		border-radius: 10px;
		text-decoration: none;
		text-align: center;
		color: #FFFFFF;
		font-weight: bold;
		font-size: 4.0vw;
	}
	.coloring_book_list .btm a:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
	}
	/*--------------------------------------*/
	.coloring_book_hisback {
		padding: 3.0vw 0px 3.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
	}
	.coloring_book_hisback p a {
		padding: 3.0vw 0px 3.0vw 0px;
		margin: 0.0vw auto 10.0vw;
		display: block;
		width: 90%;
		background-color: #FFFFFF;
		border: 1px solid #8b5827;
		border-radius: 10px;
		text-decoration: none;
		text-align: center;
		color: #8b5827;
		font-weight: bold;
		font-size: 3.5vw;
	}
	.coloring_book_hisback p a:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
	}
	/*-------------------------------------------------------------------------------------*/
	aside {
		padding: 0.0vw 0.0vw 0.0vw 0.0vw;
		margin: 0.0vw 0.0vw 0.0vw 0.0vw;
		width: 100%;
	}
	.aside {
		padding: 0.0vw 0.0vw 0.0vw 0.0vw;
		margin: 10.0vw auto 10.0vw;
		width: 80%;
	}
	.aside img {
		width: 100%;
	}
	.aside a:hover {
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
	}
	.aside p a {
		padding: 5.0vw 0.0vw 5.0vw 0.0vw;
		margin: 0.0vw auto 0.0vw;
		width: 100%;
		display: block;
		background-color: #4E453B;
		border-radius: 50.0vw;
		text-align: center;
		color: #FFFFFF;
		font-size: 3.7vw;
		letter-spacing: 0.05em;
	}
	/*-------------------------------------------------------------------------------------*/
	#hoge {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw 0px 0.0vw 0px;
		width: 100%;
	}
	/*-----------------------------------------------*/
	.hoge {
		padding: 0.0vw 0px 0.0vw 0px;
		margin: 0.0vw auto 0.0vw;
		width: 100%;
	}
	.hoge img {
		width: 100%;
	}
	/*-----------------------------------------------------------------------------*/
	.disp01 {
		display: inline-block;
	}
	.disp02 {
		display: none;
	}
	/*-----------------------------------------------------------------------------*/
	br.br01 {
		display: block;
	}
	br.br02 {
		display: none;
	}
}