@charset "UTF-8";
/* base */
@media print and (min-width:768px), screen and (min-width:768px){
	.head-title .inner,#contents .inner{width:1135px;}
}
@media print and (max-width:767px), screen and (max-width:767px){
	.head-title .inner,#contents .inner{margin:0 auto;width:90.6%;}
}
/* @group head-contents */
.head-title {
  position:relative;
  margin:30px auto 22px;
  text-align:left;
}
.head-detail img,#lineup img{width:100%;height:auto;vertical-align:bottom;}
.head-title .genre{color:#fff;display:inline-block;font-weight: bold;}
.head-title h1{font-weight:bold;}
.head-title h1,.head-title p{position:relative;z-index:2;}
.head-detail .item:after{display:none;}
.head-detail .broadcast,.head-detail .other{font-weight:bold;}
.head-detail .other{text-indent: -.5em;}
.head-title .btn-wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;}
.head-title .btn-wrap .btn-return{color:#fff;font-weight:bold;background:#313131;border-radius:2em;}
@media print and (min-width:768px), screen and (min-width:768px){
	.head-title .btn-wrap{margin-bottom:6px;}
	.head-title .btn-wrap .btn-return{transition:.25s ease;padding:.43em 1.68em;font-size:16px;transform:translateY(-.4em);border:#313131 1px solid;}
	.head-title .btn-wrap .btn-return:hover{background:#fff;color:#313131;}
	.head-title .genre{padding: .05em .62em;font-size: 18px;}
	.head-title{margin-bottom:25px;}
	.head-title h1{font-size:34px;line-height:1.23;}
	.head-detail{margin-bottom:105px;background:#F0F0F0;}
	.head-detail .item{display:flex;flex-wrap:wrap;justify-content: space-between;padding:30px 0;font-size:16px;line-height:1.625;}
	.head-detail .item .main_visual{width:54.38%;}
	.head-detail .detail_wrap{width:41.75%;}
	.head-detail .broadcast{margin-bottom:2px;font-size:18px;line-height:1.44;}
	.head-detail .other{margin-bottom:24px;font-size:20px;line-height:2.1;}
}
@media print and (max-width:767px), screen and (max-width:767px){
	.head-title .btn-wrap .btn-return{padding:.25em .86em;font-size:16px;}
	.head-title .btn-wrap{margin-bottom:10px;}
	.head-title .genre{padding:.1em .86em;font-size: 15px;}
	.head-title{margin-bottom:20px;}
	.head-title h1{font-size:24px;line-height:1.33;}
	.head-title p{font-size:14px;}
	.head-detail{margin-bottom:30px;}
	.head-detail .main_visual{margin-bottom:20px;}
	.head-detail .detail_wrap{display:flex;flex-wrap:wrap;font-size:15px;line-height:1.53;}
	.head-detail .other{order:1;margin-bottom:2.5px;width:100%;font-size:17px;line-height:1.47;}
	.head-detail .broadcast{order:2;margin-bottom:10px;width:100%;}
	.head-detail .lead{order:3;width:100%;}
}
/* @group head-contents */

/* @group lineup */
#lineup h2{font-weight:bold;}
#lineup ul.infoList:after{display:none;}
#lineup ul.infoList li h4{font-weight:bold;}
#lineup ul.infoList li .info{display:flex;flex-wrap:wrap;}
#lineup ul.infoList li h5,#lineup ul.infoList li .date,#lineup ul.infoList li p{width:100%;}
#lineup ul.infoList li h5{order:1;font-weight:bold;}
#lineup ul.infoList li .date{order:2;}
#lineup ul.infoList li p{order:3;}
#lineup ul.infoList li figcaption{
	margin-top: .5em;
	padding: 0.15em 0.2em;
	color: #F95F35;
	font-size:80%;
	text-align: center;
	border: #F95F35 1px solid;
}
@media print and (max-width:767px), screen and (max-width:767px){
	#lineup h2{margin-top:30px;margin-bottom:28px;}
	#lineup h2:first-child{margin-top:0;}
	#lineup ul.infoList li{margin-top:45px;font-size:15px;line-height:1.53;}
	#lineup ul.infoList li a{display:block;}
	#lineup ul.infoList li:first-child{margin-top:0;}
	#lineup ul.infoList li figure{margin-bottom:10px;}
	#lineup ul.infoList li h5{margin-bottom:2.5px;font-size:17px;line-height:1.47;}
	#lineup ul.infoList li .date{margin-bottom:10px;}
}

@media print and (min-width:768px), screen and (min-width:768px){
	#lineup h2{margin-top:100px;}
	#lineup h2:first-child{margin-top:0;}
	#lineup ul.infoList{display:flex;flex-wrap:wrap;justify-content:space-between;}
	#lineup ul.infoList li{margin-top:60px;width:48.24%;font-size:16px;line-height:1.625;}
	#lineup ul.infoList li:nth-of-type(-n+2){margin-top:0;}
	#lineup ul.infoList li figure{margin-bottom:20px;}
	#lineup ul.infoList li h5{font-size:20px;line-height:1.5;order:1;}
	#lineup ul.infoList li .date{margin-bottom:5px;order:2;}
}
/* @group lineup*/

/*　スカパーバナー  */
#contents .bnr-skyper img{width:100%;height:auto;}
@media print and (max-width:767px), screen and (max-width:767px){
	#contents .bnr-skyper{margin:40px auto 80px;width:90.66%;}
}
@media print and (min-width:768px), screen and (min-width:768px){
	#contents .bnr-skyper{margin:48px auto 80px;}
}
/*　end  */

/* オプション */
.attention{
	font-weight: bold;
	margin-top: 2em;
	font-size: 100%;
	/* font-size: 110%; */
	color:red;
}

/* @group そのほかの特集 */
#feature-other img{width:100%;height:auto;vertical-align: bottom;}
#feature-other h2{font-weight:bold;}
#feature-other .genre{color:#fff;}
#feature-other .feature-list h4{font-weight:bold;}

@media print and (min-width:768px), screen and (min-width:768px){
	#feature-other{margin-bottom:95px;}
	#feature-other h2{margin-bottom:55px;}
	#feature-other .feature-list {display:flex;flex-wrap:wrap;}
	#feature-other .feature-list .feature-item{margin-left:3.5%;width:22.28%;}
	#feature-other .feature-list .feature-item:first-child{margin-left:0;}
	#feature-other .feature-list .img{margin-bottom:10px;}
	#feature-other .genre-wrap{margin-bottom:5px;}
	#feature-other .genre{padding:.214em .714em;font-size:14px;font-weight:bold;}
	#feature-other .feature-list h4{font-size:20px;line-height:1.5;}
}
@media print and (max-width:767px), screen and (max-width:767px){
	#feature-other{margin-bottom:55px;}
	#feature-other h2{margin-bottom:30px;}
	#feature-other .feature-list .feature-item{margin-top:40px;}
	#feature-other .feature-list .feature-item:first-child{margin-top:0;}
	#feature-other .feature-list .feature-item a{display:flex;flex-wrap:wrap;justify-content: space-between; }
	#feature-other .feature-list .img{width:60.44%;}
	#feature-other .feature-list .feature-item-detail{width:33.82%;}
	#feature-other .feature-list h4{margin-top:4px;font-size:17px;line-height:1.4;}
	#feature-other .genre{padding: .1em .5em;font-size:15px;}
}


/**************************
	イレギュラー
**************************/
/* /feature/lod-series2011/ */
.lod-series2011 .bnr_text{margin-bottom:1em;font-size:120%;font-weight:bold;text-align:center;}
.lod-series2011 .bnr{margin:0 auto;width:100%;}
@media print and (max-width:767px), screen and (max-width:767px){
	.lod-series2011 .bnr_text{font-size:110%;}
	.lod-series2011 .bnr{margin:0 auto;width:100%;}
}

/*********************************
監督レイアウト
・アニメ術
*********************************/
@media screen and (min-width:768px) {
    #anime-directorInt .show_sp{
        display: none;
    }
}
@media screen and (max-width:767px) {
    #anime-directorInt .show_sp{
        display: block;
    }
    #anime-directorInt .show_pc{
        display: none;
    }
}
@media screen and (max-width:767px) {
    #anime-directorInt{
        margin-top: 10%;
    }
}
#anime-directorInt .inner{
    background-color: #ddf1ff;
    border: 1px solid #6982bb;
    padding: 2% 0 5%;
    margin-top: 5%;
}

