@charset "UTF-8";
/*-------------------------------
���ʐݒ�
--------------------------------*/
 a:hover {
   text-decoration: underline;
}
 .sns_Aria a:hover {
   text-decoration: none;
}
#globalNavi.naviFixed {
   display: none;
}
 .container {
   width: 100%;
   margin: 0 auto 100px;
   font-size: 16px;
}
.sp .container {
   width: 100%;
   margin: 0 auto;
   font-size: 100%;
}
.sp .container img {
   width: 100%;
   vertical-align: bottom;
}
.container a:hover {
   opacity: .6;
   text-decoration: none;
   cursor: pointer;
   }
h1.head {
   color: #ff5e80;
}
div.matomeTxt {
   border: solid 4px #ffe9ee;
   line-height: 1.5em;
}
.dramaWrap {
   background-color: #ffe9ee;
}
section.contentsArea h4 {
   color: #ff5e80;
}
section.contentsArea h4 span {
   display: inline-block;
   padding-right: 20px;
   background-color: #fff;
}
section.contentsArea .subDetail {
   background-color: #fff;
   border-radius: 2px;
}
/* sns */
ul.sns_Btn {
   display: table;
   border-spacing: 3px 0;
   border-collapse: separate;
   width: 100%;
   margin: 0 auto 5px;
}
ul.sns_Btn li {
   display: table-cell;
   /*width: 33%;*/
   margin: 0 1%;
   border-top: 1px solid rgba(255,255,255,.2);
   border-bottom: 1px solid rgba(0,0,0,.2);
   border-radius: 3px;
   text-align: center;
   vertical-align: middle;
}
.sp ul.sns_Btn li {
   display: table-cell;
   width: 33%;
   margin: 0 1%;
   border-top: 1px solid rgba(255,255,255,.2);
   border-bottom: 1px solid rgba(0,0,0,.2);
   border-radius: 3px;
   text-align: center;
   vertical-align: middle;
}
ul.sns_Btn li.snsTw {
   background: #55acee url(/static/mtm/base/img/twIcon.png) no-repeat 0 center;
   background-size: 34px;
}
ul.sns_Btn li.snsFb {
   background: #3b5999 url(/static/mtm/base/img/fbIcon.png) no-repeat 0 center;
   background-size: 28px;
   letter-spacing: 2px;
}
ul.sns_Btn li a {
   display: block;
   color: #fff;
}
ul.sns_Btn li.snsTw a {
   padding-left: 35px;
}
ul.sns_Btn li.snsFb a {
   padding-left: 24px;
}
/* .worklist */
section.contentsArea h2.worklistTtl {
   background-color: #ff5e80;
   color: #fff;
   font-weight: normal;
}
section.contentsArea h2.worklistTtl::before {
   display: inline-block;
   vertical-align: middle;
   content: "";
}
section.contentsArea h2.worklistTtl span {
   color: #fff;
   vertical-align: middle;
   line-height: 1;
}
section.contentsArea .subDetail p a,
section.contentsArea .dramaDetail p a {
    font-size:105%
    
}
/*----------------------------------------------
  pc
----------------------------------------------*/
/* --- section recomend --- */
.pc .matome {
   position: relative;
   margin-bottom: 35px;
}
.pc h1.head {
   min-height: 160px;
   font-size: 32px;
   display: -webkit-box;
   display:         flex;
   display: -webkit-flex;
   -webkit-box-pack: justify;
   justify-content: flex-start;
   -webkit-justify-content: flex-start;
   -webkit-align-items: flex-start;
   align-items: flex-start;
}
.pc h1.head span{
    display:inline-block;
    padding: 1% 0 0 7%;
}
.pc section.recomend {
   width: 970px;
   margin: 0 auto 40px;
   padding-top: 20px;
   padding-bottom: 10px;
}
.pc div.matomeTxt {
   padding: 30px 20px 30px;
}
.pc div.matomeTxt p:first-child {
   margin-bottom: 12px;
}
/*sns*/
.pc .sns_Aria {
   position: absolute;
   left: 36%;
   bottom: 10px;
   width: 230px;
}
.pc ul.sns_Btn li.snsLi {
   display: none;
}
.pc ul.sns_Btn li a {
   height: 40px;
   line-height: 40px;
}
/* --- section contentsArea --- */
.pc .spImg {
   display: none;
}
.pc section.contentsArea {
   width: 970px;
   margin: 0 auto 30px;
}
.pc section.contentsArea h2 {
   margin-bottom: -20px;
}
.pc section.contentsArea h2 .disnon {
   display: none;
}
.pc section.contentsArea h3 {
   margin-bottom: 6px;
   font-size: 24px;
   padding-right: 70px;
}
section.contentsArea h3 span{
  font-weight:normal;
  display:block;
  font-size: 18px;
}
.pc section.contentsArea h4 {
   position: relative;
   margin-bottom: 5px;
   background: url(/static/mtm/base/img/line_zero.png) repeat-x 0 50%;
   font-size: 20px;
   font-weight: bold;
}
section.contentsArea h4::after {
   display: block;
   position: absolute;
   top: 50%;
   right: -10px;
   width: 46px;
   height: 31px;
   margin-top: -15px;
   padding-left: 15px;
   background: url(/static/mtm/base/img/bg_heart_cho.png) right top no-repeat;
   content: "";
   -webkit-transform-origin: 50% 0;
   -moz-transform-origin: 50% 0;
   -ms-transform-origin: 50% 0;
   -o-transform-origin: 50% 0;
   transform-origin: 50% 0;
   -webkit-animation: kurun 6s linear 1s infinite;
   -moz-animation: kurun 6s linear 1s infinite;
   -o-animation: kurun 6s linear 1s infinite;
   animation: kurun 6s linear 1s infinite;
   -webkit-animation-fill-mode: forwards;
   animation-fill-mode: forwards;
}
.pc section.contentsArea .dramaWrap {
   margin-bottom: 35px;
   padding: 20px;
}
.pc section.contentsArea .drama {
   display: -webkit-box;
   display:         flex;
   display: -webkit-flex;
   margin-bottom: 20px;
   letter-spacing: -.40em;
   -webkit-box-pack: justify;
   justify-content: space-around;
   -webkit-justify-content: space-around;
   -webkit-align-items: stretch;
   align-items: stretch;
}
.pc section.contentsArea .dramaCap {
   display: inline-block;
   width: 460px;
   /* background: url(/static/mtm/base/img/snapshot.png) center; */
   letter-spacing: normal;
}
.pc section.contentsArea .dramaCap img {
   vertical-align: bottom;
}
.pc section.contentsArea .dramaDetail {
   display: inline-block;
   width: 445px;
   padding: 0 0 0 25px;
   vertical-align: top;
   letter-spacing: normal;
   position: relative;
}
.pc section.contentsArea .dramaDetail p {
   line-height: 1.75;
}

