@charset "utf-8";

/********* HTML再定義 ***********************************************/

html {
	-ms-text-size-adjust: 100%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 62.5%;
	background-color: #FFF;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}


body {
	padding: 0;
	margin: 0 auto;
	font-size: 1.8rem;
	font-size: 18px;
	line-height: 160%;
	letter-spacing: 0px;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	width: 100%;
	min-height: 100%;
}
@media only screen and (max-width: 768px) {
body {
	font-size: 1.4rem;
	font-size: 14px;
	line-height: 150%;
}
}

h2, h3, h4, h5, h6 {
	font-size: 120%;
	margin: 0;
	padding: 0;
	margin-bottom: 20px;
	line-height: 120%;
	font-weight: normal;
}


p {
	margin: 0;
	padding: 0;
	margin-bottom: 15px;
}

a:link, a:visited {
	color: #642;
	text-decoration: none;
}

a:hover {
	text-decoration: underline
}


/********* 全体 *****************************************************/
#footerMenu {
	display: block;
	text-align: center;
	background-color: rgba(255,255,255,0.9);
	width: 100%;
	height: 0px;
	position: fixed;
	z-index: 300;
	bottom: 0;
	overflow: none;
	left: 0;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
	-webkit-box-shadow: 0px -4px 38px rgba(50, 50, 50, 0.50);
	-moz-box-shadow:    0px -4px 38px rgba(50, 50, 50, 0.50);
	box-shadow:         0px -4px 38px rgba(50, 50, 50, 0.50);
}

#footerMenu.show {
	height: 70px;
	padding: 0;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
}

table.footerMenu {
	margin: 0;
	padding: 0;
	table-layout: fixed;
	width: 100%;
}
table.footerMenu td {
	margin: 0;
	padding: 0;
	border: 2px solid #FFF;
}

table.footerMenu td a {
	display: block;
	padding: 20px 2px;
	text-align: center;
	background-color: #900;
	color: #FFF;
	text-decoration: none;
	font-size: 120%;
}


table.footerMenu td a:hover {
	background-color: #C00;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.icon_pdf_txt {
	background-image: url(../images/icon_pdf_txt.png);
	padding-left: 35px;
	background-repeat: no-repeat;
	background-size: 30px;
	background-position: left center;
}

@media only screen and (max-width: 768px) {
table.footerMenu td a {
	font-size: 100%;
}
.icon_pdf_txt {
	padding-left: 25px;
	background-size: 20px;
}
}


#fixedTop {
    right: 10px;
    bottom: 70px;
    width: 150px;
    height: 160px;
	background-image: url(../images/page_top01_off.png);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
    display: none;
    position: fixed;
    z-index: 200;
}
#fixedTop:hover {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
	background-image: url(../images/page_top01_on.png);
}

@media only screen and (max-width: 768px) {
#fixedTop {
    right: 0px;
    width: 120px;
    height: 128px;
}
}

#container100 {
	display: block;
	margin: 0 auto;
}
#container100.mb50 {
	margin-bottom: 50px;
}
#container {
	display: block;
	max-width: 1000px;
	margin: 0 auto;
}
@media only screen and (max-width: 768px) {	


#container {
	max-width: inherit;
}
#container100 #container {
	padding: 0 10px;
	max-width: inherit;
}
#container100.mb50 {
	margin-bottom: 30px;
}

}

#title {
	display: block;
	margin: 0 auto;
}
.title {
	display: block;
	margin: 0 auto;
	max-width: 1000px;
}


/********* 内容 *****************************************************/

#content {
	display: block;
	margin-bottom: 50px;
}
.content {
	display: block;
	padding: 0 20px;
}
@media only screen and (max-width: 768px) {
#content {
	padding: 0 10px;
	margin-bottom: 30px;
}
.content {
	padding: 0 15px;
}
}

/********* ヘッダー *************************************************/
#header {
	position: fixed;
	z-index: 100;
	width: 100%;
	clear: both;
	margin: 0 auto;
	background-color: rgba(255,255,255,0.95);
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.header {
	display: block;
	margin: 0 auto;
	position: relative;
	max-width: 1000px;
	padding: 15px 0;
}
#header h1 {
	display: inline-block;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	line-height: 100%;
}
#header h1 img {
	display: block;
	margin: 0;
	width: 200px;
}
#header h1 a {
	display: block;
}
#header h1 a:hover {
	text-decoration: none;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	background-color: rgba(255,255,255,0.8);
}
.head_top_wrap {
	background-color: #000;
	color: #FFF;
	font-size: 68%;
}
.head_top {
	position: relative;
	margin: 0 auto;
	max-width: 1000px;
	padding-top: 3px;
}

.head_top p {
	margin: 0;
}

.bt_top {
	position: absolute;
	top: 0;
	right: 10px;
	display: inline-block;
	margin-right: 20px;
	font-size: 100%;
	line-height: 130%;
	text-align: center;
}
.bt_top a {
	display: block;
	background-color: #FFF;
	color: #000;
	padding: 10px 15px;
	text-decoration: none;
}
.bt_top a:before {
	content: "▶ ";
	color: #F60;
	font-size: 90%;
}
.bt_top a:hover {
	text-decoration: none;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	color: #FFF;
	background-color: rgba(210,210,210,0.6);
}

.bt_top_sp {
	display: none;
}
@media only screen and (max-width: 768px) {

.header {
	width: auto;
	padding: 5px;
}
#header h1 {
	display: block;
	margin: 0;
	
}
#header h1 img {
	width: 120px;
}
.head_top_wrap {
	display: none;
}
.bt_top_sp {
	display: block;
	position: absolute;
	top: 5px;
	right: 5px;
	line-height: 130%;
	text-align: center;
	font-size: 80%;
}
.bt_top_sp a {
	display: block;
	background-color: #000;
	color: #FFF;
	padding: 7px 5px;
	text-decoration: none;
}
.bt_top_sp a:before {
	content: "▶ ";
	color: #F60;
	font-size: 90%;
}
.bt_top_sp a:hover {
	text-decoration: none;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	background-color: rgba(0,0,0,0.6);
}

}

/********* メイン *************************************************/

