@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');

html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-size: 100%;
  vertical-align:baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
article, header, footer, aside, figure, figcaption, nav, section {
    display: block;
}
body {
  margin: 0;
　color:#000; 
　font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;  
　-webkit-text-size-adjust:100%;  
}

img { 
　max-width: 100%;
	height: auto;
}

a { 
	color:#2653b0; 
}

a:hover,
a:hover img { 
	filter:alpha(opacity=70); 
	-moz-opacity: 0.7; 
	opacity: 0.7; 
}

/*ヘッダー*/
header { 
	background-image:url(../img/bg.gif); 
	background-repeat:repeat-x; 
	background-position:bottom; 
	display:block; position:relative; 
	height:96px; 
	text-align:center; 
	margin:0; 
	padding:0;
}

header img { 
	width:140px; 
	height:55px; 
	margin:18px auto 0 auto; 
	vertical-align:top; 
	display:inline-block;
}

/*フッター*/
footer {
    background-color: #3c3c3c;
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
    line-height: 1.6;
}
address {
  width: 1024px;
  margin: 0 auto;
  clear:both;/*不要か？*/
}
address ul {
  position: relative;
  overflow: hidden;
  text-align: center;
  width: 100%;
  margin: 0 auto 0 auto;
  padding: 22px 0 0 0;
  height: 125px;
}
address ul li {
  display: block;
  float: left;
  border-left: #FFF 1px solid;
  text-decoration: none;
  font-style: normal;
  line-height: 1;
  color: #FFF;
  height: 11px;
  margin-left: 10px;
  padding-left: 10px;
  font-size: 11px;
  }     
address ul li.ad2 {
  position: absolute;
  right: 20px;
  top: 22px;
  width: 78px;
  padding: 0;
  border-left: none;
}
address ul li.first {
  border-left: none;
}
address ul li a, 
address ul li a:link{
  text-decoration: none;
  color: #FFF;
}
address ul li a:hover {
  text-decoration: underline;
  color: #FFF;
}
address ul li a div {
  margin: 0;
  padding: 0;
  border-bottom: none;
}
address ul li.ad1 {
  position: absolute;
  left: 10px;
  top: 40px;
  margin: 0;
  font-size: 10px;
  border-left: none;
}
address ul li.ad2 {
  position: absolute;
  right: 20px;
  top: 22px;
  width: 78px;
  padding: 0;
  border-left: none;
  display: block;
  text-align: center;
  text-indent: -9999px;
  height: 24px;
  margin: 0 auto 0 auto;
  background-image: url(../img/kob_logo-wh.png);
  background-position: center;
  background-repeat: no-repeat;
}


.container { 
	margin:0; 
	overflow:visible;
}

/*インナー*/
.online_store_wrap { 
	font-family: 'Noto Sans JP', sans-serif;
    width: auto;
    height: auto;
    position: relative;
    display: block;
    margin: 88px auto 110px auto;
    text-align: center;
    background: url(../img/bg.png) repeat;
    padding:40px 0;
}
	
/*書影テキストボックス*/	
.Box{
	width: 778px;
	margin: 50px auto 0; 
}

/*書影*/	
.leftTop{
	margin:0 auto;
}	

.syoei_image{
	box-shadow: 0 0 6px gray; 
}

.rightBottom {
    padding: 20px 0 0 0;
}

.title{ 
	font-size:1.8rem; 
	font-weight: 800;
	margin-bottom: 0.5rem;
}

.author{
	font-size:1.2rem; 
	font-weight: 800;
	margin-bottom: 0.5rem;
}

.price{
	font-size:1rem;
}

/*ヘッダー購入先リンク*/
.link { 
	display: inline-block;
  width: 366px;
  margin: 0 21px;
  font-size: 0;
  line-height: 0;
  vertical-align: top;
  padding: 40px 0;
}

/*購入はこちら*/
.link_buy { 
	  display: inline-block;
    vertical-align: top;
    background-color: #1270ba;
    padding: 24px 0;
    margin: 0 4px 8px 4px;
    color: #fff;
    font-size: 1rem;
    text-align: center;
    width: 100%;
    height: 24px;
    line-height: 0.2rem;
}

.link_buy_image { 
	height: 18px;
  width: auto;
  margin: 0 auto;
}

/*購入先一覧*/
.link_list{ 
	text-align:left; 
	width:100%; 
	margin:0; 
	padding:0;
}

.link_box { 
	width:100%; 
	margin:0; 
	padding:0; 
}

/*購入先*/
.link_item { 
	margin:0 4px 8px 4px; 
	display: inline-block; 
	width:175px; 
	background-color:#fff;
  border-bottom: 2px solid #c3c3c3; 
	border-left:1px solid #c8c8c8; 
	border-right:1px solid #c8c8c8; 
	border-top:1px solid #dddddd;
	text-align: center;
}

