@charset "utf-8";
/* CSS Document */
/* #overview .image{min-height: 600px;} */
#overview .image ul > li .cover_c img {height: auto; margin-left: 330px; box-shadow: 0px 4px 10px 2px rgba(0, 0, 0, 0.25);}
#overview .image ul > li > figure > .cover_c{box-shadow:none; position: relative;}
/* #overview .image ul > li > figure.combination .cover_c{margin-top: 0;} */
#overview .image ul > li > figure > div{background:none;}
#overview .summary{}
#overview .cover_c{position: relative;}
#overview .image::after {height: 421px; top: 41%; background-image: url(/special/lp/202602karadano/images/fv_bg01.jpg); background-repeat: no-repeat; background-position: center;} 


/*----------------------------------------------------------------------------
 ***                                                                introSec
----------------------------------------------------------------------------*/
 #overview .summary .txt{line-height: 1.8; font-family: "Noto Sans Japanese";}
 .txt.mainTxt{font-size: 16px;}
     
 .introTxtBox{background-image: url(/special/lp/202602karadano/images/contents02.jpg); background-repeat: no-repeat; background-position: bottom; padding-bottom: 4em;}
 .sampleBtn{width: 68%; display: block; margin: 2.5em auto 1em;}
 .episodeBox{display: block;}
 .episodeBox::after{content: ""; border-top: 1px solid #8ca4ab; margin: 0 2em;display: block; width: 95%; margin: 3em auto 0;}
 .episodeBoxLast::after{content: none;}
 .episodeBox .episodeTxt{display: block; width: 95%; margin: auto;}

 .commentSec{}
 .commentContent{  position: relative; display: block;  margin: 2em 1em;  padding: 1.5rem 2rem;  background: radial-gradient(circle at 80%,#f6fffd, #e9f2f0);}
 .commentContent::after {content: ""; position: absolute; left: 39%; bottom: -14px; width: 0; height: 0; border-width: 16px 6px 0 12px; border-style: solid; border-color: #f0f7f6 transparent transparent transparent;}
 .commentContent .commentTxt{ display: block;}
 .commentContent .commentNameBox{ display: block; text-align: right; margin-top: 0.2em;}
 .commentContent .commentName{display: inline; position: relative; display: inline;}
 .commentContent .commentName .commentNameNowrap{word-break: keep-all; display: inline-block;}
 .commentContent .commentName::before{content: ""; position: absolute; transform: translate(-100%, 0); left: -0.4em; top: 0; width: 2em; height: 2em; background: radial-gradient( circle, rgba(255, 200, 80, 0.8) 0%, rgba(255, 200, 80, 0.4) 40%, rgba(255, 200, 80, 0.15) 60%, rgba(255, 200, 80, 0) 70% );pointer-events: none;}
 .commentContent2{ background: radial-gradient(circle at 20%,#f6fffd, #e9f2f0 52%);}
 .commentContent2::after {left: 58%; border-width: 16px 12px 0 6px; border-style: solid; border-color: #e9f2f0 transparent transparent transparent;}
 .commentContent2 .commentName::before{background: radial-gradient( circle, rgba(120, 214, 140, 0.8) 0%, rgba(120, 214, 140, 0.4) 40%, rgba(120, 214, 140, 0.15) 60%, rgba(120, 214, 140, 0) 70% );pointer-events: none;}

 .creditTxt{color:#383d3c;}

@media screen and (max-width: 599px) {
    #overview > .share > ul > li{margin-bottom:0.5em;}

    /* ファストビュー調整 */
    #overview .image{min-height: 247px;}
    #overview .image ul > li .cover_c img {margin-left: 0;}
    #overview .cover_c::before{ transform: translate(-57.5%, -50%) scale(40%);}
    #overview .image::after {height: 140px; margin: -50px 0 0; background-size: cover;} 
    
    #overview .image ul > li > figure.combination .cover_c {width: 41vw; margin-left: 41%;}


    #overview .image::after {height: 136px; margin: -45px 0 0;} 
    #overview .image ul > li{padding: 0 3% 0 2%;}
    #overview .image ul > li > figure.combination {max-width: initial; width: 100%; margin-right: 0;}
    #overview .image ul > li .cover_c img {width: auto;}

    #overview > .summary > p.spNomargine {margin: 0;}
    #overview > .summary > p.nomargine {margin: 0;}
    
    #overview > .share > ul > li {margin-bottom: 0.5em;}
    
    /* LP内容 */
    .txt.mainTxt{font-size: 12px;}

    .introTxtBox{background-size: contain;}
    .commentContent{margin: 2em 0;}
    .sampleBtn{width: 76%;}

}


/*----------------------------------------------------------------------------
 ***                                                                   著者紹介
----------------------------------------------------------------------------*/