.pc section.contentsArea .subDetail p {
   line-height: 1.5;
   font-size: 14px;
}
.pc section.contentsArea .subDetail {
   padding: 10px 15px 12px 10px;
}
/* worklist */
.pc section.contentsArea h2.worklistTtl {
   margin-bottom: 10px;
   padding: 10px;
   font-size: 22px;
}
.pc section.contentsArea h2.worklistTtl::before {
   width: 46px;
   height: 31px;
   margin-right: 10px;
   /*background: url(/static/mtm/base/img/icon_heart.png) center;*/
}
.pc section.contentsArea .worklist {
   overflow: hidden;
   margin-left: -10px;
   letter-spacing: -.40em;
}
.pc section.contentsArea .worklist li {
   display: inline-block;
   width: 187px;
   margin-bottom: 40px;
   margin-left: 9px;
   font-size: 14px;
   text-align: left;
   vertical-align: top;
   letter-spacing: normal;
}
.pc section.contentsArea .worklist li img {
   box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .2);
}
.pc section.contentsArea .worklist li span {
   display: block;
   padding: 2% 0;
   font-size: 14px;
   text-align: center;
}
.pc section.copyright {
   width: 970px;
   margin: 30px auto;
   color: #727272;
   font-size: 12px;
}
section.contentsArea p a:hover{
  text-decoration:underline;
  font-size: 105%;
}
section.copyright {
    color: #b6b6b6;
    font-size: 10px;
}
/*----------------------------------------------
  sp
----------------------------------------------*/
/* --- section recomend --- */
.sp .matome {
   width: 100%;
   margin-bottom: 0;
   padding: 3% 0;
}
.sp h1.head {
   width: 100%;
   min-height: auto;
   margin-bottom: 5%;
   padding-left: 0;
   background: none;
   font-size: 1rem;
   text-align: center;
   letter-spacing: 1px;
}
.sp h1.head span{
  padding-top:3%;
  display:inline-block;
}
.sp div.matomeTxt {
   margin-bottom: 5%;
   padding: 3% 2%;
   background: #ffe9ee;
   width: 91%;
   margin: 0 auto 5%;
   border: solid 2px #983d3d;
}
.sp div.matomeTxt p:first-child {
   margin-bottom: 3%;
}
/* sns */
.sp .sns_Aria {
   width: 98%;
   margin: 1% 0 1% 1%;
}
.sp ul.sns_Btn li.snsLi {
   display: table-cell;
   padding-left: 0;
   background: #00b900;
   text-align: left;
   width: 35%;
}
.sp ul.sns_Btn li a {
   height: 40px;
   line-height: 40px;
}
.sp ul.sns_Btn li.snsLi span {
   display: block;
   position: relative;
}
.sp ul.sns_Btn li.snsLi span a {
   position: relative;
   z-index: 10;
}
.sp ul.sns_Btn li.snsLi a img {
   width: auto;
}
.sp ul.sns_Btn li.snsLi span:after {
   position: absolute;
   z-index: 1;
   top: 50%;
   left: 48px;
   margin-top: -.6em;
   color: #fff;
   letter-spacing: 2px;
   content: "LINE";
}
/* --- section contentsArea --- */
.sp .pcImg {
   display: none;
}
.sp section.contentsArea {
   width: 100%;
   margin: 0 auto 2%;
}
.sp section.contentsArea h2 {
   /* margin-bottom: -2%; */
   padding-left: 1%;
}
.sp section.contentsArea h2 {
   color: #ff5e80;
   line-height: 2em;
}
.sp section.contentsArea h2 .disnon span {
   display: inline-block;
   width: 11vw;
   padding-left: 5vw;
   background: url(/static/mtm/base/img/bg_num.png) no-repeat 0 0;
   background-size: contain;
   color: #fff;
   font-size: 4vw;
   font-weight: normal;
}
.sp section.contentsArea h2:nth-of-type(10) .disnon span {
   padding-right: 2vw;
   padding-left: 2vw;
}
.sp section.contentsArea h2 img.spImg {
   width: 168px !important;
}
.sp section.contentsArea h3 {
   margin-bottom: 5%;
   padding-right: 4em;
}
.sp section.contentsArea h4 {
   position: relative;
   margin-bottom: 3%;
   /*background: url(/static/mtm/base/img/line.png) repeat-x 0 50%;*/
   background-size: 361px auto;
   font-size: 1rem;
}
.sp section.contentsArea h4 span {
   padding-right: 3%;
}
.sp section.contentsArea h4::after {
   display: block;
   position: absolute;
   top: -10%;
   right: -4%;
   width: 26px;
   height: 18px;
   margin-top: -9px;
   padding-left: 3%;
   background: url(/static/mtm/base/img/bg_heart_cho.png) right top no-repeat;
   background-size: auto 100%;
   content: "";
}
.sp .dramaWrap {
   margin-bottom: 3%;
   padding: 3%;
}
.sp p.dramaCap {
   margin-bottom: 2%;
/*    background: url(/static/mtm/base/img/snapshot.png) center no-repeat;
   -webkit-background-size: cover;
           background-size: cover; */
}
.sp section.contentsArea .dramaDetail p,
.sp section.contentsArea .subDetail p {
   line-height: 1.5;
}
.sp section.contentsArea .dramaDetail {
   margin-bottom: 5%;
   position: relative;
}
.sp section.contentsArea .subDetail {
   padding: 4% 2%;
}
/* worklist */
.sp section.contentsArea h2.worklistTtl {
   margin-bottom: 3%;
   padding: 2% 0 2% 3%;
}
.sp section.contentsArea h2.worklistTtl::before {
   width: 25px;
   height: 17px;
   margin-right: 2%;
   background: url(/static/mtm/base/img/icon_heart.png) center no-repeat;
   background-size: 100% auto;
}
.sp section.contentsArea .worklist {
   display: -webkit-box;
   display: -webkit-flex;
   display:         flex;
   width: 98%;
   margin: 0 auto 5%;
   text-align: center;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   -webkit-justify-content: flex-start;
   justify-content: flex-start;
   flex-wrap: wrap;
   -webkit-flex-wrap: wrap;
}
.sp section.contentsArea .worklist li {
   width: 31%;
   margin-bottom: 5%;
   text-align: left;
   margin: 0 1% 5%;
}
.sp section.contentsArea .worklist li figure {
   margin-bottom: 5%;
}
span.copyR {
    padding: 1% 0;
    display: block;
    font-size: 10px;
    color: #9e9e9e;
}
small.year {
    margin-bottom:16px;
    display: block;
    font-size: 100%;
    margin-top: -12px;
    position: absolute;
    right: 0;
    top: 1em;
}
small.year + .subDetail h4::after{
  background:none;
}
.pc #afterword.contentsArea {
    box-sizing: border-box;
    padding: 15px;
    background: #ffe9ee;
    line-height: 1.4;
}
.pc #afterword.contentsArea h2 {
    margin-bottom: 15px;
    padding: 0;
}

