@charset "UTF-8";
body,button,input,select,table,textarea,header,footer{
  font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

h1 {float: none!important;}
body::before {
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background: #f2f5f7;
  }

body{color: #000;}
table,td,th{font-size:1.8rem}
.news_link{color:#fff;text-decoration:underline;font-weight:bold;}
.news_link:hover{color:#fff;text-decoration:none;font-weight:bold;}
.list{width:100%;margin:0;padding:0;display:-webkit-box;display:-moz-box;display:-ms-box;display:-webkit-flexbox;display:-moz-flexbox;display:-ms-flexbox;display:-webkit-flex;display:-moz-flex;display:-ms-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;}
a:hover {text-decoration: none!important;}

#foot_menu,#Foot{font-size:12px;}
#narou_head{display:none;}
#narou_head .inner img {
  height: 17px;
  width: auto;
}
#main_visual .subttl {max-width: none;width: 100%;text-align:center;}
.subttl figure{background: #fff;width: 60%;background: #1a4900;padding: 0.25em 1em;    margin: 0 auto 2vw 0px; border-radius: 30px;}
.subttl figure img{max-width:100%;display:block; margin: 0 auto;}

#main_visual{text-align:center;position: relative; background-color: #fff;}
#main_visual>.inner {width: 100%;max-width: 1800px;margin: 0 auto;}
#main_visual .mv_wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  max-height: 100vh;
  overflow-y: hidden;
  position: relative;
  flex-direction: row-reverse;
}
#main_visual .mv_wrap>figure {
  width: 55%;
  mask-image: linear-gradient(to right, transparent 0%, #000 0%, #000 80%, #fff .2% , transparent);
  transition: mask-image 2s 2s ease-in-out;
}
#main_visual .mv_wrap>div {width: 43%;padding-left: 2%;} 
#main_visual .mv_wrap>figure>img {width: 100%;height: auto;}
#main_visual .book_parade h2 img {width: 100%;height: auto;}
#main_visual .book_parade .ttl_wrap {padding: 1em 0 1.5em;width: 100%;}
#main_visual .book_parade .ttl_wrap h1 img {width: 100%;height: auto;}
#main_visual .book_parade .text_wrap {width: 100%;}
#main_visual .book_parade .text_wrap dl {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: max(1.6vw , calc( 1.8rem + 0.5vw ));
  font-size: max(1.9vw , 2.3rem);

}
#main_visual .book_parade .text_wrap dl:nth-child(2) {margin-top: 0.5em;}
#main_visual .book_parade .text_wrap dt {
  /* font-size: min(1.7vw,2.4rem); */
  font-size: clamp(1.3rem, 0.863rem + 0.71vw, 2rem);
  /* 769 2000 */
  /* font-size: clamp(1.3rem, 1.133rem + 0.347vw, 2rem); */
  font-size: 50%;
  font-weight: bold;
  background: #1a4900;
  padding: 0.5em 0.5em;
  line-height: 1;
  display: inline-block;
  color: #fff;
  text-align: center;
}
#main_visual .book_parade .text_wrap dd {
  font-size: min(1.8vw,2.6rem);
  font-size: clamp(1.48rem, 1.213rem + 0.555vw, 2.6rem);
  font-size: min(70% , 2.8rem);
      font-weight: bold;
  letter-spacing: -1px;
  line-height: 1;
  color: #1a4900;
  margin-left: 0.5em;
}
#main_visual .book_parade .text_wrap p {
  font-size: 1.2rem;
  margin-top: 1em;
  color: #1a4900;
}
#main_visual p.mv_author {font-size: 1rem;position: absolute;bottom: 0;right: 0;color: #fff;padding: 0.5em 2em; filter: drop-shadow(0px 0px 2px #000) drop-shadow(0px 0px 2px #000);}

