@charset "utf-8";

/* @group Reset */

*{ margin: 0;padding: 0}

a { text-decoration : none; color: #000;  }
a:hover img{
	opacity: 0.6;
  	filter: alpha(opacity=60);
  	-ms-filter: "alpha(opacity=60)";
}
	
ul, ol { list-style : none}
img { vertical-align : middle}

/* @end */


/* @group Fluid-img */

img { max-width : 100%}

/* @end */


/* @group HTML */

html {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
font-size : 87.5%; /*14px*/
line-height : 1.5;
letter-spacing: 0.1em;}
body { width: 100%;}

/* @end */


/* @group Heading */

h1 {
font-size : 3.5em; /* 48px */
line-height : 1; 
} 

h2 {
font-size : 2.28em; /* 32px */
line-height : 1; 
margin-bottom: 30px;
} 

h3 {
font-size : 2em; /* 28px */
margin-bottom: 30px;
} 
h4 {
font-size : 1.857em; /* 28px */
margin-bottom: 20px;
}
p{ font-size: 1em;
	line-height : 1.5;
}

/* @end */

/* @group Shear */

.pc{ display:none;}
.sp{ display:inherit; }
.contents-inner{ width: 94%; margin: 0 auto;}

h2.design1,h2.design2,h2.design3{ font-size: 1.45rem; }
h3.design1,h3.design2{ font-size: 1.5rem; }
h4.design1,h4.design2,h4.design3{ font-size: 1.4rem; }

h2.design1{ background:#f9cfcf; color: #765e1a; text-align: center; padding: 10px 2%; overflow: hidden; display: table; width: 96%;}
h2 span.title,h3 span.title{  display: table-cell; vertical-align: middle; }
h2 span.right-img,h3 span.right-img { text-align: right; float: right;  }
h2 span.left-img,h3 span.left-img { text-align: left; float: left; }
h2.design2{ background:url(../img/parts/design2-bg.png) repeat-x; color: #000; text-align: center;  overflow: hidden; display: table; width: 100%; height: 86px; }
h2.design3{ background:url(../img/parts/design3-bg.png) repeat-x center; color: #000; text-align: center;  overflow: hidden; display: table; width: 100%; height: 152px; }

h3.design1{ background:url(../img/parts/mdesign1-bg.png) repeat-x; color: #000; text-align: center;  overflow: hidden; display: table; width: 100%; font-weight: 100;}
h3.design2{ background:url(../img/parts/mdesign2-bg.png) repeat-x; color: #000; text-align: center;  overflow: hidden; display: table; width: 100%; font-weight: 100;}

h4.design1{ background:url(../img/parts/sdesign1-bg.png) repeat-x bottom; color: #000; text-align: center;  width: 100%; font-weight: 100; display: table; }
h4.design1 span.title{ display: block; text-align: center; background: url(../img/parts/sdesign1-1.png) no-repeat bottom center;  display: table-cell; vertical-align: middle; padding-bottom: 22px; }
h4.design2{  background:url(../img/parts/sdesign2.png) repeat-x bottom; color: #000; text-align: left;  width: 100%;  padding-bottom: 32px; font-weight: 100;  }
h4.design3{  background:url(../img/parts/sdesign3.png) repeat-x bottom; color: #000; text-align: left;  width: 100%;  padding-bottom: 20px; font-weight: 100;  }


/* ハンバーガーメニュー */

.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-trigger {
  position: relative;
  width: 48px;
  height: 48px;
}
.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 5px;
  background-color: #765e1a;
  border-radius: 10px;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 17px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 9px;
}
.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(17px) rotate(-46deg);
  transform: translateY(17px) rotate(-46deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-17px) rotate(46deg);
  transform: translateY(-17px) rotate(46deg);
}
/* @end */

/* @group Header */
header{ width: 100%;  position: fixed; z-index:2 }
.smp-menu{background:url("../img/header-bg-pc-line.png") repeat-x ; padding: 24px 0 42px; position: absolute; width: 100%; }
.hgr{ width: 93.75%; margin: 0 auto; overflow: hidden;}
.hgr h1 img{ width: 73%; float: left;  }
.hgr nav{ width: 27%; float:right;}
/* @group dropdown-menu */
.smp-dpmenu{ 
				position:fixed; 
				top: 130px;
    				right: 0;
    				bottom: 0;
    				left: 0;
				z-index:2;
				overflow-y: auto;
				-webkit-overflow-scrolling: touch;
				-webkit-transition-duration:1s;background:#fff;padding:0;max-height:0;
				 text-align: left; font-size: 1.6em;
}
.smp-dpmenu.open{padding:5px 0 0 0;max-height:30em;}
.dropdown-menu{  overflow:hidden; width:100%; height: 100%; overflow-y: auto;  }

.dropdown-menu li{ line-height:3em;list-style:none; border-bottom: #f9cfcf solid 5px;  padding:11px 3%; overflow: hidden; }
.dropdown-menu li a{display:block;width:100%;height:100%;color:#000; background: url(../img/menu-icon.png) no-repeat left center; padding-left: 65px; float: left; width: 35%;}
.dropdown-menu li a.btn{ float: left; background: none; width: 46%; padding-left: 0px; text-align: right;}

.dropdown-submenu{-webkit-transition-duration:1s;background:#f9cfcf;padding:0;max-height:0;overflow:hidden; text-align: left; font-size: 0.9em; width: 100%;}
.dropdown-submenu.open{padding:5px 0;max-height:30em;}

.dropdown-submenu li{ line-height:2.5em;list-style:inside; padding:10px 3%; color: #e9536b; border-bottom: #fff dashed 1px; }
.dropdown-submenu li:last-child{ border-bottom: none;}
.dropdown-submenu li a{ display: inline; width:100%;height:100%;color:#000; background: none; padding-left: 0px; float: none;}

.btn > span:last-of-type,
        .btn.active > span:first-of-type
        {
            display: none;
        }
 
.btn.active > span:last-of-type {
            display: inline;
        }
/* @end */
.hgr .tgm{ text-align: right; margin-top: 17px;}
.hgr .tgm span{ font-size: 0.714em; display: block;}


/* @group Slider */
/* slider*/	
	
#slider {
    overflow:hidden;
    position:relative;
    width:100%;
	padding-top: 150px;
}
.bx-wrapper {
  padding-bottom: 20px; 
}


/* @group Contents */

.contents{ width: 100%;  margin-top: 25px; overflow: hidden; }
.left-contents{ width: 100%; overflow: hidden; }
.right-contents{ width: 100%; }
.under{ padding-top: 175px; margin-top: 0; }
.main-contents{overflow: hidden; }
.fooer-contents{ width: 100%;}

/* 新刊 */
.new-list-box{ overflow: hidden; background:#f0f0ef; }
.left-contents nav .month{ width:94%;  border-bottom: 1px solid #000; margin: 20px auto; padding-bottom: 10px; overflow: hidden;}
.left-contents nav .month li { float:left; font-size:1.3em;  font-weight: 600; width: 33%; text-align: center;}
.left-contents nav .month li a{ color: #e9546b;}
.left-contents nav .month li a:hover{  
	opacity: 0.6;
  	filter: alpha(opacity=60);
  	-ms-filter: "alpha(opacity=60)";}
.left-contents nav .month li:first-child,
.left-contents nav .month li:last-child{ font-size:1em;  font-weight: 500; margin-left:0; margin-top: 5px; }
.left-contents nav .month li:first-child a,
.left-contents nav .month li:last-child a{ color: #9fa0a0; }
.left-contents nav .month li:first-child a:hover,
.left-contents nav .month li:last-child a:hover{ color: #000; }
.left-contents nav .month li:first-child { background: url(../img/left-icon.gif)  no-repeat left center; padding-left: 6%; width: 26%; text-align: left; background-size: 15%;}
.left-contents nav .month li:last-child {background: url(../img/right-icon.gif) no-repeat right center; background-size: 15%; padding-right: 6%; float: right; text-align: right; width: 28%}
.left-contents .new-list{ width:46.3125%; float: left; margin: 0 0 60px 2% }
.left-contents .new-list img{ border: 1px solid #827e7e;}
.tab{ font-size: 0.9em; text-align: center; padding: 3px 10px; border: 1px solid;  margin: 10px 0; display: inline-flex;}
.left-contents .new-list h3 a{ font-size: 0.8em; line-height: 1.2em; margin-bottom: 15px; display: block; }
.left-contents .new-list h3 a:hover{ 
	opacity: 0.6;
  	filter: alpha(opacity=60);
  	-ms-filter: "alpha(opacity=60)"; }
.left-contents .new-list .day{font-size: 1em; }
.red{ background:#f9cfcf;}
.blue{background: #c7e6e5;}

/* 新着情報 */

.news{ margin-top:40px;}
.news h2{ font-size:1.8em; text-align: center; margin-bottom: 40px;}
.news ul{ height: 458px;overflow: scroll; overflow-x: hidden;}
.news ul li{ font-size: 1.2em;  line-height: 1.8em; padding:15px 3%; display: block;} 
.news ul li a{color: #ea6188; }
.news ul li a:hover{ color: #000; }
.news ul li span{ color: #727171; display: block;}
.news ul li:nth-child(odd) { background: #fdf2f2;}

/* おすすめ作品*/
.recomend{margin-top:40px; overflow: hidden;}
.recomend h2{font-size:1.8em; text-align: center; border-bottom: 1px solid #000; width: 94%; margin: 0 auto 13px; padding-bottom: 30px}
.recomend img{ border: 1px solid #909090; width:45.3125%; float: left; margin: 0 0 13px 3%}

/* banner*/
.banner-area{ width: 94%; margin: 30px auto 0;}
.banner-area img{ margin-bottom: 20px;}

/* infomation*/
.infomation li{ font-size: 1.2em; background: #f2eff1; padding: 20px 3%; border-bottom:3px solid #fff;}
.infomation li a{ color: #898989; }
.infomation li a:hover{ color: #000;}

/* @end */

/* @group Twitter */
.twitter{ border: 1px solid #909090; width: 90%; padding: 2%; margin: 0 auto;}
.tw-title{ font-size: 1rem; margin-bottom: 10px; text-align: center;}
.tw-title span{ font-size: 0.6rem; color:#e9536b; margin-left: 5px; letter-spacing: 0.5; }
.twitter iframe {
  width: 100% !important;
}

/* @end */

/* @group Footer */

footer{ background: #f9cfcf; width: 94%; padding: 50px 3%}
footer p{ text-align: center;}
footer .copy{ margin-top: 20px;}

/* @end */

/* @group Under Contents */

#search{ position: relative; width: 94%; padding: 0 3%; }
#keyword{ width: 73%; border: 3px #000 solid; background: #fff; padding: 16px 10px; font-size: 17px; }
#sbtn{ width: 70px; 
	position: absolute;  
    top: 0;  
    left: 80%;  }

/* breadcrumb */

.breadcrumb {
 width: 94%; 
	padding: 0 3%;
	margin-bottom: 20px;
}

.breadcrumb li{
  display:inline;
  list-style: none;
}

.breadcrumb li:after{
  content: '>';
  padding: 0 3px;
  color: #555;
}

.breadcrumb li:last-child:after{
  content: '';
}

.breadcrumb li a {
    text-decoration: none;
    color: #52b5ee;
}

.breadcrumb li a:hover {
    text-decoration: underline;
}



/* detail main-contents */
/*.detail{ width: 100%; margin-top: 50px; overflow: hidden;}*/
.detail{ width: 100%; margin-top: 50px;}
.detail h1{ width: 94%; padding: 0 3%; font-size: 2em; line-height: 1.5; margin-bottom: 20px;}
.detail h1 span{ font-size: 1.2rem; font-weight: 100; display: block; }
.detail .cover{ width: 94%; margin: 0 3%; padding: 2px; border: 1px solid #a4a4a4;}
.detail .btn{ width: 94%; margin: 0 3%; padding:20px 0; text-align: center; color: #fff; font-size: 1.8rem;
	border-radius: 6px;  
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
	margin-top: 20px;
}
.detail .btn a{ color: #fff;}
.detail .btn img{ width: 13%; margin-top: -5px;
	opacity: 1;
  	filter: alpha(opacity=100);
  	-ms-filter: "alpha(opacity=100)";
}
.detail .pink{ background:#e9536b; }
.detail .blue{ background: #00b0ec}
.detail dl{ width: 94%; margin: 20px 3%;  width: 100%; color: #727171; }
.detail dl dt{ float: left; }
.detail .main-title dt{ font-size: 1.2rem; }
.detail .main-title dd{ font-size: 1.4rem; color: #49aad2; margin-left: 80px; }
.detail .main-data{ font-size: 1.1rem; letter-spacing: 0.1em}
.detail .main-data dt{ }
.detail .main-data dd{margin-left: 100px; }
.detail dl dt a,.detail dl dd a{color: #727171; }
.detail .main-txt{ background: #efeff1; padding: 20px 3%; line-height: 1.8; margin-top: 20px;}
.detail .main-txt span{ font-size: 1.4rem; display: block; margin-bottom: 10px;}
.detail .blue-title{ background: #00b0ec; padding: 25px 0; text-align: center; color: #fff; font-size: 1.8rem; font-weight: 100;}
.detail .buy-btn{ padding: 20px 3%; overflow: hidden;}
.detail .buy-btn li{ width: 46%; float: left; text-align: center; border: 3px #00b0ec solid; padding:20px 0; margin-bottom: 15px; font-size: 1rem; font-weight: 800; }
.detail .buy-btn li.rmg{ margin-right: 4%;}

/* LIST main-contents */

h2.title{font-size:2rem; text-align: center; margin: 50px 0; letter-spacing: 0.1em }
.newlist{ width: 100%; background: #f1f1f1; padding: 55px 0 0 0; overflow: hidden;}
.lastbtm{ padding-bottom: 55px; }
.newlist h3{ text-align: center; font-size: 1.8rem; color: #e9546b; margin-bottom: 22px; letter-spacing: 0.1em}
.newicon{ font-size: 0.9em; text-align: center; padding: 4px 9px;  margin: 10px 0; display: inline-flex; background: #e9546b; color: #fff;}
.newlist img{ border: 1px solid #827e7e; }
.newlist article{ background: #fff; padding: 20px 3%; width:41%; float: left; margin: 8px 0 0 2%;  }
.newlist article h3{ font-size: 1.142rem; text-align: left; margin: 0 0 10px 0; line-height: 1.2; height: 75px;}
.newlist article .auther{ font-size: 1rem; color: #49aad2}
.newlist article .day{ font-size: 0.857rem; margin-top: 10px; color: #ababac}
.newlist article .day{ font-size: 0.857rem; margin-top: 10px; color: #ababac}

/* 2017.12.23 追記 */
.conetns_imgbox { 
	position: relative;
    width: 100%;
    height: auto;}
.conetns_imgbox:before{
	content: "";
    display: block;
    padding-top: 170%;}
.conetns_imgbox .conetns_img{
	position: absolute;
    top: 0; 
    left: 0;
    width: 100%;
    height: 100%;
}

/* pager */
.pager{ text-align: center; margin: 50px 0; }
.pager .page-navi{ font-size:0.857rem; }
.pager .page-navi li{ display: inline-block;  margin-right: 3px; }
.pager .page-navi li a{ display: block; background: #727071; padding: 3px 8px; color: #fff; border: 1px solid #727071; }
.pager .page-navi li a:hover{ border: 1px solid #727071; background: #fff; color:#727071; }
.pager .page-navi li:last-child{ margin-right: 0;  }
.pager .page-navi li:first-child a,.pager .page-navi li:last-child a{ background: none; color:#000; border: none;margin-top: 3px;  }
.pager .page-navi li:first-child a:hover,.pager .page-navi li:last-child a:hover{ color:#969696 }

/* @end */






/*600px*/

@media screen and (min-width : 500px) {

	.hgr h1 img{ width: 50%; }
	.detail .cover img{ width: 100%;}
	.banner-area img{ width: 100%; }
	#keyword{ width: 85%; }
	#sbtn{ left: 88%;  }

}




/*768px*/
@media screen and (min-width : 768px){
	.pc{ display:inherit;}
	.sp{ display:none; }
	
	h2.design1,h2.design2,h2.design3{ font-size: 2.28rem; }
	h3.design1,h3.design2{ font-size: 2rem; }
	h4.design1,h4.design2,h4.design3{ font-size: 1.857rem; }
	
	header{ width: 100%;position: inherit; background: url(../img/header-bg-pc-line.png) repeat-x; position: absolute; z-index: 1
	}
#slider {
	padding-top: 220px;
}
.bx-wrapper {
  padding-bottom: 20px; 

}
	
	.hgr-pc{ width: 90%; margin: 0 auto;}	
	.hgr-pc h1{ width: 100%; margin-left:0; padding: 25px 0 35px;}
	.grand-menu{ width: 90%; margin: 0 auto; }
	.grand-menu ul{ font-size:1.28em; overflow: hidden;}
	.grand-menu ul li{ float: left;  width:18.3%; text-align: center; }
	.grand-menu ul li a{ color: #000; text-decoration: none;  display: block; padding: 15px 0;  }
	.grand-menu ul li a:hover{ border-bottom: 4px #e9536b solid;}
	.grand-menu ul li:last-child a{ border-bottom: none}
	.grand-menu ul li.ov{ border-bottom: 4px #e9536b solid; padding: 15px 0; }
	
	.grand-menu ul li .dropdown-hvmenu{-webkit-transition-duration:1s; background:#e9536b; padding:0; max-height:0; text-align: center;  width: 100%;}
	.grand-menu ul li .dropdown-hvmenu.open{padding:5px 0;max-height:30em;}
	.grand-menu ul li .dropdown-hvmenu li{ line-height:2em; list-style:none; padding:0; margin: 0 3%; width: 94%; background: #fff; font-size: 14px; float: none;}
	.grand-menu ul li .dropdown-hvmenu li:first-child{
	border-top-left-radius: 5px; border-top-right-radius: 5px;}
	.grand-menu ul li .dropdown-hvmenu li:last-child{
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;}
	.grand-menu ul li .dropdown-hvmenu li:hover{ border-bottom: none;}
	.grand-menu ul li .dropdown-hvmenu li a{display:block;width:100%;height:100%;color:#837d7b; border-bottom: #837d7b solid 1px; padding:3px 0;  }
	.grand-menu ul li .dropdown-hvmenu li a:hover{ background:#e9536b; color: #fff;}
	.grand-menu ul li .dropdown-hvmenu li:last-child a{ border-bottom: none;}
	
	
	/* @group Contents */

.contents{ width: 96%;  margin: 50px auto; overflow: hidden; }
.left-contents{ width: 70%; overflow: hidden; float: left;}
.right-contents{ width: 27%; float: right;}
.under{ padding-top: 175px; margin: 0 auto 50px; }
.main-contents{ width: 100%; overflow: hidden; padding: 0px;}
.sub-header{ width: 100%; overflow: hidden; }

	
/* 新刊 */
.left-contents nav .month li{font-size:1.6rem; }
.left-contents nav .month li:first-child,
.left-contents nav .month li:last-child{ background-size:11%;}
.left-contents nav .month li:first-child a,
.left-contents nav .month li:last-child a{ display: block; margin-top: 3px;}
.left-contents .new-list{ width:20.5555%; margin: 0 0 60px 3.5% }
.left-contents .new-list .tab{ font-size: 0.85rem; padding: 3px 15px 2px; margin: 14px 0; }
.left-contents .new-list h3 a{ font-size: 1rem; line-height: 1.3em; margin-bottom: 9px; font-weight: 100; }
.left-contents .new-list .day{font-size: 0.85rem; font-weight: 100  }
.left-contents .new-list .blank{ font-size: 0.85rem; padding: 3px 15px 2px; margin: 14px 0; display: inline-flex;}

/* 新着情報 */

.news{ margin-top:50px; border: 2px solid #909090; border-radius: 8px; padding:25px 0; }
.news h2{ font-size:1.6rem; text-align: left; width: 90%; margin: 0 auto 20px;}
.news ul{ height: 180px}
.news ul li{ font-size: 1rem;  line-height: 1.8em; padding:5px 3%; display: block;} 
.news ul li span{ display:inline; margin-right: 10px;}

/* おすすめ作品*/
.recomend{margin-top:30px; overflow: hidden;}
.recomend h2{font-size:1.6rem; text-align: left; width: 100%; margin: 0 auto 13px; padding-bottom: 10px}
.recomend img{ width:15.21666%; float: left; margin: 10px 0.5% 13px }

/* twitter*/
.twitter iframe{
		width: 100px!important;
	}

/* banner*/
.banner-area{ width: 100%;}
.banner-area img{ margin-bottom: 10px;}

/* infomation*/
.infomation li{ font-size: 1rem; padding: 13px 0 13px 7% }

/* @end */

/* @group Footer */

footer{width: 94%; padding: 40px 3%; font-size: 0.9rem;}
footer .copy{ margin-top: 5px;}

/* @group Under Contents */
	
.breadcrumb	{ margin-top: 64px; letter-spacing: 0.1em; font-size: 0.857rem; width: 100%; padding: 0}
#search{ width: 286px; left:61%; padding: 0; top:26px;  }
#keyword{ width: 212px; border: 3px #000 solid; background: #fff; padding: 5px 10px; font-size: 16px; letter-spacing: 0.09em}
#sbtn{ width: 43px; 
	position: absolute;  
    top: 0;  
    left: 240px;  }
		
.sub-header .title{ text-align: center; font-size: 1.8em;}
	
/* detail main-contents */
/*.detail{background: #efeff1; padding: 50px 5%; line-height: 1.7; overflow: hidden; margin-top: 67px; width: 90%;}	*/
.detail{background: #efeff1; padding: 50px 5%; line-height: 1.7; margin-top: 67px; width: 90%;}	
.left{ float: left; width: 30%; }
.right{ float: right; width:65%;}

.detail h1{ width: 100%; padding: 0; font-size: 2rem; line-height: 1.5; margin-bottom: 20px;}
.detail h1 span{ font-size: 0.857rem; font-weight: 100; display: block; }
.detail .cover{ width: 100%; margin: 0; }
.detail .btn{ width: 100%; margin: 0; padding:14px 0; font-size: 1.357rem; margin-top: 40px }
.detail .btn a{ color: #fff;}
.detail .btn:hover{ 
		opacity: 0.6;
  	filter: alpha(opacity=60);
  	-ms-filter: "alpha(opacity=60)";
		
	}
.detail .btn img{ width: 13%; margin-top: 0;}
.detail .btn a{ color: #fff;} 
.detail dl{ width: 100%; margin: 0; letter-spacing: 0.1em }
.detail .main-title{ margin-top: 15px; line-height: 1.5;}
.detail .main-data{ margin-top: 10px;}
.detail .main-title dt{ font-size: 0.857rem; margin-top: 2px;}
.detail .main-title dd{ font-size: 1.142rem; font-weight: bold; margin-left: 48px;}
.detail .main-data{ font-size: 0.857rem; }
.detail .main-data dd{margin-left: 70px;}
.detail .main-txt{ width: 90%; background: #fff; padding: 20px 5%; line-height: 1.8; margin-top: 44px; font-size:0.857rem }
.detail .main-txt span{ font-size: 1.642rem; margin-bottom: 10px;}

.detail .btn-list{ width: 210px; float: left;}
.detail .btn-list .blue-title{
	width: 210px; 
	padding:19px 0; 
	text-align: center; color: #fff; font-size: 1.357rem;
	border-radius: 6px;  
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
	margin-top: 42px;
	}
.detail .btn-list .blue-title:hover{
		opacity: 0.6;
  	filter: alpha(opacity=60);
  	-ms-filter: "alpha(opacity=60)";
		
	}
.detail .btn-list .blue-title a{ color: #fff; }
.detail .btn-list .buy-btn{ padding: 10px; background: #00b0ec; width: 190px; margin-top: 10px; }
.detail .btn-list .buy-btn li{ width: 190px; float: none; border: none; margin: 0; font-size: 1rem; font-weight: 900; background: #fff; border-bottom: 1px solid #dde0e2;  color:#000; padding:0; }
.detail .btn-list .buy-btn li:first-child,
.detail .btn-list .buy-btn li:first-child a{ 
		border-top-left-radius: 6px;
  		border-top-right-radius: 6px;
	}
.detail .btn-list .buy-btn li:last-child,
.detail .btn-list .buy-btn li:last-child a{ 
		border-bottom-left-radius: 6px;
  		border-bottom-right-radius: 6px;
		border-bottom:none;
	}
.detail .btn-list .buy-btn li a { display: block; width: 190px; padding:9px 0;  }
.detail .btn-list .buy-btn li a:hover{color: #fff; background:#9ed8f6;   }
.detail .buy-btn li.rmg{ margin-right: 0; }
.detail .bstn{ width: 210px; float: left; margin-left: 3%;}	
/* .detail .bstn{ width: 210px; float: left; margin-left: 3%; margin-top: 42px;}	ather edit 2017.12.12 */
	
.dropdown-buymenu{-webkit-transition-duration:1s;max-height:0;overflow:hidden; position:absolute; z-index:10}
.dropdown-buymenu.open{padding:5px 0;max-height:20em;}
.dropdown-buymenu li{list-style:none;}
.dropdown-buymenu li a{display:block;width:100%;height:100%;}
	
	
h2.title{font-size:2.5714rem; margin: -10px auto 70px; }
.newlist{ width: 100%; }
.newicon{ padding: 4px 15px; font-size: 1em; }
.newlist article{ padding: 20px 1.5%; width:20.1%; margin: 8px 0 0 1.5%; }
.newlist article .day{ font-size: 0.857rem; margin-top: 10px; color: #ababac}	
.tab{ font-size: 1em; padding: 3px 6px; }
	
.pager .page-navi li{ margin-right: 10px; }	
/* @end */


}





/*1024px*/
@media screen and (min-width : 1024px) {
	.hgr-pc{ width: 986px; }	
	.grand-menu{ width: 986px;  }
	.grand-menu ul{ font-size:18px;}
	.grand-menu ul li{ width:150px; }
	
	/* @group Contents */

.contents{ width: 986px;  margin: 50px auto; letter-spacing: 0.02em; }
.left-contents{ width: 720px; }
.right-contents{ width: 235px; }
.under{ padding-top: 175px; margin: 0 auto 50px; }
.main-contents{ width: 986px; }
.hgr-pc h1{ margin-left:0; }
	
	
	/* 新刊 */
.left-contents nav .month{ width: 100%; margin: 0 auto 28px;}
.left-contents nav .month li{font-size:23px; }
.left-contents nav .month li:first-child,
.left-contents nav .month li:last-child{font-size: 18px; background-size:auto; }
.left-contents nav .month li:first-child a,
.left-contents nav .month li:last-child a{ margin-top: 1px; }
.new-list-box{ padding: 30px 10px 37px; }
.left-contents .new-list{ width:148px; margin: 0px 13px 60px }
.left-contents .new-list .tab{ font-size: 12px; padding: 2px 10px 1px; }
.left-contents .new-list h3 a{ font-size: 14px; height: 40px;  }
.left-contents .new-list .day{font-size: 11px; }

/* 新着情報 */

.news{ border-radius: 6px; }
.news h2{ font-size:23px; width: 672px; }
.news ul li{ font-size: 14px; } 
.news ul li span{ display:inline; margin-right: 20px;}

/* おすすめ作品*/
.recomend{margin-top:30px; overflow: hidden;}
.recomend h2{font-size:23px; text-align: left; width: 100%; margin: 0 auto 20px; padding-bottom: 1v0px}
.recomend img{ width:110px; margin: 10px 4px 13px }


/* infomation*/
.infomation li{ font-size: 14px; padding: 12px 0 12px 12px;  }
	
/* slider*/	
	
#slider {
    overflow:hidden;
    position:relative;
    width:100%;
	padding-top: 220px;
}
#sliderinner {
    position:relative;
    left:50%;
    width:3440px;
    margin-left:-1720px;
}
#sliderinner ul {
	margin-left:1146px;
}
#sliderinner li {
    width:1146px;
	height:424px;
}
#sliderinner li img {
    width:1146px;
	height:424px;
}

#slideFilterL, #slideFilterR {
    position:absolute;
    top:0;
    width:1148px;
    height:423px;
    opacity:0.4;
    filter:alpha(opacity=40);
    -ms-filter:"alpha( opacity=40 )";
    background:#000;
}
#slideFilterL {
    left:0;
}
#slideFilterR {
    right:0;
}

.bx-wrapper {
    margin:0 auto;
    position:relative;
	padding-bottom: 20px;
}


/* コントローラー */
.bx-wrapper .bx-prev {
    left:1087px;
    background:url(../img/controls.png) no-repeat 0 -32px;
}

.bx-wrapper .bx-next {
    right:1087px;
    background:url(../img/controls.png) no-repeat -43px -32px;
}

.bx-wrapper .bx-prev:hover {
    background-position:0 0;
}

.bx-wrapper .bx-next:hover {
    background-position:-43px 0;
}

.bx-wrapper .bx-controls-direction a {
    position:absolute;
    top:213px;
    outline:0;
    width:32px;
    height:32px;
    text-indent:-9999px;
    z-index:9999;
}



/* @end */


/* @group Footer */

footer{width: 94%; padding: 40px 3%; font-size: 0.9rem; letter-spacing: 0.02em;}
footer .copy{ margin-top: 5px;}

	
#search{ width: 286px; left:697px; padding: 0;  }
#keyword{ width: 212px; border: 3px #000 solid; background: #fff; padding: 5px 10px; font-size: 16px; letter-spacing: 0.09em}
#sbtn{ width: 43px; 
	position: absolute;  
    top: 0;  
    left: 240px;  }
		
	
.sub-header .title{ text-align: center; font-size: 1.8em;}
.detail{padding: 50px 60px; width:866px}	
.left{ width: 290px; }
.right{ width:530px;}
.detail .bstn{ margin-left: 44px; }	
.newlist{ width: 970px; padding: 50px 8px 0 }
.newlist article h3{ font-size: 1.142rem; font-weight: 100; margin-top: 10px;}
.newlist article{ padding: 20px 13px; width:203px; margin: 6px; }
.lastbtm{ padding-bottom: 50px; }
.newlist h3{ font-size: 2.142rem;}
	
.pager .page-navi li{ margin-right: 3px; font-size:0.7857rem; }
.pager .page-navi li:first-child,.pager .page-navi li:last-child{ font-size:0.714rem; font-weight: bold;}

}			

@media screen and (max-width: 768px) and (min-width: 480px) {
	.twitter iframe{
		width: 180px !important;
	}

}

@media screen and (max-width: 480px) {
	.twitter iframe{
		width: 384px!important;
	}
	
}