#blln {
  position: relative;
  display: inline-block;
  padding: 0 15px;
  width: auto;
  min-width: 115px;
  height: 50px;
  color: #F6F6F6;
  line-height: 50px;
  text-align: center;
  background: #ff5e80;
  border-radius: 60px;
  z-index: 0;
}
#blln:before {
  content: "";
  position: absolute;
  bottom: -17px;
  left: 15px;
  margin-left: 0;
  display: block;
  width: 15px;
  height: 15px;
  background: #ff5e80;
  border-radius: 50%;
  z-index: 0;
}
#blln:after {
  content: "";
  position: absolute;
  bottom: -25px;
  left: 25px;
  margin-left: 0;
  display: block;
  width: 8px;
  height: 8px;
  background: #ff5e80;
  border-radius: 50%;
  z-index: 0;
}
#afterword p {
    padding: 1% 2% 1% 5%;
}
.sp #blln{
   margin-bottom: 4%;
}
.sp #afterword p {
    padding: 1% 1% 1% 3%;
    text-indent: 2em;
}
@keyframes "kurun"{0%{transform:rotate(-278deg);}20%{transform:rotate(15deg);}40%{transform:rotate(-10deg);}60%{transform:rotate(5deg);}80%{transform:rotate(-5deg);}100%{transform:rotate(0deg);}}@-moz-keyframes "kurun"{0%{-moz-transform:rotate(-278deg);}20%{-moz-transform:rotate(15deg);}40%{-moz-transform:rotate(-10deg);}60%{-moz-transform:rotate(5deg);}80%{-moz-transform:rotate(-5deg);}100%{-moz-transform:rotate(0deg);}}@-webkit-keyframes "kurun"{0%{-webkit-transform:rotate(-278deg);}20%{-webkit-transform:rotate(15deg);}40%{-webkit-transform:rotate(-10deg);}60%{-webkit-transform:rotate(5deg);}80%{-webkit-transform:rotate(-5deg);}100%{-webkit-transform:rotate(0deg);}}@-o-keyframes kurun{0% { -o-transform:rotate(-278deg)}20%{-o-transform:rotate(15deg)}40%{-o-transform:rotate(-10deg)}60%{-o-transform:rotate(5deg)}80%{-o-transform:rotate(-5deg)}100%{-o-transform:rotate(0deg)}} @-ms-keyframes kurun{0% { -ms-transform:rotate(-278deg)}20%{-ms-transform:rotate(15deg)}40%{-ms-transform:rotate(-10deg)}60%{-ms-transform:rotate(5deg)}80%{-ms-transform:rotate(-5deg)}100%{-ms-transform:rotate(0deg);}