@charset "euc-jp";

img {
    max-width:inherit !important;/*重要：default.cssの画像の設定を解除*/
  }
/*---------------------------------------------
    adjust（細かい設定はここで調整）
  ---------------------------------------------*/
/*一覧*/
#styleBookBox .leftCol .ttlLead{text-align:left !important;}
#styleBookBox .leftCol .ttl{height:100px}

#styleBookBox .rightCol .styleLineBox .styleBox.style1 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style2 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style3 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style4 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style5 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style6 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style7 .styleImage,
#styleBookBox .rightCol .styleLineBox .styleBox.style8 .styleImage{
margin-top: -237px !important;
margin-left: -170px !important;
}

/*詳細*/
.styleBookDetailBox .leftCol .styleTtlBox{
position: 	relative;
top:50%;
margin: 0 auto;
margin-top: -55px;
left:10px !important;
min-width: 219px;
max-width: 85%;
text-align:left;
}
.styleBookDetailBox .leftCol .styleTtlBox p{line-height:160% !important;color:#666  !important}
.styleBookDetailBox .leftCol .styleTtlBox  .styleTtl{margin-bottom:20px;font-size:18px;color:#9edaee !important;font-weight:bold}

.styleBookDetailBox .rightCol{background:url(../img/style1_detail.png) bottom left repeat-y}

#stylebook footer #footer-inner{background-color:#9edaee !important}
body#stylebook footer {background:none !important;background-color:#9edaee !important;height:100px}
body#stylebook footer #copyright{text-align:right}
/*---------------------------------------------
    frame.css（デフォルトの設定　変更なし）
  ---------------------------------------------*/
/* CONTAINER */
#container {
position: relative;
/*margin-top: -132px;*/
background-color: #fff;
text-align: center;
min-width: 1030px;
overflow: hidden;
}

/*---------------------------------------------
    local.css（デフォルトの設定　変更なし）
  ---------------------------------------------*/

/****************************************
clearfix
*****************************************/
.cf:before,
.cf:after {
display:table;
content:"";
}
.cf:after {
clear:both;
}
.cf {
zoom:1;
}

/****************************************
@font-face {
*****************************************/
@font-face {
font-weight: normal;
font-style: normal;
font-family: 'fette_mittelschriftregular';
src: url('/files/font/fette1451_mittelschrift_macroman/FetteMittelschrift-webfont.eot');
src: url('/files/font/fette1451_mittelschrift_macroman/FetteMittelschrift-webfont.eot?#iefix') format('embedded-opentype'),
url('/files/font/fette1451_mittelschrift_macroman/FetteMittelschrift-webfont.woff') format('woff'),
url('/files/font/fette1451_mittelschrift_macroman/FetteMittelschrift-webfont.ttf') format('truetype'),
url('/files/font/fette1451_mittelschrift_macroman/FetteMittelschrift-webfont.svg#fette_mittelschriftregular') format('svg');
}

/****************************************
#mainContent
*****************************************/
#mainContent {
overflow: hidden;
margin: 0 auto;
margin-top: 70px;
width: 990px;
text-align: left;
}
/****************************************
#headerMask
*****************************************/
/*
#headerMask{
	display: block !important;
	opacity: 1 !important;
}
*/

/****************************************
opacity(透過)
*****************************************/
.opacity:hover{
	opacity: 0.5;
}

/****************************************
SNS
*****************************************/

/*
#freeContent .head-sns ul {
position: absolute;
display: block;
padding: 20px 0 13px 0;
z-index: 10;
}
*/



#freeContent .head-sns{
display: none;
}
#freeContent .foot {
position: relative;
top: 30px;
padding: 0;
text-align: center;
}

#wrapper .foot{
position: relative;
top: -50px;
left: -28px;
}


/****************************************
#wrapper
*****************************************/
/*#wrapper{
background: #ffffff;
text-align: left;
position: relative;
width: 100%;
top: -5px;
}*/
/****************************************
#styleBookBox
*****************************************/
#styleBookBox{
position: relative;
}

#styleBookBox .leftCol{
position: relative;
	float: left;
	width: 280px;
}

#styleBookBox .leftCol .ttlBox{
position: 	relative;
top:50%;
margin: 0 auto;
margin-top: -105px;
width: 219px;
height: 144px;
}

.iphone #styleBookBox .leftCol .ttlBox,
.android #styleBookBox .leftCol .ttlBox,
.mac #styleBookBox .leftCol .ttlBox{
width: 222px;
}
#styleBookBox .leftCol .ttlBox .ttl{
margin-bottom: 14px;
}

#styleBookBox .leftCol .ttlBox .ttlLead{
font-size: 13px;
line-height: 1.7;
}

#styleBookBox .rightCol{
float: left;
min-width: 720px !important;
}

#styleBookBox .rightCol.max{
width: 1160px !important;
}

#styleBookBox .rightCol .styleLineBox{
min-width: 720px !important;
}

#styleBookBox .rightCol .styleLineBox .styleBox{
position: relative;
float: left;
overflow: hidden;
min-width: 180px !important;
min-height: 300px !important;
max-height: 450px;
width: 25%;
height: 450px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.spShow{
display: none;
}