#anime-directorInt .intTitle{
    font-size: 1.5rem;
    font-weight: bold;
    position: relative;
    display: inline-block;
    padding-left: 2%;
    padding-bottom: 2%;
}

@media screen and (max-width:767px) {
    #anime-directorInt .intTitle{
        font-size: 6vw;
        padding: 5% 5%;
    }
}
#anime-directorInt .intSubtitle{
    text-align: center;
    font-size: 1.1rem;
    font-weight: bold;
}
@media screen and (max-width:767px) {
    #anime-directorInt .intSubtitle{
        width: 90%;
        margin: 0 auto;
        text-align: left;
        font-size: 4vw;
        padding: 6% 0;
    }
}

#anime-directorInt figure{
    width: 50%;
    margin: 0 auto;
    padding: 2% 0;
}

#anime-directorInt figure img{
    max-width: 100%;
}

@media screen and (max-width:767px) {
    #anime-directorInt figure{
        width: 100%;
        padding: 5% 0;
    }
}

#anime-directorInt .intText, #anime-directorInt .bioInner{
    width: 90%;
    margin: 0 auto;
    padding-bottom: 2%;
}

@media screen and (max-width:767px) {
    #anime-directorInt .intText, #anime-directorInt .bioInner{
        padding-bottom: 10%;
    }
}

