#slider {
    padding: 0;
    margin: 0;
}

.slide {
    padding: 0;
    margin-bottom: 0;
}

.cl {
    clear: both;

}

.top_l {
    border-bottom: solid 1px #eee;
    margin: 50px 0px;
}


.t-r{text-align: right}
.section {
    overflow: hidden;
}

.tag_new {
    display: inline-block;
    padding: 5px 8px;
    border-radius: 3px;
    background-color: #ff0000;
    color: #fff;
    vertical-align: middle;
    font-weight: 600;
    font-size: 1.3rem;
    line-height: 1.3;
    margin-bottom: 5px;
    font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}

.panel {
    /*	height:600px;*/
    width: 100%;
    margin: 0 auto;
}


.panel h3 {
    font-size: 1.6em;
    margin: 0px 5px 10px 5px;
}

.panel h4 {
    font-size: 1.2em;
}


.panel table a {
    color: #6699CC;
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

.panel table a:active,
.panel table a:hover {
    outline-width: 0
}


.panel table a:focus,
.panel table a:active,
.panel table a:hover {

    text-decoration: underline;
    opacity: 0.6;
}


/*------------------ 絵本詳細　-----------------------*/
#coll .kakomi{border: solid 1px #ccc; width: 60px;}

.img-book {
    width: 85%;
}

.img-books {
    width: 90%;
}

#coll dl {
    margin: 20px 0;
}


#coll p {
    margin: 20px 0;
}

#coll dl dt {
    width: 70%;
    /*	height:600px;*/
    overflow: hidden;
    float: left;
    display: block;
}

#coll dl dt img {}

#coll dl dd {
    width: 30%;
    float: right;
}

#coll_s {
    margin: 20px 0;
}

#coll_s dl dt {
    width: 80%;
    /*	height:600px;*/
    overflow: hidden;
    float: left;
    display: block;
}


#coll_s dl dd {
    width: 20%;
    float: right;
}

#coll_s p {
    line-height: 1.6;
    margin: 15px 0;
}




#coll .line {
    border-top: solid 1px #eee;
    padding: 20px 0;
}

#coll table {
    font-size: 95%;
    width: 100%;
    /*	color:#aaa;*/
    color: #666666;
}

#coll table th {
    /*	font-weight:bold;*/
    font-weight: normal;
    text-align: left;
    width: auto;
    border-bottom: solid 1px #efefef;
    padding: 8px 0px;
}

#coll table td {
    padding-top: 2px;
    padding-bottom: 2px;
    line-height: 120%;
    width: auto;
    vertical-align: middle;
    border-bottom: solid 1px #efefef;
    padding: 8px 0px;
}

.no-line {
    border-bottom: solid 1px #fff;
}


#coll table ul li a{
    float: left;
    margin: 0 1px 0 0;
    display: block;
}

#coll table ul li img {
    border: solid 2px #fff;
    
}

#coll table ul li a:hover img {
    border: solid 2px #eee;
    
}

#coll table ul li a:focus img,
#coll table ul li a:active img {
    border: solid 2px #79503A;
}


#coll .btn-gray {
    display: block;
    height: 45px;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    margin: 10px 10px;
    border: 1px solid #666;
    transition: .4s;
    background: #4D4D4D;
    color: #fff;
}


#coll .btn-gray:hover {
    background: #8F8F8F;
    color: #ffffff;
}


#coll .btn-kau {
    display: block;
    height: 45px;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    margin: 10px 10px;
    border: 1px solid #d4c389;
    transition: .4s;
    background: #d4c389;
    color: #fff;
}


#coll .btn-kau:hover {
    background: #4D4D4D;
    color: #fff;
}


@media screen and (max-width:960px) {

    .img-book {
        width: 80%;
    }

    #coll_s dl dt {
        width: 100%;
    }

 
     #coll dl dt {
        width: 100%;
        /*	height:600px;*/
        overflow: hidden;
        text-align: center;
        display: block;
    }

    #coll dl dd {
        width: 100%;
    }  
    
    .panel h3 {
        font-size: 1.6em;
        margin: 0px 5px 10px 5px;
    }

    .panel h4 {
        font-size: 1.3em;
    }
}


/*------------------ 絵本紹介　-----------------------*/
#coll_list .kakomi{border: solid 1px #ccc; width: 60px;}

#coll_list .btn-kau {
    display: block;
    height: 45px;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    margin: 10px 30px;
    padding: 10px 20px;
    border: 1px solid #d4c389;
    transition: .4s;
    background: #d4c389;
    color: #fff;
}