.ie7 #styleBookBox .rightCol .styleLineBox .styleBox{
width: 24.97%;
}

#styleBookBox .rightCol .styleLineBox .styleBox.max{
width: 290px !important;
}

#styleBookBox .rightCol .styleLineBox .styleBox .styleImage{
position: absolute;
top:50% ;
left: 50% ;
cursor: pointer;
}

#styleBookBox .rightCol .styleLineBox .styleBox .maskImage{
position: absolute;
top:50%;
left: 50%;
margin-top: -225px;
margin-left: -145px;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);        /* ie lt 8 */
-ms-filter: "alpha(opacity=0)";  /* ie 8 */
}

#styleBookBox .rightCol .styleLineBox .styleBox.style1 .styleImage{
margin-top: -237px;
margin-left: -170px;
}


#styleBookBox .rightCol .styleLineBox .styleBox.style2 .styleImage{
margin-top: -269px;
margin-left: -192px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.style3 .styleImage{
margin-top: -252px;
margin-left: -180px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.style4 .styleImage{
margin-top: -278px;
margin-left: -199px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.style5 .styleImage{
margin-top: -260px;
margin-left: -186px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.style6 .styleImage{
margin-top: -277px;
margin-left: -197px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.style7 .styleImage{
margin-top: -256px;
margin-left: -183px;
}

#styleBookBox .rightCol .styleLineBox .styleBox.style8 .styleImage{
margin-top: -278px;
margin-left: -198px;
}

/****************************************
.styleBookDetailBox
*****************************************/
.styleBookDetailBox{
display: none;
position: relative;
z-index: 1;
visibility: hidden;
}

.styleBookDetailBox .leftCol{
float: left;
padding-top: 40px;
}

#style1.styleBookDetailBox .leftCol .itemBox{
width: 234px;
margin: 0 auto;
position: relative;
left: 2px;
margin-bottom: 35px;
}

#style1_2.styleBookDetailBox .leftCol .itemBox{
width: 242px;
margin: 0 auto;
position: relative;
left: 0px;
margin-bottom: 35px;
}

#style1_2.styleBookDetailBox .leftCol .itemBox .itemDetailCol{
float: left;
width: 168px;
}

#style2.styleBookDetailBox .leftCol .itemBox{
width: 234px;
margin: 0 auto;
position: relative;
left: 6px;
margin-bottom: 35px;
}

#style2_2.styleBookDetailBox .leftCol .itemBox{
width: 234px;
margin: 0 auto;
position: relative;
left: 2px;
margin-bottom: 35px;
}

#style3.styleBookDetailBox .leftCol .itemBox{
width: 242px;
margin: 0 auto;
position: relative;
left: -1px;
margin-bottom: 35px;
}

#style3.styleBookDetailBox .leftCol .itemBox .itemDetailCol{
float: left;
width: 168px;
}

#style4.styleBookDetailBox .leftCol .itemBox{
width: 242px;
margin: 0 auto;
position: relative;
left: -1px;
margin-bottom: 35px;
}

#style4.styleBookDetailBox .leftCol .itemBox .itemDetailCol{
float: left;
width: 168px;
}

#style5.styleBookDetailBox .leftCol .itemBox{
width: 234px;
margin: 0 auto;
position: relative;
left: 1px;
margin-bottom: 35px;
}

#style6.styleBookDetailBox .leftCol .itemBox{
width: 242px;
margin: 0 auto;
position: relative;
left: -1px;
margin-bottom: 35px;
}

#style6.styleBookDetailBox .leftCol .itemBox .itemDetailCol{
float: left;
width: 168px;
}

#style7.styleBookDetailBox .leftCol .itemBox{
width: 234px;
margin: 0 auto;
position: relative;
left: 1px;
margin-bottom: 35px;
}

#style8.styleBookDetailBox .leftCol .itemBox{
width: 242px;
margin: 0 auto;
position: relative;
left: 1px;
margin-bottom: 35px;
}

#style8.styleBookDetailBox .leftCol .itemBox .itemDetailCol{
float: left;
width: 168px;
}

.styleBookDetailBox .leftCol .itemBox .imageCol{
float: left;
width:74px;
}

.styleBookDetailBox .leftCol .itemBox .itemDetailCol{
float: left;
width: 160px;
}


.styleBookDetailBox .leftCol .itemBox .itemDetailCol .num{
margin-bottom: 7px;
}

.styleBookDetailBox .leftCol .itemBox .itemDetailCol .name{
font-weight: bold;
line-height: 1.4;
margin-bottom: 4px;
}

.styleBookDetailBox .rightCol{
float: left;
position: relative;
margin-top: -5px;
min-width: 720px;
}

.styleBookDetailBox .rightCol.max{
width: 1160px !important;
}


.styleBookDetailBox .rightCol .detailImage{
width: 100%;
min-width: 723px;
border-left: solid 1px #ededed;
}

