@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

/*共通*/
section{
    margin:180px 0;
/*    padding:90px 0;*/
    text-align: center;
}
@media screen and (max-width: 768px) {
section{
    margin:90px 0;
/*    padding:70px 0;*/
    text-align: center;
}
}

.padding_0{
    padding:0px!important;
}

section p{
    font-size: 0.9em;
    font-weight: normal;
}

.text_left{
    text-align: left;
    margin: 0 auto;
}

.text_center{
    text-align: center;
    margin: 0 auto;
}

.slide_section{
    margin-top: 100px;
}

.title_margin{
    /*margin-top: 10px!important;   */
    margin-bottom: 40px!important;
}

.title_margin_20{
    margin-bottom: 20px!important;
}

.title_margin_mini{
    margin-top: 10px!important;
    margin-bottom: 40px!important;
}


.title_margin_30{
    margin-bottom: 30px!important;
}

.title_margin_20{
    margin-bottom: 20px!important;
}

.title_margin_10{
    margin-bottom: 10px!important;
}

.margin_top_90{
    margin-top: 90px!important;
}


.margin_0{
    margin: 0 auto!important;
}

.margin_bottom_0{
    margin-bottom: 0!important;
}

.width_all{
    width:90%;
    max-width: 1000px;
    margin:0 auto;
}

.common_button{
    width: 90%;
    max-width:480px;
    border-radius: 50px;
    margin:0 auto;
    padding:6px 0;
    background:#3bb277;
    border:2px solid #3bb277;
    color: #fff;
    text-align: center;
    display: block;
}

.common_button:hover{
    background:#fff;
    border:2px solid #3bb277;
    color: #3bb277;
}

a{
    opacity: 1;
}

a:hover{
    opacity: 0.7;
}

.pc_none{
    display: block!important;
}

.sp_none{
    display: none!important;
}

@media screen and (max-width: 768px) {
.pc_none{
    display: none!important;;
}
.sp_none{
    display: block!important;;
}
}


/*トップ画像*/
.top_img{
    width:100vw;
   /* background: url(../images/top_img.jpg);*/
    background-position: center;
    display: block;
    
        }