#anime-directorInt .bioInner{
    position: relative;
    padding: 1.5% 1% 1.5% 3%;
}
@media screen and (max-width:767px) {
    #anime-directorInt .bioInner{
        position: relative;
        padding: 1.5% 3% 10%;
    }
}

#anime-directorInt .bioInner::before{
    content: "";
	background-image: linear-gradient(to right, #6982bb, #6982bb 3px, transparent 3px, transparent 8px),
	linear-gradient(to right, #6982bb, #6982bb 3px, transparent 3px, transparent 8px),
	linear-gradient(to bottom, #6982bb, #6982bb 3px, transparent 3px, transparent 8px),
	linear-gradient(to bottom, #6982bb, #6982bb 3px, transparent 3px, transparent 8px);
	background-size: 8px 1px, 8px 1px, 1px 8px, 1px 8px;
	background-position: left top, left bottom, left top, right top;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

#anime-directorInt .bioTitle{
    font-size: 1.3rem;
    font-weight: bold;
}

@media screen and (max-width:767px) {
    #anime-directorInt .bioTitle{
        font-size: 6vw;
    }
}

#anime-directorInt .bioName{
    font-size: 1.5rem;
    font-weight: bold;
    color: #2e4490;
    padding: .5% 0 .5% 3%;
}
@media screen and (max-width:767px) {
    #anime-directorInt .bioName{
        font-size: 7vw;
        padding: 5% 0 5% 3%;
    }
}

#anime-directorInt .bioName span{
    font-size: 1.2rem;
    color: #000000;
}
@media screen and (max-width:767px) {
    #anime-directorInt .bioName span{
        font-size: 5vw;
    }
}


/* プレゼント */
#anime-present{
    margin-top: 5%;
    margin-bottom: 8%;
}
@media screen and (max-width:767px) {
    #anime-present{
        margin-top: 15%;
        margin-bottom: 20%;
    }
}

#anime-present .presentTitle{
    font-size: 1.2rem;
    padding-bottom: 1.5%;
}
@media screen and (max-width:767px) {
    #anime-present .presentTitle{
        padding-bottom: 10%;
    }
}

#anime-present .presentInfo{
    padding-bottom: 1.5%;
}
@media screen and (max-width:767px) {
    #anime-present .presentInfo{
        padding-bottom: 10%;
    }
}
#anime-present .presentDetail{
    display: flex;
    padding-left: 3%;
}
@media screen and (max-width:767px) {
    #anime-present .presentDetail{
        padding-left: 0;
        flex-direction: column;
    }
}

#anime-present .presentDetail figure{
    width: 30%;
    margin-right: 3%;
}
#anime-present .presentDetail figure img{
    max-width: 100%;
}
@media screen and (max-width:767px) {
    #anime-present .presentDetail figure{
        width: 100%;
        margin-right: 0;
        padding-bottom: 10%;
    }
}
#anime-present .presentDetail dt ~ dt{
    margin-top: 1.5%;
}
@media screen and (max-width:767px) {
    #anime-present .presentDetail dt ~ dt{
        margin-top: 8%;
    }
}
#anime-present a{
    display: table;
    width: 240px;
    text-align: center;
    margin: 2rem auto 0;
    padding: .25em 1.75em .2em;
    background: #28140b;
    font-weight: bold;
    color: #fff;
    line-height: 1.75;
    transition: opacity .25s ease;
}
#anime-present a:hover{
    opacity: .8;
}
@media screen and (max-width:767px) {
    #anime-present a{
        width: 60%;
        margin: 4rem auto 0;
    }
}
/* /プレゼント */