.main {
	position: relative;
	z-index: 3;
	display: block;
	max-width: 1000px;
	margin: 0 auto;
}


 /* 980px以上用（PC用）の記述 */
@media screen and (min-width: 980px){

.btn a{
	display: block;
    width: 50%;
    margin: 50px auto 50px auto;
    max-width: 240px;
    text-align: center;
    font-size: 15px;
	font-weight: bold;
    padding: 10px;
    cursor: pointer;
    transition: .3s;
	color:;
	background-color:#FFEA22 ;
}
.btnbox{
	text-align:center;
}
.topimg{
	margin: 120px 0 0 0;
}
.sub_box{
	margin: 20px auto;
	width: 80%;
	background-color: #ffffff;
	text-align: center;
	padding: 20px;
}
.sub_title_big{	
	font-size: 40px;
	font-weight: bold;
	}
.sub_title{	
	font-size: 33px;
	font-weight: bold;
	margin: 20px auto;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: center;
	}
.sub_txt{
	margin: 24px auto;
	font-size: 18px;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: center;
}
.sub_txt_s{
	margin: 24px auto;
	font-size: 15px;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: center;
}
.sub_border{
	border: 3px solid #FFEA22;
	margin:20px auto 0px auto; 
	width:30%;
	text-align: center;
}

.conttitle{
	font-size:18px;
	padding:0 20px;
	margin-right: auto;
	margin-left : auto;
	line-height: 1.3;
    letter-spacing: 0.12em;
	text-align: left;
}
.conttxt{
	margin-right: auto;
	margin-left : auto;
	width: 90%;
	padding: 10px 20px;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: left;
}

/*書影部分*/	

.item_imageBlock {
	position: relative;
    width: 90%;
	margin: 0 0 0 auto;
    text-align: right;
}	

.item_cont{
    position: absolute;
    top:40%;
    left: 5%;
    font-size: 36px;
}
	
	
.item_box{	
	text-align: center;
	background-color: #ffffff;
	color: #070000;　　/*書影の枠カラー変更*/
	margin: 30px 0;
}
.item_box_txt{
	margin-right: auto;
	margin-left : auto;
	line-height: 1.3;
    letter-spacing: 0.12em;
	text-align: center;
	font-size:12px;
	margin-bottom: 20px;
}
.item_box_title{
	text-align: center;
	font-size:15px;
	margin-right: auto;
	margin-left : auto;
	margin-top:20px;
	margin-bottom: 20px;
	line-height: 1.3;
    letter-spacing: 0.12em;
	text-align: center;
}

.item_box_img{
	display: inline-block;
	vertical-align: top;
	width: 35%;
	margin: 20px;
	padding: 20px;
	background-color: #ffffff;
	border: 2rem solid #070000;
}

.item_box_btnbox{
	text-align:center;
}

.pcpre { display: block !important; }
.sppre { display: none !important; }

}

	
	
/*  979px以下用（タブレット／スマートフォン用）の記述 */
@media screen and  (max-width: 979px) {
	
.topimg{
	margin: 60px 0 0 0;
}	

.btn a{
	display: block;
    width: 70%;
    margin: 20px auto 50px auto;
    max-width: 240px;
    text-align: center;
    font-size: 15px;
	font-weight: bold;
    padding: 10px;
    cursor: pointer;
    transition: .3s;
	color:;
	background-color:#FFEA22 ;
}

.btnbox{
	text-align:center;
}	
	
.main_box{
	margin-top: 60px;
	}
.sub_box{
	margin: 20px auto;
	width: 80%;
	background-color: #ffffff;
	text-align: center;
	padding: 20px;
}
.sub_title{	
	font-size: 25px;
	margin: 20px auto;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: center;
	font-weight: bold;
	}
.sub_title_big{	
	font-size: 33px;
	font-weight: bold;
	}
.sub_txt{
	margin: 24px auto;
	font-size: 18px;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: center;
}
.sub_txt_s{
	margin: 24px auto;
	font-size: 13px;
	line-height: 1.5;
    letter-spacing: 0.12em;
	text-align: center;
}
.sub_border{
	border: 3px solid #FFEA22;
	margin:20px auto 0px auto; 
	width:30%;
	text-align: center;
}

.conttxt{
	margin-right: auto;
	margin-left : auto;
	line-height: 1.3;
    letter-spacing: 0.12em;
	text-align: left;
	padding: 5px;
}
.conttitle{
	text-align: center;
	font-size:16px;
	margin-right: auto;
	margin-left : auto;
	line-height: 1.3;
    letter-spacing: 0.12em;
	text-align: left;
}

	
/*書影部分*/	

.item_imageBlock {
	position: relative;
    width: 90%;
	margin: 0 0 0 auto;
    text-align: right;
}	

.item_cont{
    position: absolute;
    top:40%;
    left: 5%;
    font-size: 36px;
}
	
.item_box{	
	text-align: center;
	background-color: #ffffff;
	color: #565656;　
	margin: 30px 0;
}
.item_box_txt{
	margin-right: auto;
	margin-left : auto;
	line-height: 1.3;
	text-align: center;
	font-size:9px;
	margin-bottom: 20px;
}
.item_box_title{
	text-align: center;
	font-size:11px;
	margin-right: auto;
	margin-left : auto;
	margin-top:20px;
	margin-bottom: 20px;
	line-height: 1.3;
	text-align: center;
}

.item_box_img{
	display: inline-block;
	vertical-align: top;
	width: 42%;
	margin: 0 5px;
	padding: 10px;
	background-color: #ffffff;
	border: 1rem solid #070000;/*書影の枠カラー変更*/
}

.item_box_btnbox{
	text-align:center;
}
	
.pcpre { display: none !important; }
.sppre { display: block !important; }

}



/********* フッター *************************************************/
#footer {
	clear: both;
	display: block;
	margin: 0 auto;
	text-align: center;
	background-color: #555;
}

.footer {
	display: block;
	max-width: 1000px;
	margin: 0 auto;
	padding: 50px 0;
}

