@charset "SHIFT_JIS";

/*
	ご優待特典 css
*/

/* =============================================== */
/** 基本パーツ
/* ----------------------------------------------- */

body {
	margin: 0 auto;
	padding: 0;
	background: #fff;
	color: #333;
	line-height: 1.3;
	text-align: center;
}

img{
	border: none;
}

#exclusive-contents {
	width: 980px;
	margin: 0 auto;
	text-align: center;
	padding: 0 0 20px 0;
}
/*--共通
------------------------------------------------*/	
.ECPC {
	display:block;
}
.ECMB {
	display:none;
}

.fs18px {
	font-size: 18px;
}
.fs20px {
	font-size: 20px;
}
.fs30px {
	font-size: 30px;
}
.fwbold {
	font-weight: bold;
}
.m-t10 {
	margin-top: 10px;
}
.m-t20 {
	margin-top: 20px;
}

/*--ヘッダ--*/

.header__wrap {
  width: 980px;
}
.header__position {
  margin: 0px 0px 10px 0px;
}
.header__position--borderBottom {
  border-bottom: 4px solid #003894;
}
.header__Inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin: 20px 0px 10px 0px;
}
.header__logo {
  display: flex;
  align-items: end;
  margin: 0 0 2px 0;
}
.header__logo a {
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
}
.header__logo a:hover {
  opacity: .65;
}
.header__logo img {
  width: 250px;
  height: auto;
}
.header__accountWrap a {
  display: flex;
  align-items: center;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
  color: #333;
  text-decoration: none;
}
.header__accountWrap a:hover {
  opacity: .65;
  color: #333;
  text-decoration: none;
}
.header__accountIcon {
  margin: 0px 10px 0px 0px;
}
.header__accountIcon img {
  width: 24px;
  height: auto;
}
.header__accountName {
  max-width: 300px;
  text-overflow: ellipsis;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0px 4px 0px 0px;
  font-size: 12px;
  word-break: break-word;
}
.header__accountHonorific {
  font-size: 12px;
}

.footer__Wrap {
  margin: 0px 0px 0px 0px;
}
.footer__Inner {
  background-color: #f5f5f5;
  padding: 40px 40px 20px 40px;
  word-break: break-word;
}
.footer__naviWrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0px 0px 30px 0px;
}
.footer__naviInner {
  width: calc(100% / 3);
}
.footer__naviHeading {
  margin: 0px 40px 10px 0px;
}
.footer__naviHeading--last {
  margin: 0px 0px 10px 0px;
}
.footer__naviHeadingTxt {
  border-bottom: 1px solid #ccc;
}
.footer__naviHeading span {
  display: block;
  font-size: 16px;
  font-weight: bold;
  padding: 0px 0px 10px 0px;
}
.footer__navi {
  margin: 0px 40px 10px 0px;
  font-size: 14px;
}
.footer__rulesWrap {
  margin: 0px 0px 30px 0px;
}
.footer__rulesInner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.footer__rules {
  padding: 0px 20px 0px 0px;
  font-size: 12px;
}
.footer__navi a ,
.footer__rules a {
  color: #336699;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
}
.footer__navi a:hover ,
.footer__rules a:hover {
  color: #336699;
  text-decoration: none;
  opacity: .65;
}
.footer__Copyright {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-size: 12px;
}


@media screen and (max-width: 767px){

.header__position {
}
.header__position--borderBottom {
  border-bottom: 4px solid #003894;
}
.header__Inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin: 14px 16px 12px;
}
.header__logo {
  display: flex;
  align-items: end;
  margin: 0 0 6px 0;
}
.header__logo a {
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
}
.header__logo a:hover {
  opacity: .65;
}
.header__logo img {
  width: 176px;
  height: auto;
}
.header__accountWrap a {
  display: flex;
  align-items: center;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
  color: #333;
  text-decoration: none;
}
.header__accountWrap a:hover {
  opacity: .65;
  color: #333;
  text-decoration: none;
}
.header__accountIcon {
  margin: 0px 10px 0px 0px;
}
.header__accountIcon img {
  width: 24px;
  height: auto;
}
.header__accountName {
  max-width: 70px;
  text-overflow: ellipsis;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0px 4px 0px 0px;
  font-size: 12px;
  word-break: break-word;
  text-align: left;
}