/*********************************
あしたのジョー　
・アニメ術
*********************************/
@media screen and (min-width:768px) {
    #anime-tomorrows-joe .show_sp{
        display: none;
    }
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe .show_sp{
        display: block;
    }
    #anime-tomorrows-joe .show_pc{
        display: none;
    }
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe{
        margin-top: 10%;
    }
}
#anime-tomorrows-joe .inner{
/*    background-color: #ddf1ff;
    border: 1px solid #6982bb; */
    padding: 2% 0 0 0;
/*    margin-top: 5%; */
}

#anime-tomorrows-joe .intTitle{
    font-size: 1.5rem;
    font-weight: bold;
    position: relative;
    display: inline-block;
}

@media screen and (max-width:767px) {
    #anime-tomorrows-joe .intTitle{
        font-size: 5.5vw;
        padding: 5% 5%;
    }
}
#anime-tomorrows-joe .intSubtitle{
    text-align: center;
    font-size: 1.1rem;
    font-weight: bold;
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe .intSubtitle{
        width: 90%;
        margin: 0 auto;
        text-align: left;
        font-size: 4vw;
        padding: 6% 0;
    }
}

#anime-tomorrows-joe figure{
    width: 25%;
    margin: 0 auto;
    padding: 2% 0;
}

#anime-tomorrows-joe figure img{
    max-width: 100%;
}

@media screen and (max-width:767px) {
    #anime-tomorrows-joe figure{
        width: 100%;
        padding: 5% 0;
    }
}

#anime-tomorrows-joe .intText, #anime-tomorrows-joe .bioInner{
    background-color: #ddf1ff;
    width: 90%;
    margin: 0 auto;
    padding-bottom: 2%;
}

@media screen and (max-width:767px) {
    #anime-tomorrows-joe .intText, #anime-tomorrows-joe .bioInner{
        padding-bottom: 10%;
    }
}

#anime-tomorrows-joe .bioInner{
    position: relative;
    padding: 1.5% 1% 1.5% 3%;
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe .bioInner{
        position: relative;
        padding: 1.5% 3% 10%;
    }
}

#anime-tomorrows-joe .bioInner .detail{
    display: flex;
    padding-left: 3%;
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe .bioInner .detail{
        display: block;
        padding: initial;
    }
}

#anime-tomorrows-joe .bioInner .detail .text{
    padding: 2%;
    width: 75%;
}
@media screen and (max-width:767px){
    #anime-tomorrows-joe .bioInner .detail .text{
        width: 100%;
    }
}

#anime-tomorrows-joe .bioInner::before{
    content: "";
	background-image: linear-gradient(to right, #6982bb, #6982bb 3px, transparent 3px, transparent 8px),
	linear-gradient(to right, #6982bb, #6982bb 3px, transparent 3px, transparent 8px),
	linear-gradient(to bottom, #6982bb, #6982bb 3px, transparent 3px, transparent 8px),
	linear-gradient(to bottom, #6982bb, #6982bb 3px, transparent 3px, transparent 8px);
	background-size: 8px 1px, 8px 1px, 1px 8px, 1px 8px;
	background-position: left top, left bottom, left top, right top;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

#anime-tomorrows-joe .bioTitle{
    font-size: 1.3rem;
    font-weight: bold;
}

@media screen and (max-width:767px) {
    #anime-tomorrows-joe .bioTitle{
        font-size: 6vw;
    }
}

#anime-tomorrows-joe .bioName{
    font-size: 1.5rem;
    font-weight: bold;
    color: #2e4490;
    padding: .5% 0 .5% 3%;
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe .bioName{
        font-size: 7vw;
        padding: 5% 0 5% 3%;
    }
}

#anime-tomorrows-joe .bioName span{
    font-size: 1.2rem;
    color: #000000;
}
@media screen and (max-width:767px) {
    #anime-tomorrows-joe .bioName span{
        font-size: 4.5vw;
    }
}