.link_item_image { 
	height: 58px;
  width: 130px;
  margin: 0 auto;
}


	@media screen and (max-width:1025px){
	footer,address{
		width: 100%;
	}
	/*書影テキストボックス*/
	.Box {width:87%;}	

	}

	@media screen and (max-width:768px) {
	.online_store_wrap {
        width: auto;
        height: auto;
        position: relative;
        display: block;
        margin: 40px auto 110px auto;
        text-align: center;
        padding: 50px 0 50px 0;
    }


	/*書影テキストボックス*/	
	.Box {margin:40px auto 0; }

	/*テキスト*/	
	.rightBottom{
		width: 100%;
		margin: 0 auto;
		vertical-align: top;
		padding: 20px 0 0 0;
	}

	.price{
		font-size:0.9rem; 
	}

	/*購入先リンク*/	
	.link{
		display: inline-block; 
		width:366px; 
		margin:0 21px;
		font-size:0; 
		line-height:0; 
		vertical-align:top; 
		padding: 50px 0 0 0;}
}

@media screen and (max-width:481px) {
	/*footer*/
  footer {
    width: 100%;
    text-align: left;
    margin: 0;
    padding: 0;
    display: block;
  }
  address {
    width:100%;
  }
  address ul {
    margin: 0;
    padding: 0;
    height: auto;
  }
  address ul li {
    text-decoration: none;
    font-style: normal;
    font-size: 13px;
    line-height: 1;
    color: #FFF;
    float: none;
    border-left: none;
    height:auto;
    margin-left: inherit;
    padding-left: inherit;
  }
  address ul li.ad1,
  address ul li.ad2 {
    position: inherit;
    top:inherit;
    left:inherit;
    right:inherit;
  }
  address ul li.ad1 {
    text-align: center;
    margin: 13px 0 0 0;
    font-size: 9px;
  }
  address ul li.ad2 {
    display: block;
    text-align: center;
    text-indent: -9999px;
    width: 78px;
    height: 24px;
    margin: 0 auto 0 auto;
    padding: 20px 0 35px 0;
    background-image: url(../img/kob_logo-wh.png);
    background-position: center;
    background-repeat: no-repeat;
  }
  address ul li a {
    text-decoration: none;
    color: #FFF;
  }
  address ul li a div {
    padding: 17px;
    border-bottom: #666 dotted 1px;
  }
}

	@media screen and (max-width:425px) {
	/*インナー*/
	.online_store_wrap { 
		width:auto; 
    height: auto;
    position: relative;
    display: block;
    margin: 40px auto 110px auto;
    text-align: center;
    background: url(../img/bg.png) repeat;
    padding: 50px 0 50px 0;
		}

	/*書影テキストボックス*/	
	.Box {
		display: flex; 
		flex-direction: column; 
		width: 100%; 
		margin:0 auto;
		}

	.syoei_image{
		width: 75vw;
	}

	/*購入先リンク*/	
	.link{
		display: inline-block; 
		width:366px; 
		margin:0 auto 0 auto;
		padding:30px 0 0 0; 
		font-size:0; 
		line-height:0; 
		vertical-align:top;}
	}

	@media screen and (max-width:376px) {
	header { 
		background-image:url(../img/bg.gif); 
		background-repeat:repeat-x; 
		background-position:bottom; 
		display:block; 
		position:relative; 
		height:75px; 
		text-align:center; 
		margin:0;
		padding:0; 
		}

	header img {
		width:84px; 
		height:auto; 
		margin:14px auto 0 auto; 
		vertical-align:top; 
		display:inline-block;
		}

	/*インナー*/
	.online_store_wrap { 
		width:100%; 
		height:auto; 
		position:relative; 
		display:block; 
		margin:15px auto 30px auto;
		text-align:center;
		}

	/*購入先リンク*/	
	.link{
		display: block; 
		width:80vw; 
		margin:0 auto; 
		padding:30px 0 0 0; 
		}

	.link_box{
		width:100%; 
		margin:0; 
		padding:0;
		}

	/*購入先はこちら*/
	.link_buy{ 
		padding:18px 0; 
		margin:0 1vw 2vw 1vw;
		}

	.link_buy_image{
		height:18px; 
		width:auto; 
		margin:0 auto;
		}

	/*購入先一覧*/	
	.link_list{
		text-align:left; 
		width:100%; 
		margin:0;
		padding:0;
		}

	/*購入先*/	
	.link_item{
		margin:0 1vw 2vw 1vw; 
		display: inline-block; 
		width:38vw;
		}
	}

	.link_item_image{
		height:58px; 
		width:120px; 
		margin:0 auto;
		}

	@media screen and (max-width:321px) {
	/*インナー*/
	.online_store_wrap { 
		width:100%; 
		height:auto; 
		position:relative; 
		display:block; 
		margin:4.687% auto 60px auto; 
		text-align:center;
		}

	/*購入先リンク*/		
	.link { 
		display: block; 
		width:96.25%; 
		margin:0 auto 1.25% auto; 
		padding:30px 0 0 0; 
		font-size:0; 
		line-height:0; 
		vertical-align:top;
	}

	/*購入先はこちら*/
	.link_buy { 
		background-color:#1270ba; 
		padding:5.625vw 0 5.625vw 0 ; 
		margin: 0 1.25% 2.5vw 1.25%;
		width:auto;
		}

	.link_buy_image { 
		height:5.625vw;
		width:auto; 
		margin:0 auto;
	 }

	/*購入先一覧*/
	.link_list {
		text-align:left; 
		width:100%; 
		margin:0;
		padding:0;
		}

	/*購入先*/
	.link_item {
		margin:0 1.25% 2.5vw 1.25%; 
		display: inline-block; 
		width:47.2%; 
		height:19.375vw;
		}
}