.footer__Wrap a {
  color: #336699;
}
.footer__Inner {
  background-color: #f5f5f5;
  word-break: break-word;
}
.footer__naviWrap {
  background-color: #fff;
}
.footer__naviInner {
  text-align: left;
}
.footer__naviHeading {
  background: url(https://content.bookoffonline.co.jp/files/sellfund/images/arrow_down.png) no-repeat 94% 55%;
  background-size: 14px;
  cursor: pointer;
}
.footer__naviHeadingTxt {
  border-top: 1px solid #ccc;
}
.footer__naviHeading span {
  display: block;
  font-size: 16px;
  padding: 16px 10% 16px 30px;
}
.footer__naviDisplay{
  padding: 10px 0px;
}
.footer__naviDisplay--borderTop{
  border-top: 1px solid #ccc;
}
.footer__navi {
  padding: 10px 30px 10px 30px;
  font-size: 14px;
}
.footer__rulesWrap {
  border-top: 1px solid #ccc;
}
.footer__rulesPosition {
  margin: 20px 0px 20px 0px;
}
.footer__rules {
  text-align: left;
  padding: 10px 30px 10px 30px;
  font-size: 14px;
  color: #336699;
}
.footer__navi a ,
.footer__rules a {
  text-decoration: none;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
}
.footer__navi a:hover ,
.footer__rules a:hover {
  color: #336699;
  text-decoration: none;
  opacity: .65;
}
.footer__copyrightWrap {
  padding: 10px 30px 30px;
  text-align: center;
}
.footer__copyright {
  font-size: 12px;
  color: #333;
}
	
.footer__rulesInner {
  display: block;
}
.footer__rules {
  text-align: left;
  padding: 10px 30px 10px 30px;
  font-size: 14px;
  color: #336699;
}

.footer__Inner {
  padding: 0;
  word-break: break-word;
}

}	
	
@media screen and (max-width: 332px){
  .header__accountName {
    max-width: 58px;
  }
}
.header__accountHonorific {
  font-size: 12px;
}



/*--title Area
------------------------------------------------*/	
.exclusive-top-textBox {
	text-align: center;
	padding: 20px 0 10px;
	font-size: 30px;
    line-height: 150%;
    font-weight: bold;
}
.exclusive-logoBox {
	text-align: center;
	padding: 20px 0;
}

.exclusive-top-textdetailBox {
	font-size: 18px;
	line-height: 150%;
	background-color: #ffd200;
	padding: 20px 40px;
}
.exclusive-top-textdetail-up {
	color: #d20101;
	font-weight: bold;
	font-size: 32px;
}
.exclusive-top-textdetail-up-bk {
	color: #000;
	font-weight: bold;
	font-size: 32px;
}
.exclusive-text-blue {
	color: #0068b7;
}
.exclusive-text-red {
	color: #e84100;
}
.exclusive-inner {
	width: 980px;
	margin: 0 auto;
	background-color: #fff;
	font-size:16px;
}

.exclusive-top-up-pc {
	display: block;
	margin-bottom: 10px;
}
.exclusive-top-up-mb {
	display: none;
}


.title-exclusive-pc {
	display: block;
}
.title-exclusive-mb {
	display: none;
}
.title-exclusive-box {
	margin-bottom:40px;
}


.block-word {
	display: inline-block;
}
.check-listBox {
	font-size: 16px;
	display: inline-block;
 *display: inline *zoom: 1 text-align: left;
	vertical-align: top;
	width: 412px;
}
.check-list {
	text-align: left;
	line-height: 150%;
}
.under-line-yl {
	display: inline;
	background: url(images/exclusive/line-bg-yl.png) repeat-x 0 100% rgba(0, 0, 0, 0);
	padding: 0 2px 0;
}
.exclusive-flow-sell-img {
	display: inline-block;
 *display: inline *zoom: 1 vertical-align: top;
}
.exclusive-flowBox {
	font-size: 0;
	margin-bottom: 60px;
}
.exclusive-flow-sell-pc {
	display:block;
}
.exclusive-flow-sell-mb {
	display:none;
}

.exclusive-detail-pic-pc {
	display:block;
}
.exclusive-detail-pic-mb {
	display:none;
}