#coll_list .btn-kau :hover {
    background: #4D4D4D;
    color: #fff;
}


#coll_list .btn  {
    padding: 10px 10px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    margin: 10px 30px;
    border: 1px solid #d4c389;
    transition: .4s;
    background: #d4c389;
    color: #fff;

}



#coll_list dl {
    margin: 20px auto;
}


#coll_list p {
    line-height: 1.6;
    margin: 20px 0;
}

#coll_list dl dt {
    width: 50%;
    /*	height:600px;*/
    overflow: hidden;
    float: left;
    display: block;
}

#coll_list dl dt img {
    margin: 10px 0 30px 30px;
}

#coll_list dl dd {
    width: 50%;
    float: right;
}


#coll_list .line {
    border-top: solid 1px #eee;
    padding: 10px 0;
}


#coll_list table ul li {
    float: left;
    margin: 0 1px 0 0;
}

#coll_list_list table ul li img {
    border: solid 2px #fff;
}

#coll_list table ul li a:hover img {
    border: solid 2px #eee;
}

#coll_list table ul li a:focus img,
#coll_list table ul li a:active img {
    border: solid 2px #79503A;
}


#coll_list .btn-gray {
    display: block;
    height: 45px;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    margin: 10px 100px;
    border: 1px solid #666;
    transition: .4s;
    background: #4D4D4D;
    color: #fff;
}


#coll_list .btn-gray:hover {
    background: #8F8F8F;
    color: #ffffff;
}


/*2024.03.25 ボタン変更　*/

.btn01 a {
	background: #4D4D4D;
	color: #ffffff;	
	border: 1px solid #4D4D4D;
    display: block;
	height: 50px;
	line-height: 50px;
	text-align: center;
	text-decoration: none;
	/*margin: 0 100px;*/
    width: 48%;
}

.btn01 a:hover {
	background: #9C9A9E;
	color: #ffffff;
	transition: all .2s;
	text-decoration: none
}

/*
.btn01 a::after {
	content: '';
	position: absolute;
	top: 50%;
	right: -35px;
	transform: translateY(-50%);
	width: 70px;
	height: 1px;
	background-color: #333;
}
*/

/*  2024.03.25追記*/
@media only screen and (max-width:420px) {
    .btn01 a {

    width: auto;
}
}


/*カート*/
.btn02{
	display: inline-block;
	vertical-align: middle;
	margin: 0 10px;
	padding: 6px 25px;
        height: 45px;
    line-height: 45px;
	color: #ffff;
	font-weight: bold;
	letter-spacing: 0.5pt;
	text-decoration: none;
	background-color: #d4c389;
	border: 1px solid #d4c389;
	cursor: pointer;
	transition-duration:0.3s;
    -webkit-transition-duration:0.3s;
    -moz-transition-duration:0.3s;
    -o-transition-duration:0.3s;
    -ms-transition-duration:0.3s;
} 
.btn02:hover{
    color: #ffffff;
        background: #d4c389;
}


/* 絵本　詳細　*/

.btn03 a{
    display: block;
    height: 45px;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    margin: 10px 10px;
    border: 1px solid #666;
    transition: .4s;
    background: #4D4D4D;
    color: #fff;
}


btn03 a:hover {
    background: #8F8F8F;
    color: #ffffff;
}



/*------------------ オリジナル　-----------------------*/

.img-original {
    width: 80%;
    margin: 20px 15px;
}

.l3{line-height: 2.5;}




@media screen and (max-width:768px) {

    #coll_list dl dt img {
        margin: 10px 0 30px 0px;
    }

    .img-book {
        width: 90%;
    }
    
    .img-books {
        width: 90%;
    }

    #coll_list dl dt {
        width: 100%;
        /*	height:600px;*/
        overflow: hidden;
        text-align: center;
        display: block;
    }

    #coll_list dl dd {
        width: 100%;
    }
  
     #coll dl dt {
        width: 100%;
        /*	height:600px;*/
        overflow: hidden;
        text-align: center;
        display: block;
    }

    #coll dl dd {
        width: 100%;
    }
     

    .panel h3 {
        font-size: 1.6em;
        margin: 0px 5px 10px 5px;
    }

    .panel h4 {
        font-size: 1.3em;
    }
    
   .img-original {
    width: 100%;
    margin: 20px 15px;
}

    

}

@media screen and (max-width:360px) {

    .panel h3 {
        font-size: 1.5em;
        margin: 0px 5px 10px 5px;
    }

    .panel h4 {
        font-size: 1.2em;
    }

}