#menu_area ul{text-align:center;display: flex;justify-content: space-between;}
#menu_area ul li{display:inline-block;vertical-align:top;margin: 0 0;width: 32.8%;box-sizing:border-box;}
#menu_area ul.list4 li{display:inline-block;vertical-align:top;margin: 0 0;width: 24.33%;box-sizing:border-box;}
#menu_area ul li img{width: 100%;}
#menu_area ul li a{color:#fff;display:block;padding: 0.5em 0;font-size:2.8rem;}
#menu_area ul li a:hover{text-decoration:none;}
.btn-circle-fishy {
  font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
  font-style: normal;
  font-weight: 600;
  text-align:center;
  display: inline-block;
  background-color: #1a4900;
  font-size: 2rem;;
  color: #FFF;
  text-decoration: none;
  padding: 20px 24px;
  position: relative;
}
.btn-circle-fishy:hover {
    opacity: 0.9;
}
.btn-circle-fishy a:before {
  position: absolute;
  top: 0;
  right: 0;
  content: '';
  width: 0;
  border-width: 0 30px 30px 0;
  border-style: solid;
  border-color: #f2f5f7 #f2f5f7 #9DACBF #f2f5f7;
  box-shadow: -2px 2px 3px rgba(0 ,0 ,0 ,.2);
}

#news_area{width: 100%;padding: 20px 0 30px;display:table;float:none;}
#news_area .inner{background: #fff;padding:1em 2em;filter: drop-shadow(1px 3px 3px #cfd1d1);}

#news_area h3{text-align:center;padding: 1em 0;background: #c1dbf4;}
#news_area > div > ul{width: 900px;margin: 0 auto;max-height: 300px;overflow:auto;}
#news_area > div > ul >li {border-bottom: 1px dotted #000;
    margin-right: 10px;
    padding: 10px 0 10px 120px;
    text-indent: -120px;}
#news_area > div > ul >li:last-child{border-bottom:none;margin-bottom: 0;}
#news_area > div > ul >li >span{
    background: #1a4900 none repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    font-size: 11px;
    margin: 0 20px 0 0;
    text-align: center;
    text-indent: 0;
    width: 100px;}


#content{width: 980px;margin:0 auto;filter: drop-shadow(1px 3px 3px #cfd1d1);}
#content>h3{
  letter-spacing: 0.05em;
    width: 100%;
    text-align: center;
    background: #1a4900;
    position: relative;
    margin: 1em 0 0.5em;
    padding: 0.5em 0 0.3em;
    color: #fff;
    font-size: 3rem;
    line-height: 1;
}
#content>h3.mds04 span {font-size: 2rem;vertical-align: middle;}
#content >div{background: #fff;width: 100%;padding: 4em;box-sizing: border-box;}
#content >div.mgt{margin-top: -3.2em;}
#content >div.mgt2{margin-top: -4.2em;}
#content >div h2.mds{font-family:a-otf-midashi-go-mb31-pr6n, sans-serif;margin-bottom: 1em;;width: 100%;padding: 0.5em;text-align:center;border-top:1.5px solid #dbc01f;border-bottom:1.5px solid #dbc01f;box-sizing: border-box;}
#content >div h2.mds.review {
  margin-top: 1em;
}
#content >div p,#content >div ul{margin-bottom: 1em;}
#content >div p >img{float: right;margin: 3em 0 2em 2em;}
#content >div p{line-height: 1.8em;}
#content >div >div{display:table;width: 100%;box-sizing: border-box;}
#content >div ul{text-align: center;width: 100%;justify-content: space-between;}

#keyword{width: 100%;border-collapse: collapse;margin-bottom: 1em; text-align: center;}
#keyword th{width: 50%;background: #efefef;padding: 0.5em;}
#keyword td{width: 50%;border:6px solid #F22738;padding: 1.5em; background-color: #f2f5f7;}
#keyword td a{font-size: 36px; font-weight: bold;color: #000;}


#case02 h3{padding: 1em 0;}
#case02 h3 span{
  display: inline-block;
  background: #1a4900;
  padding: 0.4em 1em;
  color:#fff;
  font-weight: bold;
}