.check-list-head {
	font-size:26px;
	line-height: 150%;
}
.clearfix:after {
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
.clearfix {
	min-height: 1px; /*IE6、7対策*/
}
* html .clearfix {
	height: 1px;
	/*\*//*/ /*MAC IE5.x対策*/
	height: auto;
	overflow: hidden;/**/
}
.exclusive-detailBox {
	background-color: #003894;
	font-size: 0;
	margin-bottom: 40px;

}
.exclusive-detail-pic {
	display: inline-block;
 *display: inline;
 *zoom: 1;
	vertical-align: top;
	height: 240px;
	width: 447px;
}
.exclusive-detail-textBox {
	font-size: 16px;
	color: #fff;
	display: inline-block;
 *display: inline;
 *zoom: 1;
	vertical-align: top;
	text-align: left;
	padding: 35px;
	width: 304px;
}
.exclusive-detail-textBox-head {
	font-size:26px;
	font-weight: bold;
	color: #ffe13a;
	line-height: 150%;
	vertical-align: top;
	margin-bottom: 10px;
}

.exclusive-detail-textBox-text {
	line-height: 170%;
}

/*--couponbox Area
------------------------------------------------*/	
.exclusive-couponBox {
	width:900px;
	margin: 0 auto;
	padding: 40px;
	background-color:#eee;
}
.exclusive-coupon-ttl {
	font-size:24px;
	line-height: 130%;
	margin-bottom: 20px;
	font-weight: bold;
}
.exclusive-coupon-txtBox {
	text-align: center;
}

.exclusive-coupon-txt {
	font-size:16px;
	line-height: 130%;
	background-color: #ffe13a;
	height: auto;
	width: 780px;
	padding: 20px 0;
	margin: 0 auto 30px;
	text-align: center;
	
}


.exclusive-coupon-percent {
	font-size:26px;
	font-weight:bold;
	color: #d20101;
}
.exclusive-coupon-inner p {
	font-weight: bold;
	font-size: 14px;
	line-height:150%;
}
.exclusive-coupon-inner input {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    padding: 8px;
    width: 400px;
    height: 80px;
	margin-bottom: 20px;
}
.exclusive-evi-date {
	margin-bottom: 20px;
}
.exclusive-evi-copy {
	font-size: 18px;
	font-weight: 150%;
}


/* リンクボタン */
.exclusive-button-box {
	margin-bottom: 20px;
}

.exclusive-button {
	display: table-cell;
	width: 500px;
	height: 80px;
	background: -webkit-linear-gradient(#ea5201, #e73900);
	background: -moz-linear-gradient(#ea5201, #e73900);
	background: linear-gradient(to bottom, #ea5201, #e73900);
	background-color: #e73900;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	color:#FFFFFF;
	font-size: 28px;
	font-weight: bold;
	vertical-align: middle;
	border: solid 1px #e73205;
	line-height: 1;
}
a.exclusive-button-link {
	text-decoration: none;
}
.exclusive-button-link:hover {
	text-decoration: none;
	color: #FFFFFF;
	opacity:0.9;
	filter: alpha(opacity=90);
	-ms-filter: "alpha( opacity=90 )";
	top:1px;
	position:relative;
}
/*--attention Area
------------------------------------------------*/	
.exclusive-attentionBox {
	width:760px;
	margin: 30px auto;
	text-align: left;
	line-height: 170%;
	font-size: 14px;
}
.exclusive-attentionBox p {
}
.exclusive-attentionBox ul li {
	list-style: none;
	margin-bottom: 10px;
}
/*--/QandA Area
------------------------------------------------*/	
.exclusive-head-QA p {
	padding:20px 24px;
	border:1px solid #ccc;
	background-color:#f5f5f5;
	text-align:left;
	margin-bottom: 30px;
	font-size: 20px;
	font-weight: bold;
}
.exclusive-QAbox {
	margin: 0 20px 30px 20px;
}
.exclusive-QA-icon {
	float:left;
	width:40px;
}
.exclusive-QA-textBox {
	float:none;
	width:auto;
	margin:0px 0px 20px 50px;
	text-align:left;
	font-size: 14px;
	line-height: 160%;
}
.exclusive-QAbox:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0;
	clear: both;
	visibility:hidden;
}
.exclusive-QA-Qtext {
	padding-top: 8px;
	margin: 0 20px 10px 0;
	font-size: 18px;
	font-weight: bold;
	line-height: 140%;
}
.exclusive-QA-morelink {
	font-size: 14px;
	text-align: right;
}
/*--customer-center Area
------------------------------------------------*/
.exclusive-otherContact {
/*	width:800px; */
	margin: 0 0 5px 20px;	
	font-size: 16px;
	font-weight: bold;
	text-align: left;
}

.exclusive-about-customer-centerBox {
/*	width:800px; */
	padding:16px 24px;
	border:1px solid #ccc;
	background-color:#f5f5f5;
	text-align:center;
	margin: 0 auto 30px;
	line-height: 150%;
}

.exclusive-about-customer-centerBox p {
	line-height:150%;
	margin-bottom: 25px;
}
.exclusive-customer-center {
	font-size: 20px;
	font-weight: bold;
}
.exclusive-freedialBox {
	text-align: center;
}

.exclusive-freedial-icon {
	vertical-align: top;
	margin-right: 5px;
	font-size:18px;
	padding-bottom: 8px;
}
.exclusive-freedial-number {
	vertical-align: top;
	font-size:18px;
	padding-left: 8px;
}
.exclusive-freedial-number-txt {
	vertical-align: top;
	font-size:16px;
	line-height: 22px;
}

.exclusive-freedial-number a {
    color: #0033ff;
    text-decoration: underline;
} 

/*--Main Area
------------------------------------------------*/
#main {
	width: 983px;
	margin: 0 auto;
	text-align: left;
	overflow-x: hidden;
}
/*--Related Links Area TOPページへ 
------------------------------------------------*/
#rel_link {
	background:url("../images/parts/rellink_bg.gif") repeat-x #FFFFFF top left;
	padding:12px 0px 14px 0px;
	margin: 0px;
	font-weight:bold;
	width:980px;
}
#rel_link .link_r {
	margin:0 0 0 13px;
	padding:0px 0px 0.4em 1.6em;
	background: url("../images/parts/arrow_r.gif") no-repeat top left;
}
#rel_link .link_l {
	margin:0 0 0 13px;
	padding:0px 0px 0.4em 1.6em;
	background: url("../images/parts/arrow_l.gif") no-repeat top left;
}
#rel_link span.lead {
	font-weight:normal;
	padding-left:0px;
}
#rel_link .link_rs {
	font-weight:normal;
}


