@charset "UTF-8";

/*-----------------------------------

CSS Information

Site URL:			http://www.e-life.jp/
File name:			detail_pano.css

-----------------------------------*/

/*
----------
#panorama_wrap
パノラマ埋め込み
----------*/

#panorama_wrap{width:980px;margin:0 auto;padding:0 0 30px;}

#stage_wrap{background:#FFF;position:relative;}
#stage{width:100%;height:400px;background:#FFF;}

#stage{background:url("/images/detail/pano/loading.gif") center center no-repeat;}
#stage .member{background:rgba(0, 0, 0, 0) url("/images/detail/pano/pano_member_bg.jpg") no-repeat scroll center center / cover;display:table;width:100%;height:400px;}
#stage .member span{display:table-cell;text-align:center;vertical-align:middle;}

ul#panorama_control{text-align:right;background:#f1f1f1;overflow:hidden;width:auto;height:32px;position:relative;bottom:0;left:0;border-style:solid;border-color:#CCC;border-width:1px 0;z-index:10;}
ul#panorama_control li{border-left:1px solid #CCC;display:inline-block;margin:0;width:50px;height:32px;transition:0.3s;}
ul#panorama_control li img{transition:0.3s;
touch-callout:none;
user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none;
-webkit-touch-callout:none;}
ul#panorama_control li:hover{cursor:pointer;background:#FFF;box-shadow:0 0 4px rgba(0,0,0,0.4) inset;}
ul#panorama_control li:hover img{-webkit-filter:brightness(2);-moz-filter:brightness(2);-o-filter:brightness(2);-ms-filter:brightness(2);filter:brightness(2);}

#stage_wrap .loading{position:absolute;top:180px;left:46%;}

#stage_wrap #pano_comment{font-size:14px;line-height:32px;font-weigt:normal;text-align:left;position:absolute;bottom:0;left:0;box-sizing:border-box;width:65%;width:-webkit-calc(100% - 328px);width:calc(100% - 328px);height:32px;margin:0 320px 0 8px;overflow:hidden;z-index:11;}

#panorama{background:#f1f1f1;width:auto;margin:0 auto;position:relative;overflow:hidden;}

#panorama ul.thumbnail{white-space:nowrap;position:relative;left:0;margin:0 auto;padding:12px 15px;text-align:left;width:auto;}
#panorama ul.thumbnail li{display:inline-block;text-align:center;font-style:1px;line-height:0;margin:0 6px;height:94px;position:relative;background-color:#FFF;width:122px;overflow:hidden;box-shadow:0 0 3px rgba(0,0,0,0.6);}
#panorama ul.thumbnail li a{width:114px;display:inline-block;height:86px;position:absolute;left:4px;top:4px;overflow:hidden;}
#panorama ul.thumbnail li a span{width:400px;height:86px;overflow:hidden;position:relative;left:-31px;display:table-cell;text-align:center;vertical-align:middle;}

#panorama ul.thumbnail li img{height:auto;max-height:86px;margin:auto;transition:0.3s;}
#panorama ul.thumbnail li .over{width:114px;padding:0;position:absolute;top:4px;left:4px;}
#panorama ul.thumbnail li .over img{width:115px;margin:0 atuo;}
#panorama ul.thumbnail li a:hover img{opacity:0.6;}

#panorama ol{margin:0;padding:0;position:absolute;top:0;left:0;width:100%;}
#panorama ol li{margin:0;padding:0;list-style:none;display:inline-block;position:absolute;width:50px;height:40px;top:38px;background:#4D5C8C;transition:0.2s;}
#panorama ol li.thum_move_l{left:0;text-align:right;border-radius:0 20px 20px 0;box-shadow:3px 0 2px rgba(0,0,0,0.6);}
#panorama ol li.thum_move_r{right:0;text-align:left;border-radius:20px 0 0 20px;box-shadow:-3px 0 2px rgba(0,0,0,0.6);}
#panorama ol li.thum_move_l:hover,
#panorama ol li.thum_move_r:hover{cursor:pointer;box-shadow:none;width:55px;
-webkit-filter:brightness(1.5);-moz-filter:brightness(1.5);-o-filter:brightness(1.5);-ms-filter:brightness(1.5);filter:brightness(1.5);}
#panorama ol li img{}


/*
----------
.panorama_image
THETA埋め込み
----------*/
.panorama_image{width:980px;margin:0 auto 0;padding:0 0 30px;}
.panorama_image .content_title01{margin:0 auto;}
.panorama_image .panorama_box{width:980px;margin:0 auto 10px;}
.panorama_image .ricoh-theta-tour-image{margin:0 0 10px 0;}
.panorama_image .ricoh-theta-tour-image > span{display:none;}
.panorama_image .ricoh-theta-tour-image .ricoh-theta-iframe{width:100%;height:/*375*/478px;border:none;}
.panorama_image p.att{font-size:12px;line-height:20px;text-align:left;width:980px;margin:10px auto 0 auto;}
.panorama_image p.att span{display:block;text-indent:-1em;padding-left:1em;}