.styleBookDetailBox .rightCol .styleTtlBox{
width: 213px;
font-size: 12px;
position: absolute;
top: 86px;
left: 56px;
}

.styleBookDetailBox .rightCol .styleTtlBox .styleTtl{
margin-bottom: 17px;
}

.styleBookDetailBox .rightCol .styleTtlBox .styleNote{
line-height: 1.6;
}

.styleBookDetailBox .rightCol .closeBtn{
	display: block;
	width: 40px;
	height: 40px;
	background: url(../img/close_btn_sprite.png) no-repeat;
	background-position: 0 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	position: absolute;
	top: 44px;
	right: 44px;
}




.styleBookDetailBox .rightCol .closeBtn.fixed{
position: fixed;
}

.styleBookDetailBox .rightCol .closeBtn:hover{
	background-position: 0 -40px;
}

.styleBookDetailBox .changeBox{
width: 46px;
height: 130px;
position: fixed;
right: 41px;
margin-top: -65px;
}


.styleBookDetailBox.onepattern .changeBox{
display: none;
}

#style1.styleBookDetailBox .changeBox .currentUpper,
#style2.styleBookDetailBox .changeBox .currentUpper{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/circle_btn_sprite.png) no-repeat;
	background-position: 0 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom:14px;
}

#style1.styleBookDetailBox .changeBox .currentLower,
#style2.styleBookDetailBox .changeBox .currentLower{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/circle_btn_sprite.png) no-repeat;
	background-position: 0 -50px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom: 38px;
	cursor: pointer;
}

#style1.styleBookDetailBox .changeBox .currentLower:hover,
#style1_2.styleBookDetailBox .changeBox .currentUpper:hover,
#style2.styleBookDetailBox .changeBox .currentLower:hover,
#style2_2.styleBookDetailBox .changeBox .currentUpper:hover{
	background-position: 0 0px;
}

#style1_2.styleBookDetailBox .changeBox .currentUpper,
#style2_2.styleBookDetailBox .changeBox .currentUpper{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/circle_btn_sprite.png) no-repeat;
	background-position: 0 -50px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom:14px;
	cursor: pointer;
}

#style1_2.styleBookDetailBox .changeBox .currentLower,
#style2_2.styleBookDetailBox .changeBox .currentLower{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/circle_btn_sprite.png) no-repeat;
	background-position: 0 0px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom: 38px;
}

.styleBookDetailBox .changeBox .arrow{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/arrow_btn_sprite.png) no-repeat;
	background-position: 0 0;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	cursor: pointer;
	position: relative;
}

.styleBookDetailBox .changeBox .arrow:hover{
	background-position: 0 -26px;
}

#style1_2.styleBookDetailBox .changeBox .arrow{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/arrow_btn_sprite2.png) no-repeat;
	background-position: 0 0;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	cursor: pointer;
}

#style1_2.styleBookDetailBox .changeBox .arrow.toUp{
margin-bottom: 38px;
}

#style1_2.styleBookDetailBox .changeBox .arrow:hover{
	background-position: 0 -26px;
}

#style2_2.styleBookDetailBox .changeBox .arrow{
	display: block;
	width: 46px;
	height: 26px;
	background: url(../img/arrow_btn_sprite2.png) no-repeat;
	background-position: 0 0;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	cursor: pointer;
}


#style2_2.styleBookDetailBox .changeBox .arrow.toUp{
margin-bottom: 38px;
}
#style2_2.styleBookDetailBox .changeBox .arrow:hover{
	background-position: 0 -26px;
}

/****************************************
#loadBg
*****************************************/
#loadBg{
display: block;
width: 100%;
position: absolute;
background: #ffffff;
z-index: 10;
top:4000px;
}

#loadBg .load{
width: 32px;
height: 32px;
left: 50%;
display: inline-block;
position: fixed;
top: 50%;
margin-top: -16px;
display: none;
}

/****************************************
SP対応
*****************************************/
#bodyContent.pcContent .hed {
width: 100%;
z-index: 100;
height: 140px;
overflow: hidden;
position: relative;
z-index: 9999;
}

#bodyContent.pcContent .spHidden{
	display: none;
}


#bodyContent.pcContent #styleBookBox .rightCol .styleLineBox .styleBox{
width: 33.3%;
}

#bodyContent.pcContent #styleBookBox .rightCol .styleLineBox .styleBox.third{
width: 33.4%;
}

#bodyContent.pcContent #styleBookBox .rightCol .styleLineBox .styleBox.spShow{
display: block;;
}

#bodyContent.pcContent .styleBookDetailBox .changeBox{
width: 46px;
height: 130px;
position: absolute !important;
right: 41px;
top:50%;
margin-top: -65px;
}

html.ipad #bodyContent .styleBookDetailBox .changeBox{
width: 46px;
height: 130px;
position: absolute !important;
right: 41px;
top:50%;
margin-top: -65px;
}

html.ipad .styleBookDetailBox .rightCol .closeBtn,
html.iphone .styleBookDetailBox .rightCol .closeBtn,
html.android .styleBookDetailBox .rightCol .closeBtn{
position: absolute !important;
}