/* ############## 620px以下 ############## */	
 @media screen and (max-width: 620px) {
#main, #exclusive-contents, .exclusive-inner {
	width: 100%;
	text-align: center;
}
.ECPC {
	display:none;
}
.ECMB {
	display:block;
}
.ECImgArea img{
	width: 100%;
	height: auto;
}
	 
	 
.logo {
	position: static;
	display: inline;
}

	 
#footer {
	display:none;
}
 
	 
	 
	 
	 
/*--title Area MB
------------------------------------------------*/	
.exclusive-top-textBox {
	text-align: center;
	padding: 20px 0 0 0;
	font-size: 18px;
	margin: 0 5%;
}
.exclusive-logoBox {
	padding: 10px 0 0 0;
}
.exclusive-top-textdetailBox {
	font-size: 16px;
	padding: 20px 5%;
	text-align: center;
}
.exclusive-top-textdetail-up {
	font-size: 18px;
}
.exclusive-top-textdetail-up-bk {
	font-size: 18px;
}

.exclusive-inner {
	margin: 0;
}

.exclusive-top-up-pc {
	display: none;
}
.exclusive-top-up-mb {
	display: block;
	margin: 10px 0;
}


.title-exclusive-pc {
	display: none;
}
.title-exclusive-mb {
	display: block;
}
.title-exclusive-box {
	margin-bottom:0px;
}
.check-listBox {
	display: block;
	margin: 0 auto;
	width:90%;
}
.exclusive-flow-sell-img {
	display: block;
}
.exclusive-flowBox {
	margin-bottom: 20px;
}
.exclusive-flow-sell-pc {
	display:none;
}
.exclusive-flow-sell-mb {
	display:block;
}

.exclusive-detail-pic-pc {
	display:none;
}
.exclusive-detail-pic-mb {
	display:block;
	margin: 0 auto;
	text-align: center;
}

.check-list-head {
	font-size:20px;
}
.exclusive-detailBox {
	display: block;
	height: auto;
	padding: 5%;
	margin-bottom: 20px;
}
.exclusive-detail-pic {
	display: block;
	width:100%;
	height:auto;
	margin-top: 0;
}
.exclusive-detail-textBox {
	display: block;
	width:100%;
	height:auto;
	margin: 0;
	text-align: left;
	padding: 10px 0 0 0;
	width: 100%;
}
.exclusive-detail-textBox-head {
	font-size:18px;
}