.pt1 ul {display: flex; flex-wrap: wrap;}
.pt1 li{width: 100%; display: flex; align-items: center; text-align:left; padding-bottom: 2em;}
.pt1>p:first-child{margin-bottom: 2em!important;text-align: center;}
.pt1 li>div>span{display:block; border-radius: 5px; font-weight: 700;}
.pt1 li>div:first-child{width: 5em;font-size: 3.5rem;text-align:center;margin-right: 0.5em;}
.pt1 li .prize{display: flex;align-items: center; flex-grow: 1;font-size: 2.8rem;font-weight: bold;}
.pt1 li .prize>div:first-child{flex-basis: 220px;}
.pt1 li .prize span {font-size: 7rem;font-family: 'Staatliches', cursive;}
.pt1 li:nth-child(3) .prize span,.pt1 li:nth-child(4) .prize span {font-size: 6rem;}
.pt1 li .prize span.red {color: #e73827;}
.pt1 li .prize .text {position: relative; flex-grow: 1; padding-left: 1em; line-height: 1.2;}
.pt1 li .prize .text::before {
  position: absolute;
  display: inline-block;
  width: 1em;
  height: 1em;
  top: calc( 50% - 0.5em );
  left: 0;
  content: "＋";
}
.pt1 .text_box{text-align: center;}
.pt1 .text_box p{display: inline-block;}
.pt1 .group {display: inline-block; text-align: center; color:#fff; padding: 0.3em 0.5em;margin-right: 0.5em;}


#case03 >div{margin: 1em 0;}
#case03 >div>h2{max-width: 250px;margin: 0 auto 0.5em;}
#case03 >div>h2 img {width: 100%;height: auto;}
#case03 >div{background:#fff8dc; padding: 1.7em 0.5em;text-align:center;}
#case03 >div>p{text-align:center;width: 100%;margin-bottom: 0;color: #F22738;font-weight:bold;;}
#case03-in h2 {
  font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
  font-weight: 800;
  color: #1a4900;
  display: flex;
  align-items: center;
  gap: 8px;
}
#case03-in h2::before,
#case03-in h2::after {
  content: "";
  display: block;
  background-color: #1a4900;
  height: 3px;
  width: 2em;
}

.atts2 li{text-indent:-1em;padding-left: 1em;font-size:90%;margin-bottom: 0.5em;}
.atts2 li:before{content:"※";}