/*********************************************
 @group info   2022.12
********************************************/
.info-txbox,
.info-present,
.info-bnr{
    margin-top: 80px;
    margin-bottom: 80px;
}
.info-bnr-item{
    margin-bottom: 20px;
}
.info-present img,
.info-bnr img{
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.info-txbox .inner,
.info-present .inner{
  border: 1px solid #DD492B;
  color: #111111;
}
.info-present .info-present-item,
.info-txbox .info-txbox-item{
  padding: 3.33% 3.94%;
}

/* info-txbox */
/* info-txbox  wysiwyg */
.info-txbox .info-txbox-item img{
    max-width: 100%;
    width: auto;
    margin: 10px;
}
.info-txbox .info-txbox-item h1,
.info-txbox .info-txbox-item h2,
.info-txbox .info-txbox-item h3,
.info-txbox .info-txbox-item h4,
.info-txbox .info-txbox-item h5,
.info-txbox .info-txbox-item h6{
  padding-bottom: 0.476%;
}
.info-txbox .info-txbox-item h1{
    font-size: 2.0em;
}
.info-txbox .info-txbox-item h2{
    font-size: 1.5em;
}
.info-txbox .info-txbox-item h3{
    font-size: 1.17em;
}
.info-txbox .info-txbox-item h4{
    font-size: 1.0em;
}
.info-txbox .info-txbox-item h5{
    font-size: 0.83em;
}
.info-txbox .info-txbox-item h6{
    font-size: 0.67em;
}
.info-txbox .info-txbox-item p{
    margin-bottom: 30px;
    line-height: 1.4;
}
.info-txbox .info-txbox-item a{
    color: #4555cf;
    word-break: break-all;
}
.info-txbox .info-txbox-item strong{
    font-weight: bold;
}
.info-txbox .info-txbox-item .iframeWrapper iframe{
    display: block;
    margin: auto;
}




/* info-present */
.info-present .info-present-item h3{
  font-size: 137.5%;
  font-weight: bold;
  padding-bottom: 3%;
}
.info-present .info-present-item{
  display: flex;
  text-align: left;
}
.info-present .info-present-item figure{
  width: 28.14%;
}
.info-present .info-present-item .info-present-item-detail{
  width: calc(100% - 30.99%);
  padding-left: 2.85%;
}
.info-present .info-present-item .info-present-item-detail p{
  font-weight: bold;
  line-height: 1.3;
}
.info-present .info-present-item .info-present-item-detail .link{
  margin-top: 3.94%;
  text-align: center;
}
.info-present .info-present-item .info-present-item-detail .link a{
  position: relative;
  display: inline-block;
  padding: 2px 8.29% 1px 4.84%;
  color: #ffffff;
  font-weight: bold;
  line-height: 1.75;
  text-align: left;
  background-color: #25150D;
}
.info-present .info-present-item .info-present-item-detail .link a:hover{
  opacity: 0.7;
}
.info-present .info-present-item .info-present-item-detail .link ::after{
  content: '';
  display: block;
  position: absolute;
  right: 1.87em;
  top: 50%;
  width: 0.56em;
  height: 0.93em;
  transform: translateY(-51%);
  background: url(/parts/feature/img/btn-arrow.png) no-repeat;
  background-size: contain;
  background-position: center;
}

/* info-bnr */

@media print, screen and (max-width: 767px) {
  .info-txbox,
  .info-present,
  .info-bnr{
    margin-bottom: 14.66%;
  }
  .info-present .info-present-item,
  .info-txbox .info-txbox-item{
  padding: 3.676% 3.97%;
}
  .info-txbox{
    margin-top: 13.33%;
  }
  .info-txbox .info-txbox-item img{
    display: block;
    width: 90%;
    margin: 0 auto 10px;
    height: auto;
  }
  .info-txbox .info-txbox-item h3,
  .info-present .info-present-item h3{
    font-size: 4.8vw;
    padding-bottom: 4.41%;
  }
  .info-txbox .info-txbox-item .iframeWrapper{
    position: relative;
    padding-top: 56.25%;
  }
  .info-txbox .info-txbox-item .iframeWrapper iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .info-present .info-present-item .info-present-item-detail p{
    font-size: 4vw;
    line-height: 1.5;
  }
  .info-present .info-present-item{
    align-items: center;
  }
  .info-present .info-present-item figure{
    width: 32.2%;
  }
  .info-present .info-present-item .info-present-item-detail{
    width: calc(100% - 37.36%);
    padding-left: 5.16%;
  }
  .info-present .info-present-item .info-present-item-detail .link{
    margin-top: 16.66%;
    font-size: 4.8vw;
  }
  .info-present .info-present-item .info-present-item-detail .link a{
    padding: 3.07% 11.53%;
  }
  .info-present .info-present-item .info-present-item-detail .link ::after{
    display: none;
  }
}
/*********************************************
 @end info   2022.12
********************************************/