/*キャッチコピー*/
.catchcopy{
    width:100vw;
    background: url(../images/catchcopy_back.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size:80vw;
    text-align: left;
    margin-top: 100px;
    /*background-size: contain;*/
}

.catchcopy_area{
    display: flex;
    width: 100vw;
    flex-direction: row;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    /*flex-wrap:wrap;*/
    margin:0 auto;
}



.catchcopy_contents{
        margin: 120px 10px 40px;
    width:90%;
    max-width: 690px;
    font-size: 0.95em;
}

.catchcopy_contents p{
        margin: 0px 0px 30px;
}

.catchcopy_img{
    display: block;
    text-align: right;
    width: 100%;
    max-width: 340px;
margin: 120px 0px 0;
}

.catchcopy_img_sp{
    width: 100px!important;
}

.catchcopy_under_img{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.catchcopy_under_img .nikoli_character{
    width:70%;
    max-width: 400px;
}

@media screen and (max-width: 1100px) {
.catchcopy_img{
    max-width: 280px;
    margin: 20px 0px 0;
}

    .catchcopy_contents{
        margin: 60px auto 60px;
        width:60vw;
        font-size: 0.8em;
}
    .catchcopy_under_img{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
    .catchcopy_under_img .nikoli_character{
    width:70%;
}
    .catchcopy_under_img .nikoli_nikoli{
    width:25%;
}
}


.catchcopy_text_img{
    width: 100%;
}



@media screen and (max-width: 768px) {
.catchcopy{
    width:100vw;
    margin:50px auto 0;
    background-position:0px 14px;
    background-size: 100vw;
}
    
    .catchcopy_contents p {
    margin: 0px 0px 30px;
    width: 60vw;
        font-size: 1em;
}
    
.catchcopy_area{
    align-items: center;
   /* flex-direction: column;*/
    width:100vw;
    padding-left: 10px;
    justify-content:flex-start;
}
    
    .catchcopy_contents p{
        margin: 0px 0px 10px;
/*         width:  75vw;*/
}
    
    .catchcopy_contents img{
        width:100%;
    }
    .catchcopy_under_img{
    display: flex;
        /*flex-direction: column;*/
       align-items: flex-end;
        width:  75vw;
    }
    .catchcopy_under_img img{
    width:80%;
        object-fit: contain;
    }
    .nikoli_logo{
      width:25%!important;
    /*margin-top: 16px;*/
    }
    .catchcopy_img{
        width:70vw;
        padding-left: 10px;
    }
}

/*スライドショー*/
.slideshow { margin: 0 0 50px;}

.slideshow div{ margin:0 auto;width:100%;}
.slideshow a{ margin:0 auto;width:96%;display: inline-block;}
.slideshow img { width: 100%; height: auto;display: inline-block;}
.slideshow .slick-next { display: none!important;}
.slideshow .slick-prev { display: none!important;}
/* Dots */
.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -45px;

    display: block;

    width: 96%;
    padding: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 24px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 40px;
    height: 40px;

    content: '●';
    text-align: center;

    opacity: .25;
    -ms-filter: "alpha(opacity=25)";  /* ie 8 */
    filter: alpha(opacity=25);        /* ie lt 8 */
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -ms-filter: "alpha(opacity=25)";
    filter: alpha(opacity=25);        /* ie lt 8 */
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    -ms-filter: "alpha(opacity=75)";  /* ie 8 */
    filter: alpha(opacity=70);        /* ie lt 8 */
    color: black;
}

/*新刊案内*/
.newbook_area{
    width: 100%;
    max-width: 1200px;
/*    background: #f5f5f5;*/
/*    display: flex;*/
    text-align: left;
    justify-content: center;
    margin:0 auto;
    padding-bottom: 4px;
}

.newbook_area_box{
width: 98%;
 margin:1% 0.5%;
    padding-top:2%;
    background: #fff;
    max-width: 300px;
    display: block;
}

.newbook_area_box img{
    width: 98%;
    max-width: 200px;
    margin:0 auto 2%;
    background: #fff;
    text-align: center;
    display: block;
}

.newbook_area_day{
    background: #3bb277;
    margin:4% 5% 2%;
    padding:0 2%;
    color: #fff;
        display: inline-block;
    font-size: 0.8em;
    
}
.newbook_area p{
    margin:0 5%;
    padding:0;
    height:100px;
}

@media screen and (max-width: 768px) {
    .newbook_area{
    flex-wrap: wrap;
    }
    .newbook_area_box{
        width:98%;
        max-width: none;
    }
}

/*ニコリの新サービス*/
.newservice_area{
    width: 100%;
    max-width: 1000px;
    margin:auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.newservice_area_box{
    width: 48%;
 margin:1% 1% 4%;
    padding:1%;
    /*background: #fff;*/
}

.newservice_area_box img{
    width: 100%;
    margin:0 auto 2%;
    background: #fff;
    text-align: center;
    display: inline-block;
}

.newservice_area_box p{
    width: 100%;
 margin:1% auto;
    padding:0%;
    background: none;
    text-align: left;
    color: #333;
    font-size: 0.9em;
}

.newservice_area_box .more{
    width: auto;
    margin-top: 4%;
    display: inline-block;
}


@media screen and (max-width: 768px) {
.newservice_area_box{
    width:95%;
    margin:1% 1% 60px;
}
}
    
/*企業の方へ*/
.company_area{
    width: 100%;
   /* height: 400px;*/
    background: url(../images/back_company_g.jpg);
    background-size: cover;
    margin: auto;
    display: flex;
    justify-content: space-evenly;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    padding-top: 60px;
    padding-bottom: 40px;
    opacity: 1;
}

.company_area h3{
color: #fff;
}

.company_area a{
    font-size: 1.2em;
}
@media screen and (max-width: 768px) {
.company_area a{
    font-size: 1em;
}

}

    
.company_area p{
    width:100%;
    max-width: 1000px;
    padding: 1%;
    margin-top: 34px;
    text-align: left;
    color: #fff;
}


@media screen and (max-width: 768px) {
    .company_area img{
        width:95vw;
    }
    .company_area p{
        width:92vw;
    }
}

/*メディア掲載、お知らせ*/
.article_area,.media_area{
    width:100%;
    background:#f5f5f5 ;
    padding:1%;
}

.article_area ul,.media_area ul{
    background: #fff;
    padding:1% 2%;
    margin:0 auto;
    width:100%;
    max-width: 1000px;
    list-style-type: none;
    text-align: left;
}

.article_area ul li,.media_area ul li{
    padding:0.75% 0;
}

.article_area ul li span,.media_area ul li span{
    display: table-cell;
}

.the_time{
    width:180px;
}

@media screen and (max-width: 768px) {
    .article_area ul li span,.media_area ul li span {
        display: block;
    }
    .article_area ul li {
    margin-bottom: 10px;
}
    .media_area ul{
    width: 98%;
}
}

.media_area{
    width:100%;
    background:none ;
}

.media_area ul{
    padding: 0;
}

.media_area ul li{
    border:1px #3bb277 solid;
    border-bottom: 0px;
    padding: 2% 4%;
}

.media_area ul li:last-child{
    border-bottom:1px #3bb277 solid;
}

.article_area ul li a,.media_area ul li a{
   color: #3bb277;
}

/*.article_area ul li a{
   font-weight: bold;
}*/

/*sns*/
.sns_area{
    width: 100%;
    margin:auto;
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
}

.sns_area a{
    width:33.333333333333%
}

.sns_area img{
  width:100%;
}

.sns_area_under{
    max-width: 890px;
    justify-content:center;
}

.sns_2_area{
    max-width: 800px;
}

.sns_area_under img{
    width:auto;
    height:100px;
    padding:10px;
}

 .sns_2_sp img{
        padding: 6px;
    }

@media screen and (max-width: 768px) {
    .sns_area{
     flex-direction:row;
    }
    .sns_area a{
    width:100%
}
    .sns_area a{
    width:33.333333%
}
    .sns_area_under img{
    width:100%;
    height:auto;
    padding:0px;
}
    
   
}

    


/*footer*/
.footer_area{
    background: #3bb277;
    padding:60px 0;
    text-align: center;
    color: #fff;
    font-size: 0.9em;
}

.footer_area a{
    color: #fff!important;
}

.footer_area ul{
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding:0;
}

.footer_area ul li{
    padding:10px;
    list-style: none;
}
@media screen and (max-width: 768px) {
.footer_area ul{
    display: flex;
    flex-direction: row;
    padding: 0;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
}
}


/*下層ページ*/
.entry-content{
    font-size: 0.8em;
   /* padding: 0 20px;*/
    width: 92vw;
    max-width: 1000px;
}

.publication_img{
    width:220px;
    margin:0 10px 20px 0px!important;
    float: left!important;
}
@media screen and (max-width: 768px) {
.publication_img{
    width:80%;
    margin:0% 10% 20px!important;
}
}


.sub_frame {
    width: 46%;
    float: left;
    /* margin-left: 4px; */
    margin:0 2%;
    margin-top: 1em;
    font-size:inherit;
    /* margin: 0 auto; */
    text-align:center;
    margin-bottom: 1em;
}

.sub_frame
.sub_img {
    float:none;
}

/*ボタン*/
button, input[type="submit"], input[type="button"], input[type="reset"],
.post_link a,
.contact_button{
    background: #fff;
    /* border-radius: 2px; */
    color: #333;
    display: inline-block;
    padding: 7px 12px 9px;
    text-decoration: none;
    margin: 12px 0px;
    border: 1px solid #333;
    display: block;
    opacity: 1;
}

button:hover,
button:focus,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
.post_link a:hover,
.post_link a:focus,
.contact_button:hover,
.contact_button:focus{
	background: #fff; /* Old browsers */
    border: 1px solid #333;
    opacity: 0.6;
}

button:active,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
.post_link a:active,.contact_button:active{
	opacity: 0.6;
}

@media screen and (max-width: 768px) {
button {
   margin: 12px auto;
}
}

.contact_button{
    display: table;
    margin-left:auto;
    margin-right:auto;
    color: #333!important;
}

.orange_button{
        background: #de541d!important;
    border-radius: 50px;
    color: #fff!important;
    border: 1px solid #de541d!important;
    padding:12px;
    padding-left:60px;
    padding-right:60px;
    display: block;
    /*font-weight: bold;*/
}

.orange_button:hover,
.orange_button:focus,
.orange_button:active{
        background: #fff!important;
    /* border-radius: 2px; */
    color: #de541d!important;
    border: 1px solid #de541d!important;
    opacity: 1!important;
}

.orange_text_button{
    background: #fff!important;
    /* border-radius: 2px; */
    color: #de541d!important;
    border: 1px solid #de541d!important;
    display: block;
}

.orange_text_button:hover,
.orange_text_button:focus,
.orange_text_button:active{
        background: #de541d!important;
    /* border-radius: 2px; */
    color: #fff!important;
    border: 1px solid #fff!important;
    opacity: 1!important;
}

.white_border{
    border: 1px solid #fff!important;
}

.white_border:hover,
.white_border:focus,
.white_border:active{
    border: 1px solid #fff!important;
}

.white_button{
        background: none!important;
    /* border-radius: 2px; */
    color: #fff!important;
    border: 1px solid #fff!important;
    padding-left:40px;
    padding-right:40px;
    display: block;
    /*font-weight: bold;*/
    border-radius: 50px;
}

.white_button:hover,
.white_button:focus,
.white_button:active{
        background: #3bb277!important;
    /* border-radius: 2px; */
    color: #fff!important;
    border: 1px solid #fff!important;
    opacity: 1!important;
}



.button_bigtext{
    font-size: 1.5em!important;
}

@media screen and (max-width: 768px) {
.button_bigtext{
    font-size: 1.25em!important;
}
    .orange_button{
    padding-left:20px;
    padding-right:20px;

}

    
}

.entry-content button {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.text_left button{
    margin-left: 0;
}


@media screen and (max-width: 768px) {
.text_left button{
    margin-left: auto;
}
}

.widget {
    display: flex;
    justify-content: space-around;
    align-content: center;
    flex-wrap: wrap;
        align-items: stretch;
}

.widget button {
    width:24%;
    padding:12px 0;
    font-size: 1.2em;
    margin: 10px 0 0 0;
}
@media screen and (max-width: 768px) {
    .widget {
    justify-content: space-between;
    }
    
.widget button {
    width:100%;
    font-size: 1em;
    margin: 2% 0 0 0;
}
}



.book_list_img {
    width: 180px;
/*    margin: 5px;*/
    margin-top: 10px;
/*    margin-right: 10px;*/
/*
    padding: 10px 5px;
     background:rgba(59,178,119,0.2);
*/
}


.book_list_img img{
    width:180px;
}

.book_list_img .alignleft{
    width:100px;
}


.book_list_frame {
    font-size:inherit;
    width: 49%;
    float: left;
    border-bottom: 0px #3bb277 solid;
    margin: 60px 0% 0px;
    display: flex;
}

.book_list_title{
    margin-bottom: 0px;
}

.book_list_title a {
    border: none;
    color: #333;
    padding: 0px 0px 0px;
    border-radius: 0px;
    font-weight: bold;
    border-bottom: 0px #333 solid;
    text-align: left;
/*    background: url(../images/bg-line.png) no-repeat bottom;
	background-size:120px;
	padding-bottom: 20px;*/
    font-size: 1em;
    display:inline-block;
    font-weight: 500;
}
.book_list_title a:hover{
    color:#333!important;
    opacity: 1;
}


.book_list_title a{
    
}

.book_list_desc a {
    background: #fff;
    /* border-radius: 2px; */
    color: #333;
    display: inline-block;
    padding: 7px 24px 9px;
    text-decoration: none;
    margin: 4px 4px;
    border: 1px solid #333;
    display: inline-block;
    opacity: 1;
}
.book_list_desc a:hover{
    color:#333!important;
    opacity: 1;
}

.book_list_frame b{
    font-weight: 400;
    font-size: 0.9em;
}

.book_list_img img{
    margin-top: 16px;
    margin-bottom: 8px;
}

.book_list_explanation {
    /*padding-top:12px;*/
    font-size: 1em;
    padding:8px 14px 10px;
    margin-top: 10px;
    background:#f5f5f5;
/*    background-color: rgba(59,178,119,0.2);*/
    display: flow-root;}

.book_list_desc{
    text-align: center;
}

@media screen and (max-width: 768px) {
    .book_list_title a {
    font-size: 1.1em;
    }
    
.book_list_frame {
    width:100%;
    /*flex-direction: column;*/
}
    .book_list_img{
        width:100%;
        padding: 15px 0px 15px 0px;
    }
    .book_list_img img{
    width:100%;
        max-width: 180px;
    margin: 0 auto;
    display: block;
}
}

.sub_img img{
    width:180px;
}

.book_list_img button{
    margin: 10px auto;
}

@media screen and (max-width: 768px) {
    .sub_frame{
        width: 100%;
        margin:1em 0;
    }
}

.alignleft{
    float:none;
}

figure.wp-caption.alignleft, img.alignleft {
    margin: 8px 4px;
}

.entry-content img.alignleft, .entry-content .wp-caption.alignleft{
    padding: 0px 2px 0 2px;
    display: inline-block;
}

.book_list_img
img.alignleft{
    margin: 4px auto;
        display: inline-block;
    text-align: center;
}


@media screen and (max-width: 768px) {
    .entry-content img.alignleft, .entry-content .wp-caption.alignleft {
    margin: 4px auto;
    padding: 0px;
    display: block;
}
}

.book_list_frame_all{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: stretch;
}

.book_list_center{
    justify-content: center;
}


.book_list_frame_all .book_list_title{
    text-align: left;
    padding: 0px 0px 0px 0px;
}

.book_list_title{
    font-size: 1.5em;
text-align: left;
    font-weight: 500;
    padding:0;
}

.book_list_frame_all 
.book_list_desc{
    text-align: left;
}

.book_list_frame_all 
img.alignleft.size-full{
    margin:4px;
}

.book_list_frame_all .book_list_explanation{
    font-size: 0.9em;
    display: block;
    /*width: 295px;*/
}

@media screen and (max-width: 768px) {
    .book_list_frame_all .book_list_explanation{
    width: 100%;
/*
    padding-left: 0;
        padding-right: 0;
*/
}
}

.book_list_frame_all .book_list_desc a{
    padding: 4px 12px 6px;
}

.book_list_frame_all .book_list_desc a:hover,
.book_list_frame_all .book_list_title a:hover{
    opacity: 0.6;
}

@media screen and (max-width: 768px) {
.four_split_book_frame,.fresh_book_frame,.kigaruni_book_frame{
    width: 100%;
    margin:1em auto;
}
}

.font_normal{
    font-size: 1em;
    font-weight: 400;
}

/*本調整用*/
.book_flex{
    display: flex;
    align-items: stretch;
    width: 100%;
}

.black_border{
    border: 1px solid #ddd;
    margin: 0 -2px 0 0;  
    padding:1.5em;
}

.book_flex_img{
    width: 30%;
    text-align: center;
}

.book_flex_img img{
    height: 250px;
    object-fit: contain;
}


.book_flex_text{
    width: 70%;
}

.book_flex_img a{
    display: inline;
    margin: 0 auto;
}


.book_list_frame_all .black_border{
    padding:0.5em;
}

.book_list_frame_all .book_list_explanation {
    padding:1em;
}



.book_list_frame_all .book_flex_img{
    width: 40%;
    text-align: center;
    display: flex;
    align-items: center;
}

.flex_start{
    align-items: flex-start!important;
}


.book_list_frame_all .book_flex_text{
    width: 60%;
}



@media screen and (max-width: 768px) {
    .book_flex{
    display: flex;
    align-items: stretch;
}
    
.book_flex_img{
    width: 45%!important;
/*    height:400px;*/
}

.book_flex_text{
    width: 55%!important;
}
    .black_border{
        padding: 1em;
}

    .book_flex_img{
        padding: 0.5em;
    }
    
    .book_flex_img img{
        height: 100%;
        width: auto;
        
    }
    
}




/*記事ページ*/
.article_area ul{
padding: 2% 3%;
    
}

@media screen and (max-width: 768px) {
.article_area{
    padding:3%;
}
}

.taxonomy_list{
display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

@media screen and (max-width: 768px) {
.taxonomy_list{
justify-content: center;
}
}

.taxonomy_list li{
margin:0 0.25em;
    padding:0.25%;
}

.entry-title{
    color: #333;
    font-weight: normal;
    background: url(../images/bg-line.png) no-repeat bottom;
	background-size:120px;
	padding-bottom: 18px;
    display:inline-block;
    font-weight: 500;
    width:100%;
    line-height: 1.5;
    text-align: center;
    font-size: 1.5em;
}

.content_margin{
    margin: 50px auto 80px;
}

.post_link{
    width:96vw;
    max-width: 1000px;
    margin:0 auto;
    display: flex;
    margin-top: 60px;
}

.post_link div{
    width:33.333%;
}

.post_link .left{
    display: block;
    text-align: left;
}

.post_link .center{
    display: block;
    text-align: center;
}

.post_link .right{
    display: block;
    text-align: right;
}

.post_link a{
    margin:0;
    font-size: 0.8em;
    display: inline-block;
}

@media screen and (max-width: 768px) {
.post_link {
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    max-width: 300px;
}
    .post_link div{
        width: 100%;
        margin: 0 0 -1px;  
    }
    .post_link a{
        width: 100%;
        text-align: center;
    }
}

.entry-header{
    /*margin-bottom: 0px;*/
    /*text-align: center;*/
}
@media screen and (max-width: 768px) {
    .entry-header{
    text-align: left;
}
    .entry-title{
/*        text-align: left;*/
    }
}

.margin-bottom{
    margin-bottom:60px;
}

.margin-bottom2{
    margin-bottom:80px;
}

/*パズルのルール*/

#word_p,#pick_p{
    margin-top: 100px!important;
}

.p_midashi{
    font-weight: 500;
    /*font-size: 1.5em;*/
    margin:20px auto 20px;
    padding-bottom: 14px;
}

.space{
    margin-bottom: 24px;
}



.np_top_img,.np_top_img_half{
    height:270px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 6px;
}

.book_list_frame_all .book_list_title{
}

@media screen and (max-width: 768px) {
.np_top_img,.np_top_img_half{
    float:none;
    width:100%;
}
}

.np_top_img br,.np_top_img_half br{
   display: none;
}

.np_top_img img,.np_top_img_half img,.puzzles_img img{
height: 200px;
    width: auto;
    object-fit: cover;
}

.puzzle_size_auto{
    height: auto!important;
    width: auto!important;
}

.puzzles_img_wrap{
    text-align: center;
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}

.puzzles_img_wrap p{
margin:0 auto;
}

@media screen and (max-width: 768px) {
.puzzles_img_wrap{
    flex-direction: column;
}
.puzzles_img_wrap .puzzles_img{
    margin: 20px auto;
}
}

.np_top_img,.np_top_img_half,.puzzles_img_wrap{
   background-color: rgba(59,178,119,0.2);
    font-size: 1.2em;
}

.arconix-toggle-wrap{
    border-radius: 0px;
    background: #fff;
    color: #333;
    border: 1px solid #333;
    margin: 10px 0;
    padding: 5px 10px;
    width:99%;
}
@media screen and (max-width: 768px) {
.arconix-toggle-wrap{
    width:100%
}
}

.arconix-toggle-title,.arconix-toggle-content {
    font-size: 0.9em;
}

.arconix-toggle-content{
    padding:0.2em;
    margin:0 auto;
}

/*パズル詳細ページ*/
.entry-content hr{
    margin:60px 0;
}

.entry-content img{
    margin:0 auto;
    display: block;
    object-fit: contain;
}

.puzzle_note_btn {
     font-size: 1em;
     float: right; 
    display: flex;
}

@media screen and (max-width: 768px) {
    .puzzle_note_btn { 
    display: flex;
        flex-direction: column;
        float: none; 
}
}

.puzzle_note_btn button{
     margin:0 5px;
}


.entry-content p{
  margin:1em 0;
}

.entry-content .explan{
  margin:0.5em auto;
    display: table;
    border: 1px solid #999;
    padding: 0.5em 1em;
}


.entry-content .explan div{
    border: 0px solid #666!important;
    padding: 0em;
}


.entry-content .explan p{
  margin:0;
}


.book_list_img button{
    font-size: 0.9em;
}



/*会社概要*/

.table_line_on td{
    text-align: center;
}
@media screen and (max-width: 768px) {
    .table_line_on td{
    font-size: 0.9em;
}
}

.contact_center{
    text-align: center;
}
@media screen and (max-width: 768px) {
    .contact_center{
    text-align: left;
}
}

/*コンタクトフォーム*/
.mandatory{
    display: inline;
    padding: 0 6px;
    margin:0 0 4px 4px;
    font-size: 0.8em;
           background: #e05d22!important;
    /* border-radius: 2px; */
    color: #fff!important;
    border: 1px solid #e05d22!important;
    font-weight: bold;
}

input,select, textarea{
    margin-top: 4px;
    padding: 8px 8px;
    width: 100%;
    max-width: 500px
}

.contact_area{
    width: 100%;
    max-width: 500px;
    margin:30px auto 0;
}

.orange_text_contact{
    font-size: 1.5em;
    max-width: 300px;
    margin: 20px auto!important;
    text-align: center;
}

.check{
    transform:		scale(1.4);
}

.wpcf7-list-item{
    margin:0 auto;
    text-align: center;
}

/*企業の方へ*/
.business_content{
    text-align: center;
    /*font-size: 0.9em;*/
}

@media screen and (max-width: 768px) {
    .business_content{
    text-align: left!important; 
}
}

.business_button_area{
    margin:20px auto;
}

.business_button_area button{
    margin:20px auto;
}

.business_button_width{
    width: 100%;
    max-width: 570px;
}

.ordermade_img{
    display: flex;
    margin:60px auto;
}
.ordermade_img .jiturei{
    width: 60%;
    object-fit: contain;
}
.ordermade_img .kaden_plus{
    width: 35%;
    object-fit: contain;
}
@media screen and (max-width: 768px) {
.ordermade_img{
    display: flex;
    flex-direction: column;
}
.ordermade_img .jiturei{
    width: 100%;
}
    
.ordermade_img .kaden_plus{
    width: 60%;
}
}

.qa_area_all{
list-style-type: none;
    padding:0;
}
 
.qa_area_all li{
   margin-top: 30px; 
margin-bottom: 40px;
}  

.qa_area{
    display: flex;
    margin:10px 0;
}

.circle_icon{
	font-size: 1.2em;
	margin: 0 0.5em 0 0;
	color: #ffffff;
	border-radius: 50%;
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 1em;
    padding-bottom: 0.2em;
	content: 'Q';
	background: #3bb277;
    border: 2px solid #3bb277;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.circle_icon_a {
	
	content: 'A';
	background: #fff;
    color: #3bb277;
}

.qa_area span{
    width: calc(95% - 40px);
    padding-top: 0.2em;
    display: block;
}

.cp_qa dt{
    font-weight: 500;
}

.puzzle_scroll{
    width:100%;
    max-width: 100%;
    padding:30px 0;
}

.slider_r div div img,.slider_l div div img{
    object-fit: contain;
/*    height:200px;*/
    padding:5px;
}

.sales_title{
    margin: 0px 0 40px!important;
}


.puzzle_scroll_title{
    	background: none!important;
	background-size:0!important;
	padding-bottom: 0px!important;
}

.achieve_list_1st{
margin:60px auto 40px;
    text-align: center;
}

.achieve_list{
margin:20px auto 60px;
     text-align: center;
}

.achieve_list ul{
display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    padding:0;
    margin:10px 0 ;
}

.achieve_list ul li{
margin: 5px 10px;
    list-style: none;
}

.margin_ad{
 margin-top: 80px!important;
}



@media screen and (max-width: 768px) {
    .pg_b_frame{
        width:99%;
    }
.pg_b_img{
    float: none;
}
}


/*企業の方へ-新*/
.puzzle_top_img{
    width: 100vw;
    height: calc(100vh - 70px);
    margin-top: 70px;
    max-height: 900px;
    /*height:100vh;*/
    position: relative;
    background: url("../images/sales_img.jpg");
    background-position: center;
    background-size: cover;
}


.scrolldown{
    position: absolute;
    right: 0px;
    bottom: 0;
    background: #fff;
    border-top-left-radius: 30px;
    width: 100px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding:60px 30px;
    
}

.scrolldown img{
    width: 20px;
    object-fit: contain;
}
    
.puzzle_top_img .puzzle_catchcopy_box{
    width: 65vw;
    padding:60px 0;
    background: #fff;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    position: absolute;
    display: flex;
    justify-content: center;
    bottom:-120px;
}

.puzzle_catchcopy_text{
    width: 63%;
    margin-left:27%;
    margin-right:10%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.green_text{
    color: #189648;
}



.green_section{
    background: #038735;
    display: flex;
    padding: 230px 0;
}

.green_section .puzzle_second_img{
    background: url("../images/order_made.png");
    background-size: cover;
    background-position: right;
    width: 80vw;
    max-width: 1000px;
    height:500px;
    border-radius: 20px;
    margin: auto;
}

.green_section_re{
    position: relative;
    width: 100vw;
}
    
.green_section .puzzle_catchcopy_box{
    width: 65vw;
    /*height:450px;*/
    background: #fff;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    position: absolute;
    display: flex;
    justify-content: center;
    bottom:-130px;
    right: -100px;
}


.green_section .puzzle_second_img .puzzle_catchcopy_text{
    width: 60%;
    margin-left:2%;
    margin-right:30%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding:60px 0;
}

.puzzle_catchcopy_box p{
    margin:0;
}


.green_section_order{
    background: #038735;
    padding:0 0 140px 0;
    text-align: center;
}

.puzzle_catchcopy_list{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    max-width: 1000px;
    margin:0 auto;
    margin-bottom: 60px;
}

.puzzle_catchcopy_list img{
    width: 32%;
    object-fit: contain;
}

@media screen and (max-width: 768px) {
    .puzzle_catchcopy_list{
    align-items: center;
    flex-direction: column;
}

.puzzle_catchcopy_list img{
    width: 100%;
    object-fit: contain;
    margin-bottom: 14px;
}
     .green_section_order{
       padding:0 5% 70px;
    }
    
}

.white_line{
    color: #fff;
    margin:0px 0 0px;
    font-weight: 500;
    border-bottom: 1px #de541d solid;
    padding-bottom: 3px;
    display: inline-block;
    font-size: 0.8em;
}

.white_line p{
    margin: 0 auto;
}

.green_section_order h4{
    color: #fff;
}

.button_weight{
    font-size: 1.25em;
}

.under_text{
    margin:70px auto 40px;
    font-size: 1.3em;
    font-weight: 500;
}


.orange_text{
    color: #de541d;
}

.puzzle_sample{
    margin:115px 0 93px;
    text-align: left;
}

.puzzle_sample_second{
    margin:93px 0 93px;
    text-align: left;
}

.puzzle_sample_third{
    margin:93px 0 53px;
    text-align: left;
}

.puzzle_sample_list{
    margin-top:23px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: auto;
}

.puzzle_sample_list img{
    width:13%;
    height: auto;
    align-self: flex-start;
}


@media screen and (max-width: 767px) {
.puzzle_sample{
    margin:40px 0 60px;
    text-align: left;
}
.button_weight{
    font-size: 1.1em;
}
}
    

.orange_section{
    background: #de541d;
    color: #fff;
    padding:110px 0;
/*    border:1px #000 solid;*/
    border-left: none;
    border-right:none;
}

.orange_text{
    
}

.actual_list{
    width:100%;
    max-width: 1000px;
    margin:0 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.actual_list div{
    width:48%;
    margin:0.5%;
    font-size: 0.88em;
    text-align: left;
    margin-bottom: 60px;
}
.actual_list img{
    width:100%;
    margin-bottom: 6px;
    position: relative;
    display: block;
}
.actual_list_re{
    width: 100%!important;
    position: relative;
    display: block;
    margin-bottom: 0px!important;
}
.actual_list span{
    width:320px;
    height:80px;
   position: absolute;
    bottom:0;
    left: 0;
    background: #fff;
    display: flex;
    align-items: center;
        border-top-right-radius: 10px;
}

@media screen and (max-width: 1023px) {
.puzzle_top_img{
margin-top:0;
    }
}

@media screen and (max-width: 767px) {
.puzzle_top_img{
    width: 100vw;
    height: 350px;
    max-height: 900px;
    
    /*height:100vh;*/
    position: relative;
    background: url("../images/sales_img.jpg");
    background-position: center;
    background-size: cover;
}
    .scrolldown{
        display: none;
    }
    
    .puzzle_top_img .puzzle_catchcopy_box {
    width: 95vw;
    padding: 60px 0;
    background: #fff;
    position: absolute;
    display: flex;
    justify-content: center;
    bottom: -400px;
}
    .puzzle_catchcopy_text {
    width: 80%;
    margin-left: 0%;
    margin-right: 5%;
}
    
    .green_section {
    padding: 230px 0;
        padding-top: 500px;
}
    
    .green_section .puzzle_second_img{
       width: 90vw;
        height:300px;
        
    }
    
    .green_section .puzzle_catchcopy_box {
    width: 90vw;
    /* height: 450px; */
    position: absolute;
    bottom: -360px;
    right: 0px;
}
    
    .green_section .puzzle_second_img .puzzle_catchcopy_text {
    width: 80%;
    margin-left: 0%;
    margin-right: 0%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 60px 0;
}
    
    .green_section_order{
        padding-top: 250px;
    }
    
    .puzzle_catchcopy_box,.puzzle_catchcopy_box{
        font-size: 0.8em;
    }
    
    .actual_list{
        flex-direction: column;
        align-items: center;
    }
    .actual_list div {
    width: 98%;
    margin-bottom: 60px;
}

}






/*新刊案内*/
.gray_section{
    background-color: #f5f5f5;
    padding:90px 0;
}

/*FAQ*/

.question_box_first{
    margin-top:80px!important;
}

.question_box{
    margin:60px auto;
    width: 98%;
    max-width: 980px;
    text-align: left;
}

.question_area{
    border:1px #189648 solid;
    padding:0.8em;
    display: flex;
    align-content: center;
    align-items: center;
}

.question_area img{
    width: 46px;
    margin: 0 1em 0 0;
    display: inline;
}

/*英語ページ*/
.inline-block{
    display: inline-block!important;
}

.puzzle_list_en{
    display: flex;
    justify-content: space-evenly;
    align-content: center;
    align-items: center;
    width:100%;
    max-width: 900px;
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
    margin:2em auto 1em;
}

.puzzle_list_en div{
    width:15%;
    margin-bottom: 1.5em;
}
.puzzle_list_en img{
    width:100%;
}

.puzzle_list_en_img{
    width:31.333%!important;
}

@media screen and (max-width: 768px) {
    .puzzle_list_en div{
    width:45%;
    margin-bottom: 1em;
}
    .puzzle_list_en_img{
    width:90%!important;
        max-width: 350px;
}
}

.puzzle_list_text_en{
    display: flex;
    justify-content: flex-start;
    width:100%;
    max-width: 900px;
    margin:0 auto;
    font-size: 1em;
    flex-direction: row;
    flex-wrap: wrap;
}

.puzzle_list_text_en li{
    width:17%;
    margin-left: 3%;
}

@media screen and (max-width: 768px) {
.puzzle_list_text_en li{
    width:46%;
    margin-left: 3%;
}
}

.hand_made_img{
    margin:0 auto;
    text-align: center;
}

.hand_made_img img{
    margin:0 2% 1em;
    display: inline-block;
}

@media screen and (max-width: 768px) {
.hand_made_img img{
    width: 45%;
}
}

.slideshow_book_img{
    width: 100%;
}







/*数独ページ*/
.suudoku_area{
    width: 100%;
    max-width: 1200px;
/*    background: #f5f5f5;*/
    display: flex;
    text-align: left;
    justify-content: center;
    margin:0 auto;
}

.suudoku_list{
    display: flex;
    width: 100%;
    /*max-width: 850px;*/
    margin:0 auto;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}

.suudoku_list img{
    width: 200px;
}

.suudoku_list p{
    margin:0 ;
}

@media screen and (max-width: 768px) {
    .suudoku_area{
    width: 100%;
    max-width: 1200px;
/*    background: #f5f5f5;*/
    display: flex;
 flex-direction: row;
    flex-wrap: wrap;
}
    
.suudoku_list{
    flex-direction: column;
}
    .suudoku_list p{
    width: 100%;
}
    .suudoku_area .newbook_area_box {
    width: 48%;
    max-width: none;
}
    
}

.faq_img{
    display: inline-block!important;
    margin: 0 6px!important;
}
@media screen and (max-width: 768px) {
    .faq_img{
    margin: 6px!important;
}
    }