#case04 li{padding: 0 0 0 2.2em;text-indent:-3em;}
.qaQ{color:#021e58;;font-weight:bold;margin-bottom:0.5em;}
.qaA{margin-bottom: 2em}
.qaQ>span{font-size:180%;font-weight: bold;margin-right: 0.3em;}
.qaA>span{font-size:180%;color:#F22738;font-weight: bold;margin-right: 0.3em;}
#atts2{margin-top: 5em;font-size:85%;}

#case05 >div{margin: 1em 0;}
#case05 >div>h2{margin-bottom: 0.5em;}
#case05 >div{background:#ffffc3;padding: 1em;text-align:center;}
#case05 >div>p{text-align:center;width: 100%;margin-bottom: 0.5em;;}
#case05 >div>p>span{color: #F22738;font-weight:bold;font-size:130%;}
#case05 >div>a{width: 40%;padding:0.5em;background: #7c64d5;color:#fff;display:block;margin: 0.2em auto 0;}
#case05 table{width: 100%;border-collapse: collapse;}
#case05 table th{width:20%;background:#e2e2e2 ;padding: 0.5em;font-size:130%;}
#case05 table td{text-align:center;font-size:130%;padding: 0.5em;border-right:2px solid #e2e2e2;border-bottom:2px solid #e2e2e2;}
#case05 table td:last-child{border-right:none;}

#case06{text-align:center;}
#case06 h3{border-top:1px solid #7c64d5;border-bottom:1px solid #7c64d5;margin: 0 auto 1em;padding: 0.25em;    width: 50%;}
#case06 h2{color:#7c64d5;font-size:1.6rem;margin-bottom: 0.5em;}
#case06 h4{margin-bottom: 1em;}
#case06 a{background: #000;color:#fff;padding: 0.3em;    display: block;width: 50%;margin: 0 auto;border-radius:5px}
#case06 a:hover{opacity:0.7;text-decoration:none;}
#case06 >div>div{margin-bottom: 3em;}

#case07 h3{text-align:center;margin: 0 auto 1em;padding: 0.75em;border-radius:0.5em;}
#case07 h3#gold{
    background: #fceabb; /* Old browsers */
background: -moz-linear-gradient(top, #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 ); /* IE6-9 */
}
#case07 h3#silver{
   background: #f6f8f9; /* Old browsers */
background: -moz-linear-gradient(top, #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
}
#case07 h3#special{
    background: #ebf1f6; /* Old browsers */
background: -moz-linear-gradient(top, #ebf1f6 0%, #abd3ee 50%, #89c3eb 51%, #d5ebfb 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ebf1f6 0%,#abd3ee 50%,#89c3eb 51%,#d5ebfb 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ebf1f6 0%,#abd3ee 50%,#89c3eb 51%,#d5ebfb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=0 ); /* IE6-9 */
}

#case07 h3#gold + ul li span{background: #f8b500;}
#case07 h3#silver + ul li span{background: #999;}
#case07 h3#special + ul li span{background: #7c64d5;}




#case07 h2{color:#7c64d5;font-size:1.3rem;margin-bottom: 1em;text-align:left;}
#case07 h4{margin-bottom:3em;text-align:left;}
#case07 h4 span{background: #7c64d5;color:#fff;border-radius:0.25em;padding: 0.55em 1em;margin-right: 1em;}
#case07 a:hover{opacity:0.7;text-decoration:none;}
#case07 >.case07-in>li{width: 48%;vertical-align: top;margin:0 1% 1em;background: #efefef;border:3px solid #cdcdcd;padding: 1em;}

#case07 >.case07-in p {font-size:0.9rem;position:relative;border:3px solid #cdcdcd;padding: 1.5em;width: 100%;box-sizing: border-box;background: #fff;margin-bottom: 0;}
#case07 >.case07-in p:before{content:"講 評";display:block;background: #fff;color:#fff;    position: absolute;font-weight:bold;font-size:0.8rem;background: #999;border-radius:1em;
    left: 0;
    right: 0;
    padding: 0.1em 0.5em;
    top: -18px;
    width: 100px;
    margin: auto;
    text-align: center;}

.case07-in-all h3{border-top:1px solid #7c64d5;border-bottom:1px solid #7c64d5;border-radius:0!important;}

#case08 {display: flex!important;flex-wrap: wrap;justify-content: space-between;}
#case08 .pt1 {display: flex; margin-bottom: 2em;}
#case08 h4+div{
  padding: 10px;
}
#case08 .pt1>div{
  flex-grow: 1;
  width: 100%;
  /*width: 50%;
  max-width: 50%;*/
  margin: 10px;
  padding: 0;
}
#case08 .pt1 .award span{
display: block;
padding: 10px 0;
margin-bottom: 1em;
font-size: 2rem;
font-weight: bold;
}
#case08 .award{text-align: center;}
#case08 ul.case08_list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}
#case08 ul li{
  width: calc((100% - 1em) / 2);
  /* height: fit-content; */
  display: block;
  padding: 1em;
  border: 1px solid #eee;
}
#case08 dl.title>dt {margin-bottom: 0.5em;font-weight: bold;}
#case08 dl.title>dt a {
  color: #1a4900;
  text-decoration: underline;
}
/*#case08 dl dt a {
  display: inline-block;
  width: 100%;
  padding: 0.5em 1em;
  margin-bottom: 1em;
  background-color: #00a0e9;
  border-radius: 5px;
  color: #fff;
  font-weight: bold;
}*/
#case08 dl.title>dd {display: inline-block; width: 100%;}
#case08 .auth {margin-right:1em; padding: 0.3em 0.5em; background: #1a4900;font-size: 0.8em;color: #fff;}
#case08 .review {text-align: center;}
#case08 .review dt{
  display: inline-block;
  padding: 6px 30px;
  border: 1px solid #eee;
  background-color: #fff;
  border-radius: 30px;
}
#case08 .review dd{
  padding: 2em 1em 1em;
  margin-top: -1em;
  background-color: #f8f1ce;
  text-align: left;
}
#case08 .review dd p{
  text-indent: 1em;
  margin-bottom: 0;
}
#case08 .decoT{background:linear-gradient(rgba(255,241,80,0)0%,
rgba(255,241,80,0.6) 0%);
color:#00a0e9;
text-align:
center;font-size: 1.5em;
font-weight: bold;
margin: 1.5em auto 0;
margin-bottom: 0!important;
line-height: 1em!important;}


