.ie9-10,
.ie9-10 body             {min-width:960px;}

.hs                      {clear:both;}
body.casual .hs          {background:#482;}
body.classic .hs         {background:#248;}
body.modern .hs          {background:#824;}
body.hope .hs            {background:#A284C0;}
.hs:before, .hs:after    {content:"";display:block;clear:both;height:1px;font-size:0;}
.hs_prt,
.hs_ttl                  {float:left;font-size:16px;line-height:36px;color:#fff;font-weight:normal;margin:0;padding:0 0 0 0.5em;}
.hs_prt                  {display:none;}
.hs_prt a                {color:#fff;text-decoration:none;}
.hs_prt a:before         {content:"\e601";margin:0 0.5em 0 0;font-family:'kumisen';}
.hs_prt a:after          {content:"\e605";opacity:0.5;margin:0 0.5em;font-family:'kumisen';}
.hs_ttl                  {cursor:pointer;}
.hs_ttl span             {display:inline-block;margin-right:1em;}
.hs_ttl span:last-child  {margin-right:0;}
.hs_ttl span.arw_up:after{content:"\25B2";}
.hs_ttl span.arw_dw:after{content:"\25BC";}
.hs_ttl span.hs_series   {display:none;}
.hs_series:before        {content:" [ ";}
.hs_series:after         {content:" ] ";}
.hs_code                 {text-transform:uppercase;}
.hs_price                {float:right;margin:0;padding:0;}
.hs_price dd,
.hs_price dt             {vertical-align:top;display:inline-block;line-height:36px;font-size:14px;margin:0;padding:0 0.8em;color:#fff;display:none;}
.hs_price dt             {background:rgba(255,255,255,0.2);}
.hs_price dd             {background:rgba(255,255,255,0.4);}
.hs_price dd.price       {display:inline-block;}

.studio ul               {list-style:none;margin:0;padding:0;}

/* ========================================================== series select */
.series                  {background:#000;display:none;padding:10px 0 0;position:relative;width:100%;}
.series:after            {content:"";display:block;clear:both;height:1px;font-size:0;}
.series .grps_arrow      {display:none;margin:0 auto;padding:0;}
.series .grps_arrow li   {color:#d60;font-size:48px;margin:0;padding:20px 0 0;cursor:pointer;visibility:hidden;}
.series .grps_arrow li:hover   {color:#e71;}
.series .grps_arw_l      {float:left;}
.series .grps_arw_r      {float:right;}
.series .grps_arrow li.able   {visibility:visible;}
.series .grps            {}
.series .grps .wrap_o    {width:294px;margin:0 auto;padding:0;overflow:hidden;border-bottom:1px solid #333;}
.series .grps .wrap:after{content:"";display:block;clear:both;height:1px;font-size:0;}
.series .grps .grp       {float:left;width:294px;text-align:center;}
.series .grps_pager      {clear:both;text-align:center;padding:0 0 10px 0;}
.series .swiper-pagination-switch {display:inline-block;width:10px;height:10px;border-radius:100%;background:#999;box-shadow: 0px 1px 2px #555 inset;margin:0 5px;cursor:pointer;}
.series .swiper-pagination-switch.swiper-active-switch {background:#d60;}
.series .grp h1,
.series .grp li               {display:inline-block;width:90px;height:90px;text-align:center;vertical-align:top;padding:0;margin:0 4px 8px;overflow:hidden;position:relative;}
.series .grp ul               {display:inline;margin:0;padding:0;}
.series .grp h1               {color:#999;text-align:center;}
.series .grp h1 span          {font-size:40px;display:block;line-height:40px;}
.series .grp h1 span:first-child {font-size:14px;line-height:44px;}
.series .grp li               {cursor:pointer;}
.series .grp li.crt:before    {font-family:'kumisen';content:'\e606';display:block;position:absolute;font-size:30px;color:#e11;margin:4px 0 0 66px;vertical-align:top;text-shadow:-1px -1px #fff,1px -1px #fff,-1px 1px #fff,1px 1px #fff;}
.series .grp li span          {display:block;}
.series .grp li .txt          {position:absolute;width:70px;background:#000;color:#ccc;font-size:14px;height:20px;line-height:20px;text-align:center;margin:35px 0 0 10px;text-transform:uppercase;border-radius:10px;}
.series .grp li .img          {width:90px;height:90px;overflow:hidden;border-radius:50%;}

.series .grp li:hover .txt    {color:#fff;}

.series .other           {text-align:center;margin:0;padding:10px 0;}
.series .other dd        {display:inline-block;margin:0 1em;padding:0;}
.series .other a         {color:#999;display:inline-block;padding:10px;text-decoration:none;}
.series .other a:hover   {color:#eee;}

/* ========================================================== view */
.view                    {margin:0 auto;background:#f9f6f3;padding:10px;border-bottom:1px solid #cca;}
.fan                     {position:relative;width:960px;max-width:100%;margin:0 auto;background:url('./img/bg_fan.png') no-repeat;background-size:100% auto;}
.fan .loading,
.fan .spec,
.fan .highlight,
.fan canvas              {position:absolute;margin:0;padding:0;display:block;max-width:100%;}
.fan .nakabone           {z-index:10;}
.fan .oyabone            {z-index:20;}
.fan .kaname             {z-index:30;}
.fan .front              {z-index:40;}
.fan .back               {z-index:50;display:none;}
.fan .front_view         {z-index:60;display:none;}
.fan .back_view          {z-index:70;}
.fan .spec               {z-index:110;}
.fan .spec img           {max-width:100%;display:none;}
.fan .highlight          {z-index:120;}
.fan .highlight img      {max-width:100%;}
.fan .dmy                {max-width:100%;}
.fan .dmy img            {max-width:100%;}

.fan .loading            {z-index:130;width:100%;text-align:center;display:none;}
.fan .loading div        {display:inline-block;margin-top:20%;background:rgba(255,255,255,.8);padding:10px;border-radius:20%;}

.ie9-10 .fan             {max-width:none;}
.ie9-10 .fan .spec,
.ie9-10 .fan .highlight img,
.ie9-10 .fan .dmy img,
.ie9-10 .fan canvas      {width:960px;}

/* ========================================================== select */
.slcts                   {position:relative;z-index:999;overflow:hidden;width:100%;display:none;background:#333;}
.slcts .wrap_o           {width:320px;margin:0 auto;overflow:hidden;position:relative;}
.slcts .wrap             {overflow:hidden;}
.slct                    {float:left;width:320px;}
.slct h1                 {font-weight:normal;color:#999;font-size:16px;margin:0 0 10px;padding:0 0.8em;background:#555;}
.slct h1 span            {line-height:40px;}
.slct h1:after,
.slct h1:before          {font-family:'kumisen';font-size:24px;line-height:38px;vertical-align:top;display:inline-block;margin-right:0.5em;}
.slct h1 .more           {padding:2px 4px;font-size:12px;color:#555;background:#999;cursor:pointer;margin-left:1em;}
.slct h1 .more:hover     {background:#ccc;}
.slct h2                 {font-weight:normal;color:#999;font-size:16px;margin:0;padding:0;text-align:center;margin:0 0 5px;line-height:1.5;}
.slct_front h1:before    {content:'\e60b';}
.slct_back h1:before     {content:'\e60a';}
.slct_bone h1:before     {content:'\e60d';}
.slct_kaname h1:before   {content:'\e606';}
.slct_spec h1:before     {content:'\e610';}

.slct ul                 {text-align:center;overflow:hidden;padding-bottom:10px;}
.slct li                 {vertical-align:top;display:inline-block;margin:0 2px 4px;cursor:pointer;width:56px;height:56px;overflow:hidden;border-radius:20%;}
.slct li                 {user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;}
.slct li.crt:before      {font-family:'kumisen';content:'\e606';display:block;position:absolute;font-size:22px;color:#e11;margin:-2px 0 0 36px;vertical-align:top;text-shadow:-1px -1px #fff,1px -1px #fff,-1px 1px #fff,1px 1px #fff;}
.slct.slct_bone li       {border-radius:50%;border-bottom-right-radius:0;}
.slct.slct_kaname li     {border-radius:50%;}

.slct_spec_size                  {float:left;width:50%;}
.slct_spec_hand                  {float:right;width:50%;}
.slct.slct_spec li               {border-radius:50%;margin:0 8px 8px;}
.slct_spec li div                {position:absolute;width:56px;text-align:center;}
.slct_spec li div span           {display:block;}
.slct_spec li span:first-child   {font-size:24px;line-height:56px;color:#fff;}

.slct li img             {vertical-align:top;}

.slcts .btn_close        {position:absolute;right:0;z-index:100;cursor:pointer;background:#666;}
.slcts .btn_close:before {content:'\e614';font-size:20px;font-family:'kumisen';display:inline-block;text-align:center;width:40px;height:40px;line-height:40px;color:#aaa;}

.slcts_nv                {display:none;}
.slcts_nv                {position:relative;width:560px;margin:0 auto;}
.slcts_nv ul             {position:absolute;z-index:90;right:0;background:#666;}
.slcts_nv li             {vertical-align:top;margin:0 5px 0 0;padding:3px 0;display:inline-block;width:56px;overflow:hidden;cursor:pointer;}
.slcts_nv li div         {color:#aaa;}
.slcts_nv li .crt        {color:#ddd;}
.slcts_nv li div:before  {font-size:30px;line-height:32px;font-family:'kumisen';height:32px;display:block;text-align:center;}
.slcts_nv .front div:before  {content:'\e60b';}
.slcts_nv .back div:before   {content:'\e60a';}
.slcts_nv .bone div:before   {content:'\e60d';}
.slcts_nv .kaname div:before {content:'\e606';}
.slcts_nv .spec div:before   {content:'\e610';}
.slcts_nv li div span    {display:none;}


/* ========================================================== control */
.ctrl                    {text-align:center;padding-top:10px;padding-bottom:5px;background:#fff;}
.ctrl li                 {vertical-align:top;margin:0 5px 5px 0;display:inline-block;width:56px;overflow:hidden;}
.ctrl li:last-child      {margin-right:0;}

.ctrl li div             {background:#ccc;color:#fff;text-align:center;border-radius:0.4em;cursor:default;overflow:hidden;}
.ctrl li div             {user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;}
.ctrl .able              {background:#68b;cursor:pointer;}
.ctrl .chck              {background:#6FC4D2;}
.ctrl ul:nth-child(2) .able{background:#888;}
.ctrl ul:nth-child(2) .cart .able        {background:#E7A01F;}
.ctrl li div span        {display:block;font-size:0.8em;padding:0.5em 0 0.8em;}
.ctrl li div:after,
.ctrl li div:before      {font-size:30px;line-height:36px;font-family:'kumisen';height:30px;display:block;text-align:center;}
.ctrl .front div:before  {content:'\e60b';}
.ctrl .back div:before   {content:'\e60a';}
.ctrl .bone div:before   {content:'\e60d';}
.ctrl .kaname div:before {content:'\e606';}
.ctrl .spec div:before   {content:'\e610';}
.ctrl .reverse div:before{content:'\e612';}
.ctrl .eye div:before    {content:'\e60c';}
.ctrl .cart div:before   {content:'\e600';}
.ctrl .send div:before   {content:'\e615';}
.ctrl .layout            {display:none;}
.ctrl .send              {}

/* ========================================================== spec confirm */
.spec_confirm            {position:fixed;top:0;left:0;z-index:99991;width:100%;height:100%;display:none;font-size:12px;}
.sc_wrap                 {width:100%;height:100%;position:relative;z-index:5;display:-moz-box;-moz-box-align: center;-moz-box-pack: center;display: -webkit-box;-webkit-box-align: center;-webkit-box-pack: center;display:-ms-flexbox;-ms-flex-align:center;-ms-flex-pack:center;display:box;box-align:center;box-pack:center;background-color:rgba(0,0,0,.6);}
.sc_box                  {width:300px;background:#ccc;}
.sc_box .front           {width:100%;position:relative;}
.sc_box .front dt, .sc_box .front dd,
.sc_box .front           {margin:0;padding:0;overflow:hidden;}
.sc_box .front dt        {position:absolute;width:100%;}
.sc_box .front dt span   {width:6em;height:3em;line-height:2.4em;margin:0 auto;display:block;text-align:center;background:rgba(255,255,255,.9);border-bottom-left-radius:3em;border-bottom-right-radius:3em;}
.sc_box .front dd        {}
.sc_box .front dd span   {display:block;height:240px;}
.sc_box ul               {border-top:1px solid #999;}
.sc_box ul li            {display:inline-block;width:100px;height:90px;text-align:center;margin:0;padding:0;background-size:100% auto;}
.sc_box ul.parts li:nth-child(2) {border-left:1px solid #999;border-right:1px solid #999;width:98px;}
.sc_box ul.spec li       {width:150px;}
.sc_box ul.spec li:last-child {width:149px;border-left:1px solid #999;}
.sc_box ul li span       {display:block;background:rgba(255,255,255,.9);text-align:center;width:4.8em;margin:0 auto;line-height:2em;height:2.4em;border-bottom-left-radius:2.4em;border-bottom-right-radius:2.4em;}
.sc_box ul.spec li div   {font-size:20px;line-height:60px;}

/* ========================================================== information */
.information             {position:fixed;top:0;left:0;z-index:99992;width:100%;height:100%;display:none;font-size:12px;}
.inf_bg                  {position:absolute;z-index:10;background:rgba(0,0,0,.8);width:100%;height:100%;}
.inf_box                 {position:relative;z-index:20;width:auto;margin:0 auto;padding:20px;background:#fff;color:#333;display:none;}
.inf_box dl              {text-align:center;}
.inf_box dt              {margin:0 0 0.5em;padding:0;}
.inf_box dd              {margin:0 0 2em;padding:0 0 1em 0;border-bottom:1px solid #ccc;
		white-space: pre;           /* CSS 2.0 */
		white-space: pre-wrap;      /* CSS 2.1 */
		white-space: pre-line;      /* CSS 3.0 */
		white-space: -pre-wrap;     /* Opera 4-6 */
		white-space: -o-pre-wrap;   /* Opera 7 */
		white-space: -moz-pre-wrap; /* Mozilla */
		white-space: -hp-pre-wrap;  /* HP Printers */
		word-wrap: break-word;      /* IE 5+ */
                         }
.inf_box .inf_addr dd    {padding:1em 0 2em;}
.inf_box .inf_qr         {display:none;}
.inf_share dd            {padding:1em 0 2em;}
.inf_share a             {display:inline-block;color:#fff;margin:0 10px;text-decoration:none;padding:12px;border-radius:30px;}
.inf_share a.twitter     {background:#55ACEE;}
.inf_share a.facebook    {background:#3A5897;}
.inf_share a.mail        {background:#e82;}
.inf_share a:before      {font-family:'kumisen';font-size:36px;line-height:36px;height:36px;width:36px;display:block;text-align:center;}
.inf_share a.twitter:before      {content:'\e617';}
.inf_share a.facebook:before     {content:'\e616';}
.inf_share a.mail:before         {content:'\e611';}
.inf_close               {padding:20px 0;text-align:center;}
.inf_close span          {display:inline-block;height:36px;line-height:36px;text-align:center;padding:0 1em;background:#333;color:#fff;cursor:pointer;}

/* ========================================================== media query */
@media screen and (min-width: 640px){
	.hs_price dt,
	.hs_price dd             {display:inline-block;}

	.ctrl li                 {width:90px;}
	.ctrl li div span        {padding:0.5em 0 1.2em;}
	.ctrl li div:after,
	.ctrl li div:before      {font-size:40px;height:50px;line-height:56px;}

}
@media screen and (min-width: 720px){
	.series .grps_arrow      {display:block;width:680px;}
	.series .grps .grp,
	.series .grps .wrap_o    {width:588px;}

	.slcts .wrap_o,
	.slct                    {width:640px;}
}
@media screen and (min-width: 840px){
	.hs_ttl span.hs_series,
	.hs_series,
	.hs_price dt,
	.hs_price dd             {display:inline-block;}
	.hs_prt                  {display:block;}

	.ctrl                    {overflow:hidden;position:fixed;z-index:9999;bottom:0;width:100%;padding:10px 10px 5px;background:rgba(0,0,0,.7);}
	.ctrl ul                 {display:inline-block;}
	.ctrl .able:hover                        {background:#9ab;}
	.ctrl .able.chck:hover                   {background:#8de;}
	.ctrl ul:nth-child(2)                    {margin-left:20px;}
	.ctrl ul:nth-child(2) .able:hover        {background:#aaa;}
	.ctrl ul:nth-child(2) .cart .able:hover  {background:#f3a926;}
	.ctrl .eye               {display:none;}
	.ctrl .send              {display:inline-block;}
	.ctrl .layout            {clear:both;display:block;width:auto;text-align:center;}
	.ctrl .layout span       {display:inline-block;padding:5px;width:12px;}
	.ctrl .layout span input {cursor:pointer;}

	.ctrl.lo_l, .ctrl.lo_r        {position:absolute;top:120px;bottom:auto;width:56px;height:460px;height:auto;padding:10px;}
	.ctrl.lo_l ul,
	.ctrl.lo_r ul                 {text-align:left;margin-left:0;}
	.ctrl.lo_l li,
	.ctrl.lo_r li                 {width:56px;}
	.ctrl.lo_l ul:first-child,
	.ctrl.lo_r ul:first-child     {padding-bottom:10px;}
	.ctrl.lo_l div span,
	.ctrl.lo_r div span           {display:none;}
	.ctrl.lo_l div:before,
	.ctrl.lo_r div:before         {line-height:56px;height:56px;}
	.ctrl.lo_l .layout,
	.ctrl.lo_r .layout            {padding:0;text-align:center;}
	.ctrl.lo_l .layout span,
	.ctrl.lo_r .layout span       {display:inline-block;padding:0;margin:0 2px;}
	.ctrl.lo_l                    {left:0;border-top-right-radius:10px;border-bottom-right-radius:10px;}
	.ctrl.lo_r                    {right:0;border-top-left-radius:10px;border-bottom-left-radius:10px;}

	.slcts                   {top:77px;position:absolute;background:transparent;}
	.slct                    {background:rgba(0,0,0,.7);}

	.slct_spec_size,
	.slct_spec_hand          {text-align:center;}
	.slct_spec ul,
	.slct.slct_spec li,
	.slct_spec h2            {display:inline-block;vertical-align:top;margin-bottom:2px;}
	.slct_spec h2            {margin:0;padding:0;line-height:52px;height:52px;}

	.slcts_nv                {display:block;}

	.inf_box                 {width:400px;}
	.inf_box .inf_qr         {display:block;}

	.view                    {padding-bottom:20px;}
}
@media screen and (min-width: 1000px){
	.slcts                   {top:111px;}
	.slcts .wrap             {background:transparent;}
	.slcts .wrap_o           {width:640px;}
	.slcts .slct             {background:rgba(0,0,0,.7);}

}

/* ============================================================== for print */
@media print {
	.hs_price,
	.ctrl,
	.slcts                   {display:none;}

}