.bt_foot {
	display: inline-block;
	line-height: 130%;
	font-family: "Noto Sans Japanese";
	font-weight: 700;
}
.bt_foot a {
	display: block;
	color: #FFF;
	padding: 15px 50px;
	text-decoration: none;
	border: double 3px #FFF;
	text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
	background-color: #555;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#555), to(#111));
	background-image: -webkit-linear-gradient(top, #555, #111);
	background-image: -moz-linear-gradient(top, #555, #111);
	background-image: -ms-linear-gradient(top, #555, #111);
	background-image: -o-linear-gradient(top, #555, #111);
	background-image: linear-gradient(to bottom, #555, #111);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#555, endColorstr=#111);
}
.bt_foot a:hover {
	background-image: -webkit-gradient(linear, left top, left bottom, from(#333), to(#555));
	background-image: -webkit-linear-gradient(top, #333, #555);
	background-image: -moz-linear-gradient(top, #333, #555);
	background-image: -ms-linear-gradient(top, #333, #555);
	background-image: -o-linear-gradient(top, #333, #555);
	background-image: linear-gradient(to bottom, #333, #555);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#333, endColorstr=#555);
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    transition: all 0.7s;
}

#footer address {
	font-style: normal;
	font-size: 80%;
	line-height: 130%;
	text-align: center;
	background-color: #000;
	padding: 30px 0;
	padding-bottom: 100px;
	color: #999;
}

@media only screen and (max-width: 768px) {

.footer {
	width: auto;
	padding: 30px 0;
}
.bt_foot a {
	padding: 5px 30px;
}
#footer address {
	font-size: 90%;
}
}

/********* 日本マンガ塾のことを知りたい！ ***************************************/


.bg002 {
border-top: 10px solid #000;
border-bottom: 10px solid #000;
	padding: 50px 0;
  background: #333;
  background-image: radial-gradient(#222 20%, transparent 0), radial-gradient(#222 20%, transparent 0);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px, 20px 20px;
  background-repeat: repeat, repeat;
}

@media only screen and (max-width: 768px) {
.bg002 {
text-align: center;
	padding-top: 30px;
	padding-bottom: 10px;
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px, 20px 20px;
}
}


h3.title_shiritai {
	font-family: "Noto Sans Japanese";
	font-weight: 700;
	font-size: 240%;
	color: #000;
	text-align: center;
	margin-bottom: 50px;
	text-shadow: 
       3px  3px 0px #FFF,
      -3px  3px 0px #FFF,
       3px -3px 0px #FFF,
      -3px -3px 0px #FFF,
       3px  0px 0px #FFF,
       0px  3px 0px #FFF,
      -3px  0px 0px #FFF,
       0px -3px 0px #FFF;
}

@media only screen and (max-width: 768px) {
h3.title_shiritai {
	font-size: 5vw;
	margin-bottom: 20px;
	text-shadow: 
       2px  2px 0px #FFF,
      -2px  2px 0px #FFF,
       2px -2px 0px #FFF,
      -2px -2px 0px #FFF,
       2px  0px 0px #FFF,
       0px  2px 0px #FFF,
      -2px  0px 0px #FFF,
       0px -2px 0px #FFF;
}
}

/********* 煽り文 日程 ***************************************/

.bg_aori {
	padding: 0;
	background-image: url(../images/bg_aori.jpg);
	background-size: cover;
	background-position: left bottom;
}
.bg_aori #container {
	padding: 50px 50px;
}


@media only screen and (max-width: 768px) {
.bg_aori {
margin: 0 0;
	padding: 0;
}
#container100.bg_aori #container {
	padding: 20px 15px;
}
}


.nittei {
position: relative;
display: block;
margin: 1em auto;
padding: 0.5em 1em;
padding-right: 25%;
background-color: rgba(255,255,255,0.8);
font-family: Arial, Helvetica, "sans-serif";
text-align: left;
font-size: 200%;
font-weight: 900;
line-height: 130%;
border: 5px solid #900;
}

.nittei:after {
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  font-weight: 400;
  content: '\f073\ 日程';
  background: #900;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 5px 7px 3px;
  font-size: 0.5em;
  line-height: 1;
  letter-spacing: 0.05em;
}

.fukidashi_muryou {
position: absolute;
right: -10px;
bottom: -10%;
width: 35%;
}
@media only screen and (max-width: 1000px) {
.nittei {
font-size: 160%;
}
.nittei .sp_only {
display: block;
}
.fukidashi_muryou {
width: 30%;
}
}
@media only screen and (max-width: 768px) {
.nittei {
margin-top: 1em;
padding-right: 1em;
}
.nittei:after {
  padding: 5px 7px 3px;
  font-size: 0.5em;
  line-height: 1;
  letter-spacing: 0.05em;
}
.fukidashi_muryou {
position: absolute;
width: 35%;
}
}



.nittei02 {
position: relative;
display: block;
margin: 1em auto;
padding: 0.5em 1em;
padding-bottom: 0.2em;
background-color: rgba(255,255,255,0.8);
font-family: Arial, Helvetica, "sans-serif";
text-align: center;
font-size: 200%;
font-weight: 900;
line-height: 130%;
border: 5px solid #900;
}

.nittei02:after {
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  font-weight: 400;
  content: '\f073\ 日程';
  background: #900;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 5px 7px 3px;
  font-size: 0.5em;
  line-height: 1;
  letter-spacing: 0.05em;
}
p.txt_zoomyotei {
font-size: 50%;
font-weight: 400;
margin-bottom: 0;
}
p.txt_zoombtn {
font-size: 60%;
font-weight: 500;
line-height: 150%;
margin-bottom: 15px;
}
@media only screen and (max-width: 1000px) {
.nittei02 {
font-size: 160%;
}
.nittei02 .sp_only {
display: block;
}
}
@media only screen and (max-width: 768px) {
.nittei02 {
margin-top: 1em;
text-align: left;
}
.nittei02:after {
  padding: 5px 7px 3px;
  font-size: 0.5em;
  line-height: 1;
  letter-spacing: 0.05em;
}
}



.imageright_cara001 {
float: right;
max-width: 35%;
margin-left: 1em;
}
.aori_wrap {
display: flex;
align-items: center;
}
.aori_wrap_left {
vertical-align: middle;
}
.aori_wrap_left p {
margin-bottom: 0;
line-height: 200%;
font-size: 120%;
font-weight: 600;
}

.aori_wrap_right {
float: right;
max-width: 40%;
margin-left: 2em;
}
@media only screen and (max-width: 1000px) {
.aori_wrap_left p {
line-height: 180%;
font-size: 100%;
}

}
@media only screen and (max-width: 768px) {
.aori_wrap {
display: block;
}
.aori_wrap_left {
display: block;
}
.aori_wrap_left p {
line-height: 160%;
font-size: 100%;
}
.aori_wrap_left .imagecenter {
max-width: 60%;
}
.aori_wrap_right {
display: none;
}
}

.bt_nittei {
	padding: 0;
	display: block;
	list-style: none;
	margin: 0.5em auto;
	text-align: center;
}
.bt_nittei a {
	display: block;
	list-style: none;
	padding: 1.2em 1em;
	color: #FFF;
	font-size: 200%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
	box-shadow: -2px -2px 5px rgba(0,0,0,0.5);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: 3px double #FFF;
	background-color: #900;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#900), to(#300));
	background-image: -webkit-linear-gradient(top, #900, #300);
	background-image: -moz-linear-gradient(top, #900, #300);
	background-image: -ms-linear-gradient(top, #900, #300);
	background-image: -o-linear-gradient(top, #900, #300);
	background-image: linear-gradient(to bottom, #900, #300);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#900, endColorstr=#300);
}


.bt_nittei a:hover {
	text-decoration: none;
	background-color: #300;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#300), to(#900));
	background-image: -webkit-linear-gradient(top, #300, #900);
	background-image: -moz-linear-gradient(top, #300, #900);
	background-image: -ms-linear-gradient(top, #300, #900);
	background-image: -o-linear-gradient(top, #300, #900);
	background-image: linear-gradient(to bottom, #300, #900);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#300, endColorstr=#900);
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    transition: all 0.7s;
}

.bt_nittei02 {
	padding: 0;
	display: block;
	list-style: none;
	margin: 0.5em auto;
	text-align: center;
}
.bt_nittei02 a {
	display: block;
	list-style: none;
	padding: 0.8em 1em;
	color: #FFF;
	font-size: 200%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
	box-shadow: -2px -2px 5px rgba(0,0,0,0.5);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: 3px double #FFF;
	background-color: #900;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#900), to(#300));
	background-image: -webkit-linear-gradient(top, #900, #300);
	background-image: -moz-linear-gradient(top, #900, #300);
	background-image: -ms-linear-gradient(top, #900, #300);
	background-image: -o-linear-gradient(top, #900, #300);
	background-image: linear-gradient(to bottom, #900, #300);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#900, endColorstr=#300);
}


.bt_nittei02 a:hover {
	text-decoration: none;
	background-color: #300;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#300), to(#900));
	background-image: -webkit-linear-gradient(top, #300, #900);
	background-image: -moz-linear-gradient(top, #300, #900);
	background-image: -ms-linear-gradient(top, #300, #900);
	background-image: -o-linear-gradient(top, #300, #900);
	background-image: linear-gradient(to bottom, #300, #900);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#300, endColorstr=#900);
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    transition: all 0.7s;
}

.bt_nittei03 {
	padding: 0;
	display: block;
	list-style: none;
	margin: 0.5em auto;
	text-align: center;
}
.bt_nittei03 a {
	display: block;
	list-style: none;
	padding: 0.8em 1em;
	color: #FFF;
	font-size: 160%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
	box-shadow: -2px -2px 5px rgba(0,0,0,0.5);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: 3px double #FFF;
	background-color: #6f2707;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#6f2707), to(#300));
	background-image: -webkit-linear-gradient(top, #6f2707, #300);
	background-image: -moz-linear-gradient(top, #6f2707, #300);
	background-image: -ms-linear-gradient(top, #6f2707, #300);
	background-image: -o-linear-gradient(top, #6f2707, #300);
	background-image: linear-gradient(to bottom, #6f2707, #300);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#6f2707, endColorstr=#300);
}


.bt_nittei03 a:hover {
	text-decoration: none;
	background-color: #300;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#300), to(#6f2707));
	background-image: -webkit-linear-gradient(top, #300, #6f2707);
	background-image: -moz-linear-gradient(top, #300, #6f2707);
	background-image: -ms-linear-gradient(top, #300, #6f2707);
	background-image: -o-linear-gradient(top, #300, #6f2707);
	background-image: linear-gradient(to bottom, #300, #6f2707);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#300, endColorstr=#6f2707);
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    transition: all 0.7s;
}

@media only screen and (max-width: 768px) {
.bt_nittei {
	display: block;
	margin: 0.5em 0;
}
.bt_nittei a {
	padding: 1.2em 0;
	font-size: 5vw;
}
.bt_nittei02 {
	display: block;
	margin: 0.5em 0;
}
.bt_nittei02 a {
	padding: 0.8em 0;
	padding-top: 0.6em;
	font-size: 5vw;
}	
.bt_nittei03 {
	display: block;
	margin: 0.5em 0;
}
.bt_nittei03 a {
	padding: 0.8em 0;
	font-size: 4vw;	
}
}


@media only screen and (max-width: 768px) {
.bt_nittei {
	display: block;
	margin: 0.5em 0;
}
.bt_nittei a {
	padding: 1.2em 0;
	font-size: 5vw;
}

}

/********* インタビュー ***************************************/

.bg_interview {
	padding: 0;
	background-image: url(../images/bg_interview.jpg);
	background-size: cover;
	background-position: center top;
}
.bg_interview #container {
	padding: 50px 50px;
}


@media only screen and (max-width: 768px) {
.bg_interview {
margin: 0 0;
	padding: 0;
}
#container100.bg_interview #container {
	padding: 20px 15px;
}
}





.comment_waku  {
	font-size: 100%;
	line-height: 150%;
	 color: #000;
	position: relative;
	padding: 1em 2em;
	background-color: rgba(255,255,255,0.9);
	border: 5px solid #900;
	border-radius: 5px;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

/* beforeで枠線の三角を表現 */
.comment_waku::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 15px;
  top: -25px;
  border-right: 25px solid transparent;
  border-bottom: 25px solid #900;
  border-left: 25px solid transparent;
}

/* beforeで本体の三角を表現 */
.comment_waku::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 20px;
  top: -18px;
  border-right: 20px solid transparent;
  border-bottom: 20px solid rgba(255,255,255,1.0);
  border-left: 20px solid transparent;
}

@media only screen and (max-width: 768px) {
.table_interview .imageright  {
float: right;
max-width: 28%;
margin-left: 2%;
}
.comment_waku  {
	padding: 5%;
	border: 3px solid #900;
	border-radius: 5px;
	box-shadow: 0 0 5px rgba(255,0,0,0.5);
}
.table_interview .imageright.dramasp  {
max-width: 45%;
}

/* beforeで本体の三角を表現 */
.comment_waku::after{
  top: -20px;
  left: 17px;
  border-right: 23px solid transparent;
  border-bottom: 23px solid rgba(255,255,255,1.0);
  border-left: 23px solid transparent;
}

}

h5.interview {
	position: relative;
	font-weight: 600;
	margin-bottom: 25px;
	background-color: rgba(255,255,255,0.9);
  background-image:
    repeating-linear-gradient(to bottom,
      transparent 25px,
      rgba(0, 0, 0, 0.04) 26px,  rgba(0, 0, 0, 0.04) 26px,
      transparent 27px,  transparent 51px, 
      rgba(0, 0, 0, 0.04) 52px,  rgba(0, 0, 0, 0.04) 52px,
      transparent 53px,  transparent 77px, 
      rgba(0, 0, 0, 0.04) 78px,  rgba(0, 0, 0, 0.04) 78px,
      transparent 79px,  transparent 103px, 
      rgba(0, 0, 0, 0.04) 104px,  rgba(0, 0, 0, 0.04) 104px,
      transparent 105px,  transparent 129px, 
      rgba(0, 0, 0, 0.04) 130px,  rgba(0, 0, 0, 0.04) 130px),

    repeating-linear-gradient(to right,
      transparent 25px,
      rgba(0, 0, 0, 0.04) 26px,  rgba(0, 0, 0, 0.04) 26px,
      transparent 27px,  transparent 51px, 
      rgba(0, 0, 0, 0.04) 52px,  rgba(0, 0, 0, 0.04) 52px,
      transparent 53px,  transparent 77px, 
      rgba(0, 0, 0, 0.04) 78px,  rgba(0, 0, 0, 0.04) 78px,
      transparent 79px,  transparent 103px, 
      rgba(0, 0, 0, 0.04) 104px,  rgba(0, 0, 0, 0.04) 104px,
      transparent 105px,  transparent 129px, 
      rgba(0, 0, 0, 0.04) 130px,  rgba(0, 0, 0, 0.04) 130px);
	padding: 1em 2em;
	padding-left: 3em;
	border: 5px solid #999;
	border-radius: 5px;
}
.interview::before {
position: absolute;
  content: '\f059';
  font-family: "Font Awesome 5 Free";
  margin-left: -1.2em;
 font-weight: 400;
 font-size: 200%;
 color: #900;
}

@media only screen and (max-width: 768px) {
h5.interview {
	padding: 0.5em;
	padding-right: 0.5em;
	padding-left: 1.8em;
	border: 3px solid #999;
}

.interview::before {
  margin-left: -1.2em;
 font-size: 120%;
}
}



ul.list_comment_one01 {
	margin: 0;
	padding: 0;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
ul.list_comment_one01 li  {
	position: relative;
	display: inline-block;
	list-style: none;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	width: 29%;
}
ul.list_comment_one01 li:nth-child(odd)  {
	width: 70%;
	margin-right: 1%;
	padding: 0% 0%;
}

@media only screen and (max-width: 768px) {
ul.list_comment01, ul.list_comment_one01  {
	display: block;
}
ul.list_comment01 li, ul.list_comment_one01 li, ul.list_comment_one01 li:nth-child(odd)  {
	display: block;
	width: auto;
	margin: 0;
	margin-bottom: 15px;
	padding: 15px;
	border: none;

	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

ul.list_comment_one01 li:nth-child(even)  {
	
}


.list_comment01 p  {
	font-size: 100%;
	line-height: 150%;
}

.list_comment_one01 p  {
	font-size: 100%;
	line-height: 150%;
	  padding: 2rem 2rem;
  color: #000;
  border-radius: 10px;
  background: #fff;
	margin-bottom: 25px;
	-webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
}
}

.list_comment01 h4, .list_comment_one01 h4 {
	clear: both;
	font-family: "Noto Sans Japanese";
	text-align: center;
	background-color: #F60;
	color: #FFF;
	padding: 10px;
	margin-bottom: 10px;
	font-weight: 700;
}
.list_comment01 h5, .list_comment_one01 h5 {
	 position: relative;
	font-size: 100%;
	font-weight: 700;
	margin-bottom: 35px;
	line-height: 140%;
	color: #FFF;
}





.list_comment01 h6, .list_comment_one01 h6 {
	font-family: "Noto Sans Japanese";
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 5px;
}
@media only screen and (max-width: 768px) {
.list_comment01 p, .list_comment_one01 p  {
	font-size: 100%;
	line-height: 150%;
}
.list_comment01 h5, .list_comment_one01 h5 {
	font-size: 130%;
}
}


/********* 作品一覧 ***************************************/

.bg_sakuhin {
	padding: 0;
	background-image: url(../images/bg_sakuhin.jpg);
	background-size: cover;
	background-position: center top;
}
.bg_sakuhin #container {
	padding: 50px 50px;
}


@media only screen and (max-width: 768px) {
.bg_sakuhin {
margin: 0 0;
	padding: 0;
}
#container100.bg_sakuhin #container {
	padding: 20px 15px;
}
}



.box_sakuhin {
display: flex;
  align-items: center;
margin: 1em auto;
margin-bottom: 2em;
padding: 1em 1.5em;
background-color: rgba(255,255,255,0.8);
line-height: 130%;
border: 5px solid #C00;
}
.box_sakuhin h4 {
color: #C00;
font-size: 120%;
font-weight: 900;
}

.box_sakuhin_book {
display: block;
margin-right: 2%;
}
.box_sakuhin_txt {
display: block;
max-width: 52%;
text-align: center;
}



ul.list_sakuhin {
	margin: 0;
	padding: 0;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

ul.list_sakuhin li {
	margin: 1em 0;
	padding: 0;
	display: inline-block;
	list-style: none;
	width: 47.5%;
	margin-right: 5%;
border: 5px solid #C00;
background-color: rgba(255,255,255,0.8);
}
ul.list_sakuhin li .inner {
padding: 1em 1.5em;
}
ul.list_sakuhin li:nth-child(even) {
	margin-right: 0;
}


.list_sakuhin h4 {
color: #C00;
font-size: 120%;
font-weight: 900;
}

p.copy_sakuhin {
font-size: 80%;
line-height: 130%;
margin: 0;
}

.img_book {
display: block;
}

.img_book .imagecenter,
.img_book .imagecenter00 {
max-width: 75%;
box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}
@media only screen and (max-width: 768px) {

ul.list_sakuhin li {
	margin: 0.3em 0;
	padding: 0;
	display: inline-block;
	list-style: none;
	width: 49%;
	margin-right: 2%;
}
ul.list_sakuhin li .inner {
padding: 1em 1em;
}
.img_book .imagecenter {
max-width: 80%;
}
p.copy_sakuhin {
font-size: 60%;
}
}




/********* フッター前ボタン ***************************************/
ul.bt_list {
	margin: 0;
	padding: 0;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
	justify-content: center;
}
ul.bt_list li {
	margin: 0;
	padding: 0;
	display: inline-block;
	list-style: none;
	width: 45%;
	margin-right: 5%;
	text-align: center;
}
ul.bt_list li a {
	display: block;
	list-style: none;
	padding: 5% 3%;
	color: #FFF;
	font-size: 150%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
	box-shadow: -2px -2px 5px rgba(0,0,0,0.5);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: 3px double #FFF;
	background-color: #555;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#555), to(#999));
	background-image: -webkit-linear-gradient(top, #555, #999);
	background-image: -moz-linear-gradient(top, #555, #999);
	background-image: -ms-linear-gradient(top, #555, #999);
	background-image: -o-linear-gradient(top, #555, #999);
	background-image: linear-gradient(to bottom, #555, #999);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#555, endColorstr=#999);
}

ul.bt_list li:nth-child(even), ul.bt_list li:last-child {
	margin-right: 0;
}
ul.bt_list li a:hover {
	text-decoration: none;
	background-color: #F70;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#900), to(#300));
	background-image: -webkit-linear-gradient(top, #900, #300);
	background-image: -moz-linear-gradient(top, #900, #300);
	background-image: -ms-linear-gradient(top, #900, #300);
	background-image: -o-linear-gradient(top, #900, #300);
	background-image: linear-gradient(to bottom, #900, #300);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#900, endColorstr=#300);
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    transition: all 0.7s;
}
ul.bt_list li span {
	padding: 5px;
	padding-left: 40px;
	background-repeat: no-repeat;
	background-size: 30px;
	background-position: left center;
}
.icon_pen {
	background-image: url(../images/icon_pen_orange.png);
}
.icon_pdf {
	background-image: url(../images/icon_pdf_orange.png);
}

@media only screen and (max-width: 768px) {
ul.bt_list {
	display: block;
}
ul.bt_list li {
	display: block;
	margin-right: 0;
	margin-bottom: 10px;
	width: auto;
}
ul.bt_list li a {
	padding: 10px;
	color: #FFF;
	font-size: 120%;

}
ul.bt_list li span {
	padding: 5px;
	padding-left: 35px;
	background-size: 30px;
}

}




/********* ボックス ************************************************/

.box_gray {
	clear: both;
	background-color: #EFEFEF;
	padding: 15px 30px;
	margin-bottom: 20px;
}
.box_shadow {
	display: block;
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	padding: 30px;
	margin-bottom: 30px;
}
@media only screen and (max-width: 768px) {

.box_shadow {
	padding: 15px;
	margin-bottom: 30px;
}
}

/********* liststyle ************************************************/

ul.list_kome {
	margin: 0;
	padding: 0;
}
ul.list_kome li {
	margin: 0;
	margin-left: 20px;
	padding: 0;
	list-style: none;
	position: relative;
	line-height: 130%;
	margin-bottom: 10px;
}
ul.list_kome li:before {
	content: "※";
	display: block;
	float: left;
	margin-left: -20px;
	border: none;
}

/********* table ************************************************/

table.table_double {
	table-layout: fixed;
	width: 100%;
}
table.table_double tr, table.table_double th, table.table_double td {
	border: none;
}
table.table_double td:nth-child(odd) {
	padding-right: 3%;
}
table.table_double td:nth-child(even) {
	padding-left: 3%;
}
@media only screen and (max-width: 768px) {
table.table_double td {
	display: block;
	margin-bottom: 15px;
}
table.table_double td:nth-child(odd) {
	padding-right: 0;
}
table.table_double td:nth-child(even) {
	padding-left: 0;
}
}
table.table_triple {
	table-layout: fixed;
	width: 100%;
}
table.table_triple tr, table.table_triple th, table.table_triple td {
	border: none;
}
table.table_triple td {
	padding: 0 3%;
}

@media only screen and (max-width: 768px) {
table.table_triple td {
	display: block;
	padding: 0;
	margin-bottom: 15px;
}
}	

table.table_info {
	table-layout: fixed;
	width: 100%;
}
table.table_info tr, table.table_info th, table.table_info td {
	border: none;
}
table.table_info td {
	vertical-align: top;
}
table.table_info td:nth-child(odd) {
	padding-right: 5%;
	width: 30%;
}
	
	
/********* 画像 ************************************************/


.imageleft {
	float: left;
	margin-right: 40px;
	margin-bottom: 20px;
}

.imageright {
	float: right;
	margin-left: 40px;
	margin-bottom: 20px;
}

.imagecenter {
	display: block;
	max-width: 100%;
	margin: 0 auto;
	margin-bottom: 20px;
}
.imagecenter00 {
	display: block;
	max-width: 100%;
	margin: 0 auto;
}


/********* フレームレスポンシブル ************************************************/

.youtube {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
	margin-bottom: 30px;
}
 
.youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.youtube img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.googlemap {
    position: relative;
    padding-bottom: 60%;
    height: 0;
    overflow: hidden;
	margin-bottom: 20px;
}
 
.googlemap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
@media only screen and (max-width: 768px) {
.googlemap {
    padding-bottom: 50%
}
}


/********* 個別 ************************************************/

.red {
	color: #F00;
}
.blue {
	color: #048;
}
.orange {
	color: #F90;
}
.orange002 {
	color: #ff870f;
	font-weight: 700;
}
.right {
	float: right;
}
.t_center {
	text-align: center;
}
.t_center_pc {
	text-align: center;
}
.bold {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 500;
}

@media only screen and (max-width: 768px) {
.t_center_pc {
	text-align: left;
}
}
.t_left {
	text-align: left;
}
.t_right {
	text-align: right !important;
}
.clear {
	clear: both;
}


.f50 {
	font-size: 50%;
	line-height: 120%;
}
.f60 {
	font-size: 60%;
	line-height: 120%;
}
.f70 {
	font-size: 70%;
	line-height: 120%;
}
.f80 {
	font-size: 80% !important;
	line-height: 120%;
}
.f80_02 {
	font-size: 80%;
	line-height: 60% !important;
}

.f90 {
	font-size: 90%;
	line-height: 120%;
}
.f110 {
	font-size: 110%;
}
.f120 {
	font-size: 120%;
}
.f150 {
	font-size: 150%;
}
.f200 {
	font-size: 200%;
}





.sp_only {
	display: none !important;
}
@media only screen and (max-width: 768px) {
.sp_only {
	display: block !important;
}
.pc_only {
	display: none !important;
}
}





/********* 追加***************************************/

table.table_midashi {
	position: relative;
	table-layout: auto;
	margin: 0 auto;
	padding: 0;
}
table.table_midashi tr {
	display: block;
	margin: 0;
	margin-bottom: -10px;
	padding: 0;
}
table.table_midashi tr:last-child {
	margin-bottom: 0;
}
table.table_midashi th, table.table_midashi td {
	background: none;
	border: none;
	margin: 0;
	padding: 0px 0px;
	padding-right: 0px;
	text-align: left;
	line-height: 130%;
}
table.table_midashi th {
  font-size: 150%;
}
table.table_midashi td {
	font-family: "Noto Sans Japanese";
	font-size: 180%;
	text-align: center;
}
@media only screen and (max-width: 768px) {
table.table_midashi {
	table-layout: fixed;
	width: 100%;
}
table.table_midashi th, table.table_midashi td {
	display: block;
	padding: 10px;
}

table.table_midashi th {
	font-size: 120%;
	padding-bottom: 0;
}
table.table_midashi td {
	text-align: center;
	font-size: 130%;
}
}




ul.list_comment_one  {
	margin: 0;
	margin-bottom: 30px;
	padding: 0;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
ul.list_comment_one li  {
	position: relative;
	display: inline-block;
	list-style: none;
	margin-bottom: 20px;
	vertical-align: middle;
	width: 28%;
}
ul.list_comment_one li:nth-child(odd)  {
	width: 100%;
	margin-right: 0%;
	border: solid 10px #CCC;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	padding: 5% 5%;
}

@media only screen and (max-width: 768px) {
ul.list_comment, ul.list_comment_one  {
	display: block;
}
ul.list_comment li, ul.list_comment_one li, ul.list_comment_one li:nth-child(odd)  {
	display: block;
	width: auto;
	margin: 0;
	margin-top: 5px;
	margin-bottom: 15px;
	padding: 15px;
	border: none;
	border-bottom: solid 5px #CCC;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

ul.list_comment_one li:nth-child(even)  {
	display: none;
}

}

.list_comment p  {
	font-size: 95%;
	line-height: 150%;
}

.list_comment_one01 p  {
	font-size: 100%;
	line-height: 150%;
	 color: #000;
	position: relative;
	padding: 30px;
	background-color: #fff;
	border: 5px solid #900;
	margin-bottom: 60px;
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(255,0,0,0.5);
	
}

/* beforeで枠線の三角を表現 */
.list_comment_one01 p::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 15px;
  top: -25px;
  border-right: 25px solid transparent;
  border-bottom: 25px solid #900;
  border-left: 25px solid transparent;
}

/* beforeで本体の三角を表現 */
.list_comment_one01 p::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 20px;
  top: -18px;
  border-right: 20px solid transparent;
  border-bottom: 20px solid #fff;
  border-left: 20px solid transparent;
}


.list_comment h4, .list_comment_one h4 {
	clear: both;
	font-family: "Noto Sans Japanese";
	text-align: center;
	background-color: #F60;
	color: #FFF;
	padding: 10px;
	margin-bottom: 10px;
	font-weight: 700;
}
.list_comment h5, .list_comment_one h5 {
	font-family: "Noto Sans Japanese";
	font-weight: bold;
	padding-bottom: 10px;
	margin-bottom: 20px;
	border-bottom: 1px dotted #CCC;
	color: #FFF;
}
.list_comment h6, .list_comment_one h6 {
	font-family: "Noto Sans Japanese";
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 5px;
}
@media only screen and (max-width: 768px) {
.list_comment p, .list_comment_one p  {
	font-size: 110%;
	line-height: 150%;
}
.list_comment h5, .list_comment_one h5 {
	font-size: 110%;
}
}



.comment {
	position: relative;
	display: block;
	padding-top: 10px;
}

.comment p  {
	font-size: 95%;
	line-height: 150%;
	margin-bottom: 40px;
}

.bg0003 {
  padding: 50px 0;
  background: #fff6e9;
  background-image: radial-gradient(#feecd2 20%, transparent 0), radial-gradient(#feecd2 20%, transparent 0);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}
.bg0004 {
	padding: 20px 0;
  background: repeating-linear-gradient(-45deg, #333, #333 10px, #444 0, #444 20px);
}
.bg0004 #container {
	background-color: rgba(255,255,255,0.9);
	padding: 20px 20px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
.bg0005 {
	padding: 30px 0;
	padding-bottom: 0;
	background-image: url(../images/back_main.jpg);
}	
@media only screen and (max-width: 768px) {
.bg0003 {
	padding: 20px 0;
}
.bg0004 {
	padding: 20px 0;
}
.bg0005 {
	padding: 20px 0;
	padding-bottom: 0;
}
.bg0004 #container {
	padding: 20px;
	margin:0 15px;
	min-width: 320px !important;
}
.comment p  {
	font-size: 95%;
	line-height: 150%;
	margin-top: 20px;
	margin-bottom: 30px;
}	
	
}	
	



table.table_interview {
position: relative;
table-layout: fixed;
width: 100%;
border: none;
background: none;
margin-bottom: 40px;
}
table.table_interview tr, table.table_interview th, table.table_interview td {
border: none;
background: none;
vertical-align: middle;
}
table.table_interview td:nth-child(odd) {
width: 70%;
}
.table_interview p {
margin-bottom: 0;
}

.table_interview .imagecenter00 {
object-fit: contain;
max-height: 300px;
}
.comic_naname {
transform: rotate(10deg);
}

@media only screen and (max-width: 768px) {
table.table_interview {
margin-bottom: 30px;
}

.table_interview .imagecenter00 {
object-fit: contain;
max-height: inherit;
max-width: 100%;
}

.comic_naname {
transform: rotate(0deg);
}

}





.chumoku {
	position: absolute;
	left: -10px;
	top: -15px;
	width: 100px;
	z-index: 2;
}
	
	
.daininki {
	position: absolute;
	left: 10px;
	top: -50px;
	width: 180px;
	z-index: 2;
}
.hyde {
	position: absolute;
	left: -200px;
	top: -80px;
	width: 210px;
	z-index: 2;
}
.hell {
	position: absolute;
	left: -170px;
	top: 10px;
	width: 230px;
	z-index: 2;
}


.cara {
	position: absolute;
	left: -120px;
	top: -60px;
	width: 180px;
	transform: rotate( 10deg );
	z-index: 2;
	
}
.comic001 {
	position: absolute;
	left: 10px;
	bottom: 1200px;
	width: 200px;
	z-index: 2;
	transform: rotate(10deg);
}
.comic002 {
	position: absolute;
	left: 25px;
	top: 1800px;
	width: 200px;
	z-index: 2;
	transform: rotate(10deg);
}

.comic003 {
	position: absolute;
	left: 25px;
	top: 2200px;
	width: 200px;
	z-index: 2;
		transform: rotate(10deg);
}

.comic004 {
	position: absolute;
	left: 25px;
	bottom: 2850px;
	width: 200px;
	z-index: 2;
		transform: rotate(10deg);
}

.comic005 {
	position: absolute;
	left: 25px;
	bottom: 1900px;
	width: 200px;
	z-index: 2;
		transform: rotate(10deg);
}

@media only screen and (max-width: 768px) {
.daininki {
	position: absolute;
	left: 10px;
	top: -60px;
	width: 100px;
	z-index: 2;
}
.hyde {
	position: absolute;
	left: 10px;
	top: -70px;
	width: 80px;
	z-index: 2;
}
.hell {
	position: absolute;
	left: -30px;
	top: -15px;
	width: 100px;
	z-index: 2;
}	
.chumoku {
	position: absolute;
	left: -20px;
	top: -30px;
	width: 100px;
	z-index: 2;
}	
}



.ill_sakuhin,
.ill_sakuhin002,
.ill_sakuhin003 {
	display: inline-block;
	margin-bottom: 30px;
}
.ill_sakuhin img,
.ill_sakuhin002 img,
.ill_sakuhin003 img {
	max-height: 250px;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

.ill_online {
	max-height: 250px;
	margin-top: 10px !important;
	display: inline-block;
}

.ill_soudan {
	max-height: 140px;
}
.ill_kanryou {
	max-height: 140px;
}

ul.list_point li:nth-child(2n), ul.list_point li:last-child {
	margin-right: 0;
}
.list_point li h5 {
position: relative;
  padding: 1rem 0 calc(1rem + 3px);
  background: #333;
  color: #FFF;
	font-weight: 600;
	margin-top: 10px;
}
.list_point li h5:before {
 position: absolute;
  top: -5px;
  left: -5px;
  width: 100%;
  height: 100%;
  content: '';
  border: 3px solid #999;
}
@media only screen and (max-width: 1000px) {
.list_point li h5 {
	font-size: 2.2vw;
}
}

@media only screen and (max-width: 768px) {
ul.list_point {
	display: block;
	justify-content: left;
}
ul.list_point li {
	display: block;
	width: auto;
	margin-right: 0;
	margin-bottom: 25px;
	padding-bottom: 2% !important;
	padding: 4%;
}
.list_point p a {
  color: #F90;
  text-decoration: none;
  line-height: 200% !important;
}	
.list_point li h5 {
	font-size: 120%;
}
	
.ill_online, .ill_soudan, .ill_kanryou {
	max-height: none;
	max-width: 20% !important;
	float: right;
	margin: 0 !important;
	margin-left: 15px !important;
}

	
.ill_sakuhin {
	max-height: 300px;
	margin-top: 5px !important;
	margin-bottom: 20px !important;
	display: inline-block;
}	
	
	
.ill_sakuhin002 {
	display: block;
	max-height: none;
	max-width: 48% !important;
	float: left;
	margin: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-bottom: 20px !important;
	margin-top: 5px !important;
}	
	
.ill_sakuhin003 {
	display: block;
	max-height: none;
	max-width: 48% !important;
	float: right;
	margin: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-bottom: 20px !important;
	margin-top: 5px !important;
}	

}

.bt_black {
display: block;
margin: 10px auto;
font-weight: 600;
}
@media only screen and (max-width: 1000px) {
.bt_black {
font-size: 1.6vw;
}
}
.bt_black a {
display: block;
  background: repeating-linear-gradient(-45deg, #333, #333 10px, #444 0, #444 20px);
  border: 5px solid #000;
  color: #FFF;
  padding: 10px 0;
  font-weight: 600;
  text-align: center;
}
.bt_black a:hover {
display: block;
  background: repeating-linear-gradient(45deg, #333, #333 10px, #444 0, #444 20px);
  border: 5px solid #900;
  box-shadow: -2px -2px 5px rgba(255,0,0,0.5);
  text-decoration: none;
}
@media only screen and (max-width: 768px) {
.bt_black {
margin: 10px 5%;
}
.bt_black {
font-size: 2.5vw;

}
.bt_black a {
  padding: 8px 0;
}
.bt_black a:hover {
}
}