#main_bottom >div>ul>li{float:left;margin: 20px 3px 10px;}


#gnavi h1 a {
    background: transparent url("../img/gnavi_logo.png") no-repeat scroll 0 0;
    display: block;
    height: 34px;
    width: 245px;
}

#content #recomend{padding: 4.5em 2em 0 2em;}
#recomend{margin-top: 2em;}
#recomend ul{display:flex;flex-wrap:wrap;}
#recomend li{width: 20%;padding: 0.5%;}
#recomend li img{width: 100%;}

/*social*/

#twitter1{float:right;width:110px;}
#facebook1{float:right;}

/*shadow*/
.shadow{
box-shadow: 2px 2px 2px #ccc;
-moz-box-shadow:2px 2px 2px #ccc; /* Firefox */
-webkit-box-shadow: 2px 2px 2px #ccc;  ; /* Chrome, Safari */
background-color:#fff;
behavior: url(PIE.htc);}
.last{margin:0!important;}

a:hover img{	opacity:0.8;}

#sp-top{display:none;}

#case08 .case08_list .award span {
  display: block;
  padding: 10px 0;
  margin-bottom: 1em;
  font-size: 2rem;
  font-weight: bold;
}

.color-a{ color: #fff;border:2px solid #b68d4c;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f3e2c7+0,c19e67+50,b68d4c+51,e9d4b3+100;L+Brown+3D */
background: #f3e2c7; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #f3e2c7 0%, #c19e67 50%, #b68d4c 51%, #e9d4b3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #f3e2c7 0%,#c19e67 50%,#b68d4c 51%,#e9d4b3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #f3e2c7 0%,#c19e67 50%,#b68d4c 51%,#e9d4b3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3e2c7', endColorstr='#e9d4b3',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.color-b{ color: #fff;border:2px solid #2b2b2b;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4c4c4c+0,595959+12,666666+25,474747+39,2c2c2c+50,000000+51,111111+60,2b2b2b+76,1c1c1c+91,131313+100;Black+Gloss+%231 */
background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
.color-c{ color: #fff;border:2px solid #fbdf93;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+51,fbdf93+100;Orange+3D+%235 */
background: #fceabb; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.color-d{ color: #fff;border:2px solid #e73827;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f85032+0,f16f5c+50,f6290c+51,f02f17+71,e73827+100;Red+Gloss+%231 */
background: #f85032; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#main_bottom {padding-bottom: 1em;}


/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
	Responsive Design
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-**-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
@media screen and (max-width: 1800px){
  #main_visual .book_parade .text_wrap dt {
    /* font-size: min(2vw,2.4rem); */
  }
  #main_visual .book_parade .text_wrap dd {
    /* font-size: calc(1.2rem + .5vw); */
  }
  #main_visual .mv_wrap>figure {mask-image: none;}
}

@media screen and (max-width: 768px){

  body {
    overflow-x: hidden;
  }
  body::before {
    content:"";
    display:block;
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100%;
    height:100vh;
    background: #f2f5f7;
    }
  
#narou_head{display:block;
    padding: 0.75em 0.5em 0.75em 5rem;
    background: #000;
    height: 42px;}
#narou_head .ttl{display:none;}

.wrapTop{overflow:hidden;}
#main_contents{padding:0 2.5% 1em;}

#news_area .inner{padding: 1em;}
#news_area > div > ul >li{margin-right: 0;}
#news_area > div > ul{width: 100%;}

.inner,.main_frame,#gnavi,#content{width: 100%!important;}
#sp-top{display:block;}
#sp-top img{width: 100%;}
#main_visual{height: auto;}
#content >div h2.mds img{width: auto;max-width:100%;}
#content >div p >img{width: 100%;margin: 0 0 1em 0;}
#content >div.mgt{margin-top: 0;}
#content >h3 {font-size: 1.5em;margin: 1.5em 0 0;    padding: 0.4em 0 0.3em;}
#content >h3 img{height: 2.6em;}

