@charset "utf-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}

a img {border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

body{
font: 12px/1.5 "メイリオ","Meiryo",arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
-webkit-text-size-adjust: none;
background:#e2f4fe!important; color:#333;  text-align: center;
}
/*background:#f5f3f2!important; */

/* !Layout
---------------------------------------------------------- */
html {
	overflow-y: scroll;
	font-size: 62.5%;
}
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/*img {
	max-width: 100%;
	height: auto;
}
*/


/* リンク設定
------------------------------------------------------------*/
a{
margin:0;
padding:0;
text-decoration:none;
outline:0;
vertical-align:baseline;
background:transparent;
font-size:100%;
color:#313131;
}

a:hover, a:active{
outline: none;
color:#6f6f6f;
text-decoration:underline;
}


/* レイアウトbackground:#fff; display: flex;
*****************************************************/
#wrapper, #wrapper_top {max-width:1100px;  margin:0 auto; padding:20px; }

#wrapper {background: #fff; }
#wrapper_top {background: #fffde1;}

#wrapper img {max-width:1000px;} 
#wrapper_top img {max-width:1000px;} 





/* ヘッダー
*****************************************************/

.header {  font-size:81.25%;color:#312d2a; 
background-image:url("../img/logo_back.png");  background-size:contain; 


border-bottom: 25px solid #595757;
background-size:auto 95px;
background-position: 10px 10px;
height:135px;  padding:5px 0px; }

.logo { float:left;  padding:0; }
.logo img { height:95px; }







/*  box-search
------------------------------------------ */
.header div#box-search{ float:right;padding:0px 5px; position:relative; }

@media only screen and (min-width: 601px){
.header div#box-search{ margin-top:53px; }

#floatMenuArea{float:right ; text-align:right; }
.searchLine{ margin-right:10px; ;z-index:100;}
.searchLine a{font-size: 14px;   }
.searchLine li:before{  margin:0 15px; }
.searchLine li:before{ content:"/" ; }
.searchLine li:nth-of-type(1):before{ color:white ; margin:0px; }
.searchLine li{float:left; display:inline-block; }

#floatMenu{ display:none; }

}


@media only screen and (max-width: 600px){
.header div#box-search{ margin-top:30px; }
.searchLine{  float:left; z-index: 200; width: 48px;height:25px; }
/*プルダウンメニュー*/
.searchLine li a {
width:100%;
display:inline-block;
text-decoration: none;text-align:center;
padding: 10px 30px;
font-size:14px; color: #fff;
border-bottom: 1px solid #929292;

}
.searchLine li:last-child a{ border-bottom:none; }
.searchLine li a { color:#fff; display:block;white-space:nowrap}
.searchLine li a:hover { color:#000; }

	#floatMenu:hover { background:none; }
	#floatMenuArea {
		position: absolute;
		top: 55px;
		right: 20px;/*プルダウンメニュー左右の位置*/
		-webkit-transition: all .3s;
		transition: all .3s;
		background-color: #555555;
		z-index:1000;
		color:#fff;
		max-height:0;
		overflow:hidden;
		opacity:0;
	}

	#floatMenuArea:before {
  content: '';
  display: inline-block;
  position: absolute;
  top:40px;/*プルダウンメニュー上矢印の位置*/
  left: 106px;
  width: 0;
  height: 0;
  margin-top: -70px;
  border-top: 15px solid transparent;
  border-right: 16px solid transparent;
  border-bottom: 15px solid #555;
  border-left: 16px solid transparent;
		}

	#floatMenu .toggle {
cursor: pointer; 
position: absolute; left: 2px; top: 11px;
background-image:url("../img/3.png"); 
    background-size:contain;                               /* 画像のサイズを指定    */
    width:36px;                                            /* 横幅のサイズを指定    */
    height:30px; 

	}


	#floatMenu .toggle:hover { text-decoration: underline; }
	#menuOpen { display: none; }
	#floatMenuArea.open {
		max-height:500px;
		overflow:inherit;
		opacity:1;
	}


	}



@media only screen and (max-width: 768px){

	#floatMenu .toggle
 { cursor: pointer; position: absolute; left: 2px; top: 8px;}

	}



/* お知らせ
*****************************************************/

