@charset "UTF-8";
    /* CSS Document */

    body {
        margin: 0;
        position: relative;
        padding: 0px;
        background-image: url("https://img21.shop-pro.jp/PA01475/145/etc/bg.jpg?cmsp_timestamp=20210924144902");
        background-repeat: repeat;
        font-family: "���C���I","Meiryo","�q���M�m�p�S Pro W3","Hiragino Kaku Gothic Pro","�l�r �o�S�V�b�N", "MS P Gothic","Osaka","Verdana","Arial", "Helvetica", "sans-serif";
    }

    ul { list-style: none; }

    ul li{list-style-type:none;}


    table,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td{ margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent;}







    a:link {
        color : #e62e8b;
        text-decoration : none;
    }

    a:visited {
        color : #e62e8b;
        text-decoration : none;
    }

    a:hover {
        color : #e8e6e6;
        text-decoration : none;
    }


    a:active {
        color : #e8e6e6;
        text-decoration : none;
    }

    img {
        margin:0;
        padding:0;
        vertical-align:bottom;
        border:none;
    }

    p {
        font-size:14px;
        font-weight: normal;
        color: #595757;
        line-height: 1.6em;
    }

    p.a {
        font-size:16px;
        font-weight: bold;
        color: #ed86b5;
        line-height:1.0em;
    }

    h1 {
        width: 720px;
        height: 35px;
        font-size:18px;
        font-weight: bold;
        color: #e62e8b;
        line-height: 1.8em;
        margin: 20px 0px 20px 20px;
        padding: 5px 0px 0px 10px;
        border-bottom: 1px solid #e62e8b;
        border-left: 10px solid #e62e8b;
    }

    h2 {
        width: 720px;
        height: 35px;
        font-size:16px;
        font-weight: nomal;
        color: #ffffff;
        background-color:#ed86b5;
        line-height: 1.8em;
        margin: 20px 0px 0px 20px;
        padding: 5px 0px 0px 20px;
    }

    h3 {
        width: 720px;
/*
      height: 35px;
*/
        font-size:16px;
        font-weight: nomal;
        color: #ed86b5;
        line-height: 1.8em;
        border-bottom: 1px solid #ed86b5;
        margin: 20px 0px 0px 20px;
        padding: 5px 0px 0px 20px;
    }

    h4 {
        font-size:16px;
        font-weight: bold;
        color: #ed86b5;
    }

    .date {
        font-size:14px;
        font-weight: normal;
        color: #000000;
        line-height: 1.2em;
    }

    .topics {
        font-size:14px;
        font-weight: normal;
        color: #999999;
        line-height: 1.2em;
    }

    .title {
        font-size:14px;
        font-weight: normal;
        color: #ad926b;
        line-height: 1.8em;
    }

    .bookdetail_txt,
    .cover-read a {
        font-size:14px;
        font-weight: normal;
        color: #999999;
        line-height: 1.2em;
    }

    .cover-title {
        font-size:16px;
        font-weight: bold;
        color: #999999;
        line-height: 1.2em;
    }

    .footer-p {
        font-size:12px;
        font-weight: normal;
        color: #ffffff;
        line-height: 1.8em;
    }

    /* container
    ---------------------------------------------------- */
    #container {
        width: 1000px;
        margin: 0 auto;
        background-color:#ffffff;
        clear:both;
        position: relative;
    }


    /* header
    ---------------------------------------------------- */
    #header_wrap {
        width: 100%;
        margin: 0 auto;
        background-color:#ffffff;
        border-bottom: 1px solid #e62e8b;
        position: relative;
    }

    #header {
        width: 1000px;
        height: 75px;
        margin: 0 auto;
        background:url("https://img21.shop-pro.jp/PA01475/145/etc/header_bg.jpg?cmsp_timestamp=20210924145010") center no-repeat;
    }

    #header_img {
        width: 200px;
        padding: 10px 0px 0px 0px;
    }

    #charles_header {
        width: 1000px;
        height: 114px;
        margin: 0 auto;
        background: url("https://img21.shop-pro.jp/PA01475/145/etc/charles_header_bg.jpg?cmsp_timestamp=20210924145059") center bottom no-repeat;
    }

    #charles_header-l {
        width: 500px;
        margin: 20px 0px 0px 20px;
        padding: 0px;
        float: left;
        text-align: left;
    }

    #charles_header-r {
        width: 480px;
        margin:51px 0px 0px 0px;
        padding: 0px;
        float: left;
        text-align: left;
    }


    /* contents
    ---------------------------------------------------- */
    #contents {
        width:1000px;
        margin:0px auto;
        padding: 0px;
        position: relative;
    }

    #contents-l {
        width:220px;
        margin: 0px;
        padding: 0px;
        float: left;
        text-align: left;
        position: relative;
    }

    #contents-l ul {
        list-style: none;
        padding: 20px 0px 0px 20px;
        margin:0px;
        line-height:0;
    }

    #contents-l li {
        width: 200px;
        height: 41px;
        padding: 0px 0px 0px 0px;
        display:block;
        line-height:0px;
    }

    .contents-img {
        width: 200px;
        padding: 2px 0px 0px 20px;
    }

    #contents-r {
        width:780px;
        margin: 0px;
        padding: 0px;
        float: left;
        text-align: left;
        position: relative;
    }





    /* special
    ---------------------------------------------------- */
    #special {
        width: 738px;
        margin: 0px auto;
        padding: 0px 0px 0px 0px;
        border: 1px solid #e62e8b;
        clear:both;
    }

    .special_info {
        width: 738px;
        margin: 0px auto;
        padding: 0px;
        border-left: 1px solid #e62e8b;
        border-right: 1px solid #e62e8b;
        border-bottom: 1px solid #e62e8b;
        clear:both;
    }

    #main_footer {
        width: 780px;
        margin: 0px;
        padding: 0px;
    }

    #news {
        width: 498px;
        height: 298px;
        margin: 0px 0px 0px 20px;
        padding: 0px;
        border: 1px solid #e62e8b;
        float: left;
        text-align: left;
    }

    .news-title {
        margin: 0px;
        padding: 5px 0px 0px 5px;
    }

    .news-date {
        width: 460px;
        height: 230px;
        margin: 10px 10px 10px 10px;
        padding: 0px 10px 0px 0px;
        overflow: auto;
    }

    .line {
        margin: 10px 0px 0px 0px;
        padding: 0px;
        border-bottom: 1px dotted #999999;
    }

    #twitter {
        width: 220px;
        height: 300px;
        margin: 0px 20px 0px 0px;
        padding: 0px;
        float: right;
        text-align: left;
    }

    #lineup {
        width: 740px;
        margin: 0px 0px 0px 20px;
        padding: 0px;
        text-align: left;
    }




    td {
    vertical-align: bottom;
    }

    #lineup table{
        width: 660px;
    margin-top: 20px;
    }


    #lineup td.siteName{
        width: 260px;
        padding: 5px;
        box-sizing: border-box;
    }

    #lineup td.siteQR{
        width: 160px;
        padding: 5px;
        box-sizing: border-box;
    }

    #lineup td.siteName p{
        font-size:16px;
        font-weight: bold;
        color: #ed86b5;
        line-height:1.0em;
    }


    #cover_title {
        width: 740px;
        margin: 0px 0px 0px 0px;
        padding: 0px;
        float: left;
        text-align: left;
    }


    .box_center{
        display:flex;
        flex-flow: row wrap;
        align-content: flex-start;
        width:740px;
      margin-left:auto;
      margin-right:auto;
    }



    .cover {
        width: 25%;
        margin: 10px 0px 20px;
        padding: 0;
        border-right: 1px dotted #999999;
        box-sizing: border-box
    }

    .cover_top {
    text-align: center;
    }

    .comics {
        margin: 10px 0 0;
        padding: 0 8px;
        text-align: left;
    }

    #cover_info-l {
        width: 300px;
        margin: 0px 0px 0px 0px;
        padding: 0px;
        float: left;
        text-align: left;
    }

    #cover_info-l img {
        width: 300px;
    }


    #cover_info-r {
        width: 420px;
        margin: 0px 0px 0px 20px;
        padding: 0px;
        float: right;
        text-align: left;
    }


    /* comingsoon
    ---------------------------------------------------- */
    #comingsoon {
        width: 740px;
        height: 300px;
        margin: 0px 0px 0px 20px;
        padding: 0px;
        border: 1px solid #ed86b5;
        text-align: center;
    }

    #owabi {
        width: 740px;
        margin: 0px 0px 0px 20px;
        padding: 0px;
        border: 1px solid #ed86b5;
    }

    #ready {
        font-size:18px;
        font-weight: normal;
        color: #ed86b5;
        line-height: 2em;
        margin: 100px 0px 0px 0px;
        padding: 0px;
    }

    #owabibun {
        font-size:18px;
        font-weight: normal;
        color: #ed86b5;
        line-height: 2em;
        margin: 50px 0px 50px 50px;
        padding: 0px;
    }



    /* footer
    ---------------------------------------------------- */
    #footer {
        width: 1000px;
        margin: 0 auto;
        padding: 20px 0px 0px 0px;
        clear:both;
        background: #fff;
        position: relative;
    }

    #footer-list {
        width: 960px;
        margin: 0px 0px 0px 0px;
        padding: 15px 20px 15px 20px;
        border-top: 1px solid #e62e8b;
        clear:both;
    }

    #footer-list ul {
        width: 960px;
        margin:0px;
        padding:0px;
        list-style: none;
    }

    #footer-list li {
        margin:0px;
        padding:0px;
        display:block;
        float:left;
        line-height: 1.4em;
    }

    .footer-link {
        background-image: url("https://img21.shop-pro.jp/PA01475/145/etc/mark_link.jpg?cmsp_timestamp=20210924145150");
        background-repeat: no-repeat;
        background-position: left center;
        margin: 0px 20px 0px 0px;
        padding-left: 25px;
        padding-top: 1px;
        font-size:14px;
        font-weight: normal;
    }

    #copyright_wrap {
        width: 100%;
        margin: 0px auto;
        background-color:#e62e8b;
        text-align: center;
        clear:both;
        position: relative;
    }

    #copyright {
        width: 980px;
        margin: 0px auto;
        padding: 20px 0px 20px 20px;
        text-align: left;
    }


    /* other
    ---------------------------------------------------- */

    .clear {
        clear: both;
    }


    .space {
        margin: 0px 0px 0px 0px;
        padding: 20px 0px 0px 0px;
        clear: both;
    }


    .video-container {
        padding: 20px 0px 0px 0px;
        text-align: center;
    }

    .video_on{
    min-height: 420px;
        margin-bottom: 20px;
    }

    .bookdetail_txt .video-container{
        position: relative;
        width:100%;
        margin-left: -230px;
    }

    #works {
        width: 740px;
        margin: 0px;
        padding: 20px 20px 0px 20px;
    }

    .read {
        width: 700px;
        margin:20px 0 0;
        padding: 0px 20px 0px 20px;
        border: 1px solid #ed86b5;
        text-align: left;
    }



    /* pagetop */
    #pagetop {
      position: fixed;
      right: 0;
      bottom: 100px;
      display: none;
    }
    .btn-pagetop {
      display: block;
      padding: .8em .4em .8em .5em;
      -webkit-border-radius: 3px 0 0 3px;
      -moz-border-radius: 3px 0 0 3px;
      border-radius: 3px 0 0 3px;
    }

    .btn-01 {
      border: 1px solid #4d4d4d;
      background-color: #4d4d4d;
      color: #fff;
      *background-color: #4d4d4d;
    }



    .btn-01 {
      border: 1px solid #4d4d4d;
      background-color: #4d4d4d;
      color: #fff;
      *background-color: #4d4d4d;
    }

    .btn-01:hover,
    .btn-01:focus,
    .btn-01:active,
    .btn-01.active,
    .btn-01.disabled,
    .btn-01[disabled] {
      border: 1px solid #5e5e5e;
      background-color: #5e5e5e;
      color: #fff;
      *background-color: #5e5e5e;
    }
      .icon-lg-b,
      .icon-lg-w {
        -webkit-background-size: 552px 480px;
        background-size: 552px 480px;
      }
      .icon-lg-w {
        background-image: url(https://img.shop-pro.jp/tmpl_img/69/icon24_2x_w.png);
      }
    .icon-lg-w.icon-chevron_up { background-position: -0px -216px; }
    .icon-lg-b,
    .icon-lg-w {
      width: 24px;
      height: 24px;
      display: inline-block;
      *display: inline;
      *zoom: 1;
    }
    .icon-lg-w {
      background-image: url(https://img.shop-pro.jp/tmpl_img/69/icon24_w.png);
    }


    .amazonLink{
    position:relative;
    }
    .amazonLink::before{
    content:url(https://img21.shop-pro.jp/PA01475/145/etc/amazon.png?cmsp_timestamp=20210925155954);
    vertical-align: center;
    }


    .bg_gry{
        background:#666;
        padding:3px;
    }

    .bg_red{
        background:#cc0000;
        padding:3px;
    }


    .bg_black{
        background:#000;
    }

    .bg_white{
        background:#fff;
    }

    .t_center{
        text-align:center;
    }
    .t_left{
        text-align:left;
    }
    .t_right{
        text-align:right;
    }

    .f20{
        font-size:20%;
    }

    .f30{
        font-size:30%;
    }

    .f40{
        font-size:40%;
    }

    .f50{
        font-size:50%;
    }

    .f60{
        font-size:60%;
    }

    .f70{
        font-size:70%;
    }

    .f80{
        font-size:80%;
    }

    .f90{
        font-size:90%;
    }

    .f100{
        font-size:100%;
    }

    .f110{
        font-size:110%;
    }

    .f120{
        font-size:120%;
    }

    .f130{
        font-size:130%;
    }

    .f140{
        font-size:140%;
    }

    .f150{
        font-size:150%;
    }

    .f160{
        font-size:160%;
    }

    .f170{
        font-size:170%;
    }

    .f180{
        font-size:180%;
    }

    .f190{
        font-size:190%;
    }

    .f200{
        font-size:200%;
    }

    .f210{
        font-size:210%;
    }

    .f220{
        font-size:220%;
    }

    .f230{
        font-size:230%;
    }

    .f240{
        font-size:240%;
    }

    .f250{
        font-size:250%;
    }

    .f260{
        font-size:260%;
    }

    .f270{
        font-size:270%;
    }

    .f280{
        font-size:280%;
    }

    .f290{
        font-size:290%;
    }

    .f300{
        font-size:300%;
    }



    .l10{
        line-height: 1.0em;
    }

    .l11{
        line-height: 1.1em;
    }

    .l12{
        line-height: 1.2em;
    }

    .l13{
        line-height: 1.3em;
    }

    .l14{
        line-height: 1.4em;
    }

    .l15{
        line-height: 1.5em;
    }

    .l16{
        line-height: 1.6em;
    }

    .l17{
        line-height: 1.7em;
    }

    .l18{
        line-height: 1.8em;
    }

    .l19{
        line-height: 1.9em;
    }

    .l20{
        line-height: 2.0em;
    }


    .pd_t2{
        padding-top:2px;
    }

    .pd_t5{
        padding-top:5px;
    }

    .pd_t7{
        padding-top:7px;
    }

    .pd_t10{
        padding-top:10px;
    }

    .pd_t15{
        padding-top:15px;
    }

    .pd_t20{
        padding-top:20px;
    }

    .pd_t25{
        padding-top:25px;
    }

    .pd_t30{
        padding-top:30px;
    }

    .pd_t35{
        padding-top:35px;
    }

    .pd_t40{
        padding-top:40px;
    }

    .pd_t45{
        padding-top:45px;
    }

    .pd_t50{
        padding-top:50px;
    }

    .pd_l5{
        padding-left:5px;
    }

    .pd_l10{
        padding-left:10px;
    }

    .pd_l15{
        padding-left:15px;
    }

    .pd_l20{
        padding-left:20px;
    }

    .pd_l25{
        padding-left:25px;
    }

    .pd_l30{
        padding-left:30px;
    }

    .pd_l35{
        padding-left:35px;
    }

    .pd_l40{
        padding-left:40px;
    }

    .pd_l45{
        padding-left:45px;
    }

    .pd_l50{
        padding-left:50px;
    }

    .pd_l70{
        padding-left:70px;
    }

    .pd_r5{
        padding-right:5px;
    }

    .pd_r10{
        padding-right:10px;
    }

    .pd_r15{
        padding-right:15px;
    }

    .pd_r20{
        padding-right:20px;
    }

    .pd_r25{
        padding-right:25px;
    }

    .pd_r30{
        padding-right:30px;
    }

    .pd_r35{
        padding-right:35px;
    }

    .pd_r40{
        padding-right:40px;
    }

    .pd_r45{
        padding-right:45px;
    }

    .pd_r50{
        padding-right:50px;
    }

    .pd_r70{
        padding-right:70px;
    }

    .pd_b5{
        padding-bottom:5px;
    }

    .pd_b10{
        padding-bottom:10px;
    }

    .pd_b15{
        padding-bottom:15px;
    }

    .pd_b20{
        padding-bottom:20px;
    }

    .pd_b25{
        padding-bottom:25px;
    }

    .pd_b30{
        padding-bottom:30px;
    }

    .pd_b35{
        padding-bottom:35px;
    }

    .pd_b40{
        padding-bottom:40px;
    }

    .pd_b45{
        padding-bottom:45px;
    }

    .pd_b50{
        padding-bottom:50px;
    }

    .mg_t5{
        margin-top:5px;
    }

    .mg_t10{
        margin-top:10px;
    }

    .mg_t15{
        margin-top:15px;
    }

    .mg_t20{
        margin-top:20px;
    }

    .mg_t25{
        margin-top:25px;
    }

    .mg_t30{
        margin-top:30px;
    }

    .mg_t35{
        margin-top:35px;
    }

    .mg_t40{
        margin-top:40px;
    }

    .mg_t45{
        margin-top:45px;
    }

    .mg_t50{
        margin-top:50px;
    }

    .mg_t200{
        margin-top:200px;
    }

    .mg_t300{
        margin-top:300px;
    }


    .mg_l5{
        margin-left:5px;
    }

    .mg_l10{
        margin-left:10px;
    }

    .mg_l15{
        margin-left:15px;
    }

    .mg_l20{
        margin-left:20px;
    }

    .mg_l25{
        margin-left:25px;
    }

    .mg_l30{
        margin-left:30px;
    }

    .mg_l35{
        margin-left:35px;
    }

    .mg_l40{
        margin-left:40px;
    }

    .mg_l45{
        margin-left:45px;
    }

    .mg_l50{
        margin-left:50px;
    }

    .mg_l200{
        margin-left:200px;
    }

    .mg_r5{
        margin-right:5px;
    }

    .mg_r10{
        margin-right:10px;
    }

    .mg_r15{
        margin-right:15px;
    }

    .mg_r20{
        margin-right:20px;
    }

    .mg_r25{
        margin-right:25px;
    }

    .mg_r30{
        margin-right:30px;
    }

    .mg_r35{
        margin-right:35px;
    }

    .mg_r40{
        margin-right:40px;
    }

    .mg_r45{
        margin-right:45px;
    }

    .mg_r50{
        margin-right:50px;
    }

    .mg_r200{
        margin-right:200px;
    }

    .mg_b5{
        margin-bottom:5px;
    }

    .mg_b10{
        margin-bottom:10px;
    }

    .mg_b15{
        margin-bottom:15px;
    }

    .mg_b20{
        margin-bottom:20px;
    }

    .mg_b25{
        margin-bottom:25px;
    }

    .mg_b30{
        margin-bottom:30px;
    }

    .mg_b35{
        margin-bottom:35px;
    }

    .mg_b40{
        margin-bottom:40px;
    }

    .mg_b45{
        margin-bottom:45px;
    }

    .mg_b50{
        margin-bottom:50px;
    }

    .mg_b200{
        margin-bottom:200px;
    }

    .mg_b300{
        margin-bottom:300px;
    }

    .mg_auto{
        margin:0 auto 0 auto;
    }


    .bd{
        border:solid thin #000;
        padding:5px;
    }

    .bd_l{
        border-left:solid thin #000;
    }

    .bd_r{
        border-right:solid thin #000;
    }

    .bd_t{
        border-top:solid thin #000;
    }

    .bd_t_pink{
        border-top:solid thin #f7008c;
    }

    .bd_b{
        border-bottom:solid thin #000;
    }

    .bd_dash_l{
        border-left:dashed thin #000;
    }

    .bd_dash_r{
        border-right:dashed thin #000;
    }

    .bd_dash_t{
        border-top:dashed thin #000;
    }

    .bd_dash_b{
        border-bottom:dashed thin #000;
    }


    .red{
        color: #b20b1e;
    }

    .white{
        color: #fff;
    }

    .pink{
        color: #ff79e6;
    }
    .parl_red{
        color: #ff47ba;
    }
    .purple{
        color: #cc63ff;
    }
    .wine_red{
        color: #fc00a7;
    }


    .bold{
        font-weight: bold;
    }

    .strong{
        font-weight: bolder;
    }


    .wid_90{
        width:90%;
        margin-left:auto;
        margin-right: auto;
    }




    @media (max-width: 1000px) {

    body {
        width: 100%;
        background-image: none;
        position: relative;
    }

    #header_wrap {
        width: 100%;
        margin: 0;
        }



    #header{
        width: calc(100% - 20PX);
        margin: 0 10px;
    }

    #container{
        width: calc(100% - 20PX);
        margin: 0 10px;
    }

    #charles_header{
        width: 100%;
        margin: 0;
    }




    #charles_header-l {
        width: 460px;
        margin: 0;
        }


    #charles_header-l img{
        width: 100%;
    margin-top: 20px;
        }



    #charles_header-r {
        width: calc(98% - 460PX);
        margin: 50px 0 0 2%;
    }


    #contents {
        width: 100%;
        margin: 0;
    }


    #contents-l {
        width:22%;
        box-sizing: border-box;
    }

    #contents-l ul {
        list-style: none;
        padding: 20px 0 0;
    }

    #contents-l li {
        width: 100%;
        height: 41px;
        overflow: hidden;
    }

    .contents-img {
        width: 100%;
        overflow: hidden;
        padding: 0;
    }



    #contents-r {
        width:78%;
        box-sizing: border-box;
    }




    #footer {
        width: 100%;
        margin: 0;
    }


    #footer-list {
        width: calc(100% - 20PX);
        padding: 15px 10px;
    }



    #footer-list ul {
        width: 100%;
    }

    #copyright_wrap {
        width: 100%;
        margin: 0;
    }

    #copyright {
        width: calc(100% - 20PX);
        margin: 0;
        padding: 20px 10px;
        text-align: center;
    }


    h1 {
        width: calc(100% - 20PX);
        margin: 20px 0px 20px 20px;
        padding: 5px 0px 0px 10px;
        box-sizing: border-box;
    }

    h2 {
        width: calc(100% - 20PX);
        margin: 20px 0px 0px 20px;
        box-sizing: border-box;
    }


    h3 {
        width: calc(100% - 20PX);
        margin: 20px 0px 0px 20px;
        box-sizing: border-box;
        }


    .box_center{
        width: calc(100% - 20PX);
      margin-left:20px;
      margin-right:0;
        box-sizing: border-box;
    }


    #cover_title {
        width: 100%;
        float: none;
        text-align: left;
    }

    .cover {
        width: 33%;
        box-sizing: border-box;
    }





    #lineup {
        width: calc(100% - 20PX);
        box-sizing: border-box;
    }


    #cover_info-r {
        width: calc(100% - 320PX);
        box-sizing: border-box;
    }


    /* comingsoon
    ---------------------------------------------------- */
    #comingsoon {
        width: calc(100% - 20PX);
      margin-left:20px;
      margin-right:0;
    }

    #owabi {
        width: calc(100% - 20PX);
      margin-left:20px;
      margin-right:0;
    }




    #special {
        width: calc(100% - 20PX);
      margin-left:20px;
      margin-right:0;
        box-sizing: border-box;
    }

    .special_info {
        width: calc(100% - 20PX);
      margin-left:20px;
      margin-right:0;
    box-sizing: border-box;
    }

    .special_info img{
        width: calc(50% - 3PX);
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }



    #main_footer {
        width: calc(100% - 20PX);
      margin-left:20px;
      margin-right:0;
    }

    #news {
        width: calc(100% - 260PX);
        margin: 0;
    }


    .news-date {
        width: calc(100% - 38PX);
        margin: 10px 10px 10px 10px;
        padding: 0px 10px 0px 0px;
    }


    #works {
        width: 100%;
      margin-left:0;
      margin-right:0;
        box-sizing: border-box;
    }

    .read {
        width: 100%;
        box-sizing: border-box;
    }




    #lineup table{
        width: 100%;
    }

    .bookdetail_txt .video-container{
        margin-left: calc(-320px - 0%);
    }
        
        
        


    }


    @media (max-width: 768px) {


    #header_wrap{
        padding-top: 40px;
    }

    #header {
        background:none;
    }

    #charles_header{
        height: auto;
    }


    #charles_header-l {
        width: 100%;
        margin: 0;
        float: none;
        text-align: center;
        }

    #charles_header-l img{
        width: 90%;
        }

    #charles_header-r {
        width: 100%;
        margin: 0;
        padding: 10px 0;
        float: none;
        text-align: center;
    }

    .title {
        font-size: 120%;
        }

      .header-dropdown {
        position: absolute;
        top: 0;
        z-index: 500;
        width: 100%;
        color: #fff;
      }
      .header-dropdown.affix {
        position: fixed;
      }
        .header-dropdown .dropdown-nav>li {
          border-bottom: 1px solid #fff;
          text-align: center;
        }

        .header-dropdown .dropdown-nav>li.NolinkBtn {
          border-bottom: 1px solid #fff;
          text-align: center;
        background: #ed86b5;
            line-height: 2em;
        }
        .header-dropdown .dropdown-nav li a{
        color: #fff;
        background: #e62e8b;
        }
       .header-dropdown .dropdown-nav li ul{
          border-top: 1px dashed #fff;
        background: #ed86b5;
        }
       .header-dropdown .dropdown-nav li ul li{
          display: block;
        background-color: #e62e8b;
            line-height: 1.2em;
          border-top: 1px dashed #fff;
        }

        .header-dropdown .dropdown-nav a {
          display: block;
          padding: 10px;
        }
        .header-dropdown .btn-dropdown {
          padding-left: 34px;
          font-size: 16px;
          line-height: 1.6;
            color: #fff;
          height:30px;
        background: #ed86b5;

        }
        .header-dropdown .btn-dropdown-close {
        }



    #contents-l {
        display: none;
    }

    #contents-r {
        float: none;
        width: 100%;
        }



    .bnrBox{width: 100%;text-align: center;margin: 0;}    
    .bnrBox li{padding: 10px 0;margin: 0;} 




    h1 {
        width: 100%;
        margin: 20px 0px;
    }

    h2,h3 {
        width: 100%;
        margin: 20px 0px 0px 0;
    }

    .box_center{
        width: 100%;
      margin-left:0;
      margin-right:0;
    }






    /* comingsoon
    ---------------------------------------------------- */
    #comingsoon {
        width: 100%;
      margin-left:0;
      margin-right:0;
    }

    #owabi {
        width: 100%;
      margin-left:0;
      margin-right:0;
    }




    #special {
        width: 100%;
      margin-left:0;
      margin-right:0;
    }

    .special_info {
        width: 100%;
      margin-left:0;
      margin-right:0;
    }

    .special_info img{
        width: calc(50% - 3PX);
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }



    #main_footer {
        width: 100%;
      margin-left:0;
      margin-right:0;
    }

    #news {
        width: 100%;
        margin: 0;
        float: none;
    }


    .news-date {
        width: calc(100% - 38PX);
        margin: 10px 10px 10px 10px;
        padding: 0px 10px 0px 0px;
    }

    #twitter {
        margin: 0px auto;
        float: none;
    }

    .video-container {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
    }
    .video-container iframe {
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
    } 



    #cover_info-l {
        width: 100%;
        margin: 0;
        float: none;
    }

    #cover_info-r {
      width: 100%;
        margin: 20px 0;
        padding: 0px;
        float: none;
    }
        
    .bookdetail_txt .video-container{
        margin-left: 0;
    }
        
    .video_on{
    min-height: inherit;
    }



    }




    @media (max-width: 660px) {
    #lineup td.siteName{
        display: block;
        width: auto;
        float: left;
        box-sizing: border-box;
    }

    #lineup td.siteQR{
        display: block;
        width: auto;
        float: left;
        box-sizing: border-box;
        margin-right: 100px;
    }


    }




    @media (max-width: 600px) {

    .cover {
        width: 50%;
    }


    .cover_top {
        margin: 0px auto;
        width: 150px;
    }


    #lineup td.siteQR{
        margin-right: 0;
    }



    }