.exclusive-detail-textBox-text {
	line-height: 170%;
}

/*--couponbox Area MB
------------------------------------------------*/	

.exclusive-couponBox {
	width: 90%;
	margin: 0;
	padding: 5%;
	text-align:left;
}
.exclusive-coupon-ttl {
	font-size:18px;
	margin-bottom: 20px;
}

.exclusive-coupon-txtBox {
	width: 100%;
}

.exclusive-coupon-txt {
	width: 90%;
	padding: 5%;
	font-size:16px;
	line-height: 130%;
	height: auto;
	margin: 0 auto;
	text-align: center;
}


 

.exclusive-coupon-percent {
	font-size:18px;
}
.exclusive-coupon-inner input {
	font-size: 18px;
	padding: 15px 10%;
    width: 100%;
    height: auto;
	margin-bottom: 0px;
}
.exclusive-coupon-inner {
	text-align:center;
	margin: 20px auto;
}

.exclusive-evi-date {
	margin-bottom: 18px;
}
.exclusive-evi-copy {
	font-size: 16px;
}

/* リンクボタン */
.exclusive-button {
	text-align:center;
	height: 60px;
	font-size: 20px;
	padding: 0 10%;
}
a.exclusive-button-link {
	text-decoration: none;
}
/*--attention Area MB
------------------------------------------------*/	
.exclusive-attentionBox {
	width:90%;
	margin: 30px 0;
	padding: 0 0 0 5%;
	text-align: left;
	line-height: 130%;
	font-size: 14px;
}
.exclusive-attentionBox p {
}
.exclusive-attentionBox ul li {
	list-style: none;
	margin-bottom: 10px;
}
/*--/QandA Area MB
------------------------------------------------*/	
.exclusive-head-QA p {
	padding:15px 5%;
	margin-bottom: 20px;
	font-size: 16px;
}
.exclusive-QAbox {
	width: 94%;
	padding: 0;
	margin: 0 5% 20px 1%;
}
.exclusive-QA-textBox {
	float:none;
	width:auto;
	font-size: 14px;
	line-height: 160%;
}
.exclusive-QA-Qtext {
	padding-top: 8px;
	margin: 0;
	font-size: 16px;
	line-height: 130%;
}
.exclusive-QA-morelink {
	font-size: 14px;
	text-align: right;
}
/*--customer-center Area MB
------------------------------------------------*/
.exclusive-otherContact {
	margin: 0 0 5px 2%;	
	font-size: 14px;
}
	 
.exclusive-about-customer-centerBox {
	width:90%;
	padding:15px 5%;
	text-align:left;
	margin: 0;
	line-height:170%;
}

.exclusive-about-customer-centerBox p {
	line-height:120%;
	margin-bottom: 20px;
}
.exclusive-customer-center {
	font-size: 19px;
}
.exclusive-freedial-icon {
	width:100%;
	vertical-align: top;
	text-align: left;
	margin: 5px 5px 0 0;
	font-size:16px;
}
.exclusive-freedial-number {
	width:auto;
	margin: 0 0 0 5px;
	padding:15px 0 0 0;
	vertical-align: top;
	text-align: left;
	font-size:16px;
}
.exclusive-freedial-number-txt {
	width:auto;
	margin: 0 0 0 5px;
	padding: 0 0 0 3px;
	vertical-align: top;
	text-align: left;
	font-size:13px;
}

.exclusive-freedialBox {
	text-align: left;
}

.exclusive-freedial-attention {
	font-size: 14px;
}



/*--Related Links Area TOPページへ MB footer
------------------------------------------------*/
#rel_link {
	padding:12px 0px 14px 0px;
	margin: 0px;
	font-weight:bold;
	width:100%;
	text-align: left;
}
#rel_link .link_r {
	margin:0 0 0 13px;
	padding:0px 0px 0.4em 1.6em;
}
#rel_link .link_l {
	margin:0 0 0 13px;
	padding:0px 0px 0.4em 1.6em;
	font-size: 14px;
}
#rel_link span.lead {
	font-weight:normal;
	padding-left:0px;
}
#rel_link .link_rs {
	font-weight:normal;
}

#footer, .ftr_top, .ftr_btm {
	width: 100%;
}


.fotlink {
		margin:0px;
		width: 95%;
}

#copyright {
	width:90%;
	font-size:0.7em;
	margin: 0;
	padding: 5px 2%;
	line-height:1.2em;
	text-align:left;
}



}