.news { max-width:1000px; padding:10px ;background: #fff;  border : 1px solid #90c31f;  }
.news li { text-align:left;word-wrap: break-word;}


/* フッター
*****************************************************/
footer { text-align:center; max-width:1100px;background:#fff;color:#7d7d7d;font-size:11px}
footer a:nth-of-type(1) img { height:70px;border:1px solid #ccc;padding:5px 10px}
footer img { height:50px;margin:5px 5px ; }





table {width:100%;}


.gray td {border-bottom: solid 2px #ffffff;letter-spacing:1px;
border-left: solid 2px #ffffff; font-size:15px; line-height:24px;padding:5px 10px;color:#000;background:#EDEDED}

.common:nth-of-type(3)  {border-top: solid 2px #e4e4e3;}
.common {
/*border-top: solid 2px #e4e4e3;*/
border-right: solid 2px #e4e4e3;
margin-bottom:30px
}

.common td {
border-bottom: solid 2px #e4e4e3;
border-left: solid 2px #e4e4e3; 
font-size:15px; line-height:24px;padding:10px;letter-spacing:1px;

color:#fff;background:#545452;}

.common td:nth-of-type(1) {font-weight:bold;white-space:nowrap;}
.common td:nth-of-type(1) b {font-weight:bold;color:red;}
.common td:nth-of-type(2) {color:#000;background:#fff;}
.common td:nth-of-type(2) b {color:red;font-size:15px;display:inline-block;margin-right:5px}
/*.common td:nth-of-type(2) b:nth-of-type(2) {margin-left:20px}*/

.common label{line-height:60px;padding-right:40px;font-size:15px;white-space:nowrap;}

.inp60{width:80%}

@media only screen and (max-width: 768px){
.common td {font-size:13px;  line-height:28px;}
.common td{display:block;}
.common td:nth-of-type(2) {padding:15px;}
.inp60{width:80%}
.type2 td {width:100%!important;}
.common td:nth-of-type(2) b:nth-of-type(2) {margin-left:0px}
input[name=adr1],
input[name=adr2],
input[name=adr3],
input[name=adr4],
input[name=sp_adr1],
input[name=sp_adr2],
input[name=sp_adr3],
input[name=sp_adr4]
{ width:100%!important; }
	}
.common td:nth-of-type(1) p{font-size:12px}

.type2 td:nth-of-type(1) {width:32%;}
.type2 td:nth-of-type(2) {font-size:12px;line-height:18px;}


.type2 input {max-width:100%!important;}

.grayframe {border-right: solid 2px #e4e4e3;border-bottom: solid 2px #e4e4e3;}
.grayframe td {border-top: solid 2px #e4e4e3;letter-spacing:1px;
border-left: solid 2px #e4e4e3; font-size:15px; line-height:24px;padding:10px;color:#000;background:#fff}
.grayframe td:nth-of-type(1) {font-weight:bold;white-space:nowrap}
.grayframe td:nth-of-type(2) { min-width:80%;}
.grayframe img {max-width:599px;width:100%}

.grayframe b{font-weight:normal;font-size:14px;margin-left:30px}
.uline {border-bottom: solid 2px #e4e4e3;}

.grayframe2 {border-right: solid 1px #e4e4e3;border-top: solid 1px #e4e4e3;}
.grayframe2 td {
border-bottom: solid 1px #e4e4e3;
border-left: solid 1px #e4e4e3; 
font-size:13px; line-height:20px;padding:10px 0px 10px 10px ;letter-spacing:1px;color:#000;background:#fff}



/*ボタン*/
.botan01 {
min-width:200px;height:35px; white-space:nowrap;font-weight:bold;padding:0px 30px; font-size:15px;line-height:35px; cursor:pointer; display:inline-block;
color:#ffffff!important; text-decoration:none!important; text-align:center;margin:5px  ; 
}

/*ボタン*/
.botan01 {
background: #ffaa00;
border-radius:5px;
-ms-border-raduis:5px;
}

.botan01:hover {color:#ffffff;  background: #47b1d6; text-decoration:none;}

.otodoke{font-size:18px;font-weight:bold;width:100%;text-align:left}

.thanks{ display:inline-block;font-size:18px;font-weight:bold;padding:50px  ; }

.hidden_box, .hidden_box p {
    margin: 0;
    padding: 0;
}

/*ボタン装飾*/
.hidden_box label {
display:block;color:#000;line-height:45px;
    cursor :pointer;
    transition: .5s;

}
.hidden_box label img{ margin-right:10px }
/*アイコンを表示*/
.hidden_box label:before {
}

/*ボタンホバー時*/
.hidden_box label:hover {
    opacity: 0.6;
}

/* for cvs */
.bsps-plus-cvs label {
    display: inline;
    color: #000;
    line-height: 45px;
    cursor: pointer;
    transition: .5s;
}

/*チェックは見えなくする*/
.hidden_box input[type=checkbox] {
    display: none;
}
input[name=o_gift]{
    display: inline-block!important;
}

/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.hidden_box input:checked + label + .hidden_show {
    padding:  0;
    height: auto;
    opacity: 1;
}

@media only screen and (max-width: 455px){
/*ボタン装飾*/
.hidden_box label {
display:block;color:#000;line-height:23px;
    cursor :pointer;
    transition: .5s;
border-bottom: solid 2px #595656; 
}

/* for cvs */
.bsps-plus-cvs label {
    display: inline;
    color: #000;
    line-height: 23px;
    cursor: pointer;
    transition: .5s;
    border-bottom: solid 0px; 
}

}


table select  {margin-right:26px; width:160px; height:30px;

	background: url(https://www.bookshop-ps.com/arrow02.png) right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#fff 100%);

	background: url(https://www.bookshop-ps.com/img/arrow02.png) right 50% no-repeat, linear-gradient(to bottom, #fff 0%,#fff 100%);
	background-size: 20px, 100%;
margin: 5px ;  padding:5px


height: 25px; line-height:20px;
border: solid 1px #dcdcdc;

-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
outline: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

select[name='jbs_ex_mm'] ,select[name='jbs_ex_yy']  {width:80px!important}


input[type='checkbox']   {
width:20px; 
height:20px;
  position: relative;
  display: inline-block;
  border-radius: 3px;
  border: 1px solid #333;
  background: #fff;
  -webkit-appearance: none;
  appearance: none;
}
input[type="checkbox"]:checked {
  border:none;
  background-image: url("https://www.bookshop-ps.com/img/check.gif");
  background-repeat: no-repeat;
  background-size: cover;
}
input[type='radio']   {
margin-bottom:-4px;margin-right:8px;
width:20px; 
height:20px;
  position: relative;
  display: inline-block;
  border-radius: 10px;
  border: 1px solid #333;
  background: #fff;
  -webkit-appearance: none;
  appearance: none;
}
input[type="radio"]:checked {
width:20px; 
height:20px;
  border:none;transition:all .2s ;
  background-image: url("https://www.bookshop-ps.com/img/radio.gif");
  background-repeat: no-repeat;
  background-size: cover;
  border: 0px solid #c5051b
}


input   {
padding: 5px 2px;
margin: 0px 3px 0px 0px;
border: solid 1px #dcdcdc;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #eee;
outline: 0;
}







.faq { padding:10px 20px 20px 20px ; display:inline-block; max-width:820px;background:#fff; }

.faq p { background:#595656; font-size:20px;  color:#fff; padding:5px ; font-weight:bold; }

.faq li , .faq li a  { font-size:14px; padding:10px 0px 10px 5px ; color:#595656; text-decoration:none; }
.faq li { background:#fff; float:left; display:inline-block;
text-align:left;border-bottom: solid 1px #dcdcdc; }
.faq li { width:50%;}
.odd58 li:nth-child(even) { width:45%;}
.odd58 li:nth-child(odd) { width:55%;}

.faq li img{ height:30px; vertical-align: middle; }
.faq li p{ display:inline-block; text-align: center;}
.faq li a { font-size:14px; }
.faq li {float:left; height:35px;}


@media only screen and (max-width: 550px){
.faq  { width:100%!important }
.faq li {clear:both!important;width:100%!important;height:25px!important ; }
.faq li , .faq li a { font-size:13px; padding:3px!important ; }

.faq li:nth-child(18) {display:none;}


.heading{width:110%;}
}




#guidebody,
#guidebody2 {background:#fff;
max-width:820px;
font-size:14px;line-height:23px;
text-align:left;

padding:20px;
}

#guidebody{ }


#guidebody,
#guidebody li,
#guidebody ul,
#guidebody table td
{ font-size:14px;line-height:23px; }

#guidebody p { background:#595656; font-size:18px;  color:#fff; padding:8px ; font-weight:bold;text-align:center; }


#guidebody span {padding:15px; display:block}


#guidebody ul li:before {
position:relative; 
display: inline-block;
background:url("img/ten.gif") no-repeat 3px 3px;
background-size   : 25px 25px;
}
/*content: "■"; */
#guidebody li:before { color:#595656; font-size:23px; margin-left:-15px}
#guidebody li{ margin-left:15px; list-style-type: square}
#guidebody ul{ list-style-type: none; }

#guidebody a ,  #guidebody a b, #guidebody2 a 
{  color:#595656;}

#guidebody b{font-weight:bold }
.heading{font-weight:bold;  background:#7fb4ce; display:inline-block;padding:5px 10px;width:100%;margin-bottom:10px; }
#guidebody table{width:100%; }
#guidebody table td{font-size:14px line-height:22px}


#guidebody h1{ width:40%; }
#guidebody h2{ margin:0px;color:blue;line-height:26px; width:90%;float:left; }
#guidebody h3{ margin:0px;color:blue; width:100%;float:left;  }
#guidebody h4{ width:30%;text-align:center; }




#guidebody #kiyaku a {float:right; color:white}

#guidebody 
#modal1 ul , #modal2 ul {
    padding-left: 13px;   margin: 0;text-align: left;
}


#guidebody table td{padding: 5px;  }
#guidebody table {margin-top:3px; border-top: solid 2px #595656; }
#guidebody table img { margin:3px; }
#guidebody table b { font-weight:bold; }
#guidebody table td:nth-child(1) {  background:#595656;  color:#fff; white-space:nowrap}
#guidebody tabletd { vertical-align:middle; padding:10px 0px 10px 10px !important ; background:#fff; }
#guidebody table td {border-bottom: solid 1px #dcdcdc;  }





.close img {
	width: 200px;margin:20px
}




.foms {border: solid 1px #8E8E8E; font-size:13px;line-height:24px;
padding:0px; margin:0px; }

.foms2 {border: solid 1px #8E8E8E; text-align: left; }

#guidebody2 Iframe{margin:0px; width:100%;height:80%} 



.gp{ background:#EDEDED;padding:15px;font-weight:normal!important;font-size:14px!important }
.gp b{ font-size:16px!important}
.gp a{ text-decoration:underline; }

.marumoji { color:red; font-weight:bold;font-size:20px;
float:left; 
margin-right:3px; display:inline-block; overflow:hidden; clear:both;}

.sample {width:100%; border: solid 1px #8E8E8E; }

.sss {font-size: 20px; line-height:40px; color: blue;}






.campaign {text-align:left; color: #ca372d;font-size:15px; line-height:28px;border-bottom:#333 3px solid;width:100%; font-weight:bold;
  font-family:
    "Hiragino Kaku Gothic W6"}
.campaign b{ font-size:27px;color:#333 ;display:inline-block; margin-right:20px}










.s_guest { width:400px; display:block; font-size:17px;letter-spacing: 1px; padding:10px; ;text-align:left;background:#fff;margin-top:15px;margin-top:15px;font-weight:bold;color:#666;
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;}



/*font-weight:bold;font-weight: 600;*/

.s_login {  background: #e60000; text-align:center;padding:15px ;}

.s_login div {  display: inline-block;width:100%;
background: #fff; text-align:center;padding:25px ; border-radius: 30px;
color:#666;font-size:18px;font-weight: 600;
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
}
.s_login hr {
  height: 0;

  padding: 0;
  border: 0;
width:350px; border-top: 2px solid #dad691;margin:15px 0px; display: inline-block;}

.s_login p {  border-radius:65px;border: solid 8px #e60000; display: inline-block;}

.s_login span {
  position: relative;
  top: 0;
  display: inline-block;
  padding:25px 20px; letter-spacing:0.1rem; 
  background: #e60000;
  border-radius: 50px;
  font-size: 25px; color: #fff;font-weight:bold;
  text-decoration: none;
  transition: .2s ease-in-out;
border: solid 5px #fff; 
}

.s_login img {height: 95px; margin-bottom:10px}
 a .s_login:hover { opacity: 0.6;   transition:all .3s; }
 a .s_login:hover img { opacity: 1; }
.s_login a:hover {text-decoration:none;}


/*.s_login a:hover {
  top: 5px; 
  box-shadow: 0 0 #4C0F13;
}
*/


@media only screen and (max-width:680px){

.s_login div { font-size: 15px; padding:25px 15px; }
.s_login span {   font-size: 18px; padding:10px;   ;}

.s_login hr {width:70%; }
.s_guest { width:100%;padding:0px;  }


}


#shoidcheck input{ vertical-align: sub; }

input[type='radio']   {vertical-align: sub;}
/*
.type2 input[type='radio']   {vertical-align: sub; float:left;margin-top:10px }
.type2 label  {vertical-align:float:left; sub; }

*/