#main_visual .mv_wrap {
  display: block;
  max-height: 100%;
}
#main_visual .mv_wrap>figure {width: 100%; margin-top: 70px;}
#main_visual .mv_wrap>figure>img {
  width: 100vw;
}
#main_visual .mv_wrap>div {width: 90%;margin: 0 auto;padding-left: 0; position: absolute; top: 0; left: 0; right: 0;} 
#main_visual .book_parade .ttl_wrap {width: 100%;margin: .5em auto 0;padding: 0; filter: drop-shadow(0px 0px 5px #fff) drop-shadow(0px 0px 5px #FFF) drop-shadow(0px 0px 5px #fff) drop-shadow(0px 0px 12px #fff);}
#main_visual .book_parade h2 {margin: .5em auto 0;width: 100%;}
#main_visual .book_parade .text_wrap {width: 100%;margin: 1em auto 0;text-align: left;}
#main_visual .book_parade .text_wrap dl {text-align: left;position: relative;background: #1a4900; width: fit-content;}
#main_visual .book_parade .text_wrap dt {font-size: 2.4vw;width: 15%;padding: 0.25em; width: fit-content; display: inline-block;}
#main_visual .book_parade .text_wrap dd {font-size: 3.1vw;letter-spacing: 0;text-align: left;width: 84%;background: #fff;padding: 0.2em 0.5em;display: inline-block;margin-left: 0;width: fit-content;}
#main_visual .book_parade .text_wrap p {background: #fff;padding: 0.2em 0.5em;position: relative;display: inline-block; width: fit-content;}
#main_visual p.mv_author {
  color: #fff;
  font-size: 1rem;
  text-align: left;
  width: 97%;
  line-height: 1.4;
  padding-inline: 0;
}

#menu_area{display:none;}

#news_area{padding: 1em 0 0;}
#news_area > div > ul >li{text-indent:0;padding: 0;margin-bottom: 1em;border-bottom:0;}
#news_area > div > ul >li span{display:block;width: 100%;margin-bottom: 0.5em;;}

#case02 .pt1 li:nth-child(3),#case02 .pt1 li:nth-child(4) {width: 100%;}

#case03 >div>h2 {max-width: 200px;}
#case03 >p.space {margin-bottom: 2em;}

#case05 >div>a{width: 80%;}

#case07 >.case07-in>li{width: 100%;}

#case08 .pt1 {flex-wrap: wrap;}
#case08 .pt1>div {width: 100%;max-width: 100%;margin: 0;}
#case08 .pt1>div:first-child {margin-bottom: 2em;}
#case08 ul li:first-child{min-height: auto;}
#case08 ul li:last-child {margin-bottom: 0;}
#case08 ul.case08_list {width: 100%;}

#content >div{padding:2em 1em;}
#content >div >div{font-size:90%}
#main_bottom >div>ul>li{text-align:center;width: 100%;margin: 0;}
#main_bottom{padding-top: 1em;}
#foot_menu{padding: 1em;}
#Foot ul li{float:none;display:inline-block;}
#social{display:none;}


.pt1{display:block;}
.pt1 li {flex-wrap: wrap;}
.pt1 li > div:first-child{width: 100%; margin-right: 0;}
.pt1 li .prize {flex-wrap: wrap;}
.pt1 li .prize > div:first-child {flex-basis: 100%; padding-top: 1em; text-align: center;}
.pt1 li .prize .text {font-size: 1.8rem;flex-grow: 0;margin: 0 auto;}

#content >div ul li{width: 100%;}
.pt2{display:block;}
.pt2 div{width: 100%;margin-right: 0;}
.pt2 div p img{width: 100px!important;}
.pt2 div:last-child{width: 100%;padding-left: 0;}
#case02 >h3:nth-of-type(1){text-align: left;}
#content >div.mgt2{margin-top: -3em;}
#recomend li{width: 33.33%!important;}
#content #recomend{padding: 3.5em 1em 0 1em;}
#content > h3:nth-of-type(4) img{height: 2.5em;}
#mn01{padding: 0 0 1em 0;}

}