@charset "UTF-8";
/*--------------------------------------------------
　CSS for VR tab
　　http://ascii.jp/
　　File Name:jpVr.css

--------------------------------------------------*/
@import url(/css/0910/jpGeneral.css?2023112201);
/*Font-size --------------------------------------------------------------------------------------
77% = 10px 	85% = 11px 	92% = 12px 	100% = 13px	107% = 14px            	114% = 15px	122% = 16px	129% = 17px
136% = 18px	144% = 19px	152% = 20px	159% = 21px	167% = 22px 174% = 23px	182% = 24px	189% = 25px
-------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
  .only-pc {
    display: none !important; }

  .only-sp {
    display: block !important; }

  .label-sp:before {
    content: attr(data-label); }

  .label-sp img {
    display: none; } }
@media only screen and (min-width: 768px) {
  .only-pc {
    display: block !important; }

  .only-sp {
    display: none !important; }

  .label-pc:before {
    content: attr(data-label); }

  .label-pc img {
    display: none; } }
@media only screen and (max-width: 767px) {
  .label-xs:before {
    content: attr(data-label); }

  .label-xs img {
    display: none; } }
@media only screen and (min-width: 768px) and (max-device-width: 991px) {
  .label-sm:before {
    content: attr(data-label); }

  .label-sm img {
    display: none; } }
@media only screen and (min-width: 992px) and (max-device-width: 1199px) {
  .label-md:before {
    content: attr(data-label); }

  .label-md img {
    display: none; } }
@media only screen and (min-width: 1200px) {
  .label-lg:before {
    content: attr(data-label); }

  .label-lg img {
    display: none; } }
body#vr #jpWrap #mainC a:link {
  text-decoration: none;
  outline: none; }

body#vr #jpWrap #mainC a:visited {
  text-decoration: none; }

body#vr #jpWrap #mainC a:hover {
  text-decoration: underline; }

/* float --*/
body#vr #jpWrap #mainC #topContents:after,
body#vr #jpWrap #mainC ul.reviewList li:after,
body#vr #jpWrap #sideR:after,
body#vr #jpWrap #mainC:after,
body#vr #jpWrap #jptopwrap:after,
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

* html body#vr #jpWrap #mainC #topContents,
* html body#vr #jpWrap #mainC ul.reviewList li,
* html body#vr #jpWrap #sideR,
* html body#vr #jpWrap #mainC,
* html body#vr #jpWrap #jptopwrap,
* html .clearfix {
  zoom: 1; }

/* IE6 */
*:first-child + html body#vr #jpWrap #mainC #topContents,
*:first-child + html body#vr #jpWrap #mainC ul.reviewList li,
*:first-child + html body#vr #jpWrap #sideR,
*:first-child + html body#vr #jpWrap #mainC,
*:first-child + html body#vr #jpWrap #jptopwrap,
*:first-child + html .clearfix {
  zoom: 1; }

/* IE7 */
/* layout --*/
body#vr #jpWrap #jptopwrap {
  width: 1058px;
  padding: 0 0 10px 0; }

body#vr #jpWrap #mainC {
  width: 728px;
  padding: 0 0 0 10px;
  float: left; }

body#vr #jpWrap ul,
#jpWrap li {
  margin: 0; }

body#vr #jpWrap ul,
#jpWrap li a {
  zoom: 1; }

body#vr #jpWrap #mainC a img,
#jpWrap #mainC a:hover img {
  border: 0; }

body#vr #jpWrap #mainC td {
  background-color: transparent; }

/* main --*/
body#vr {
  background: #f7f7f7 url(/img/ad/vr/bg_vrtab.jpg) center top !important; }
  body#vr #jpWrap {
    margin-left: auto;
    margin-right: auto;
    border-top: none; }
  body#vr #logoArea {
    padding-bottom: 23px;
    margin-bottom: 0 !important; }
    body#vr #logoArea #jplogo {
      width: 310px;
      height: 100px;
      position: relative; }
      body#vr #logoArea #jplogo div#logo_vr {
        position: absolute;
        top: 15px;
        left: 10px;
        margin: 0;
        padding: 0;
        background: transparent url(/img/ad/vr/logo_vr.png) no-repeat left top;
        width: 113px;
        height: 81px; }
        body#vr #logoArea #jplogo div#logo_vr a {
          padding: 81px 0 0;
          display: block;
          width: 113px;
          height: 0;
          overflow: hidden; }
      body#vr #logoArea #jplogo h2 {
        position: absolute;
        top: 15px;
        left: 123px;
        margin: 0;
        padding: 0;
        background: transparent url(/img/ad/vr/logo_vr.png) no-repeat -114px top;
        width: 177px;
        height: 81px; }
        body#vr #logoArea #jplogo h2 a {
          padding: 81px 0 0;
          display: block;
          width: 177px;
          height: 0;
          overflow: hidden; }
    body#vr #logoArea .adsize728 a:hover img {
      opacity: 0.8;
      filter: alpha(opacity=0.8);
      -ms-filter: "alpha( opacity=$alpha )"; }
  body#vr #container {
    padding-top: 5; }
  body#vr #mainC .hero {
    margin-bottom: 30px; }
    body#vr #mainC .hero a:hover img {
      opacity: 0.8;
      filter: alpha(opacity=0.8);
      -ms-filter: "alpha( opacity=$alpha )"; }
    body#vr #mainC .hero img {
      display: block; }
  body#vr #mainC .sec_title {
    padding: 8px 15px 6px;
	border: 0;
    line-height: 1.2;
	font-size: 116%;
    font-weight: bold;
	background: transparent url(/img/ad/vr/bg_sec_title.gif) no-repeat; }
  body#vr #mainC .media {
    *zoom: 1;
    border-bottom: 1px dotted #E5E5E5;
    padding-top: 25px;
    padding-bottom: 25px; }
    body#vr #mainC .media:before, body#vr #mainC .media:after {
      display: table;
      content: "";
      line-height: 0; }
    body#vr #mainC .media:after {
      clear: both; }
    body#vr #mainC .media:last-child {
      border-bottom: 1px dotted #E5E5E5; }
    body#vr #mainC .media .media_texts {
      float: right;
      width: 610px; }
      body#vr #mainC .media .media_texts .media_hsup {
        font-size: 92%;
        font-weight: bold;
        margin-bottom: 3px; }
      body#vr #mainC .media .media_texts .media_title {
        margin-bottom: 6px; }
        body#vr #mainC .media .media_texts .media_title a {
          font-size: 136%;
          font-weight: bold;
          color: #000; }
      body#vr #mainC .media .media_texts .media_desc {
        margin-bottom: 3px; }
        body#vr #mainC .media .media_texts .media_desc p {
          font-size: 92%;
          color: #666; }
      body#vr #mainC .media .media_texts .media_time {
        font-size: 77%;
        color: #999;
        text-align: right; }
      body#vr #mainC .media .media_texts .media_btn {
        margin-top: 10px;
        margin-bottom: 0;
        line-height: 1; }
        body#vr #mainC .media .media_texts .media_btn a img {
          display: block; }
        body#vr #mainC .media .media_texts .media_btn a:hover img {
          opacity: 0.8;
          filter: alpha(opacity=0.8);
          -ms-filter: "alpha( opacity=$alpha )"; }
    body#vr #mainC .media .media_image {
      float: left;
      width: 100px; }
      body#vr #mainC .media .media_image .media_pic a img {
        display: block; }
      body#vr #mainC .media .media_image .media_pic a:hover img {
        opacity: 0.8;
        filter: alpha(opacity=0.8);
        -ms-filter: "alpha( opacity=$alpha )"; }
  body#vr #mainC .media--pickup:nth-child(even) .media_texts {
    float: left; }
  body#vr #mainC .media--pickup:nth-child(even) .media_image {
    float: right; }
  body#vr #mainC .media--pickup .media_texts {
    float: right;
    width: 465px; }
    body#vr #mainC .media--pickup .media_texts .media_desc p {
      font-size: 107%; }
  body#vr #mainC .media--pickup .media_image {
    float: left;
    width: 240px; }
  body#vr #sideR {
    padding-top: 10px; }
    body#vr #sideR .sBox {
      width: 300px;
      margin-left: 6px;
      margin-bottom: 10px; }
      body#vr #sideR .sBox.banner a:hover img {
        opacity: 0.8;
        filter: alpha(opacity=0.8);
        -ms-filter: "alpha( opacity=$alpha )"; }
      body#vr #sideR .sBox.banner a img {
        display: block; }

body#vr #sideR .banner.intro {
	background: #fff;
}
body#vr #sideR .intro ul {
	padding: 3px 10px 5px;
	border: 1px solid #888;
	border-top:0;
}
body#vr #sideR .intro li {
	margin: 8px 0 0;
	padding: 0 0 7px;
	border-bottom: 1px dotted #b8b8b8;
}
body#vr #sideR .intro li:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}
body#vr #sideR .intro li h4 {
	font-size: 108%;
}
body#vr #sideR .intro .fl a {
	margin: 0 7px 0 0;
	border: 1px solid #B3AFAB;
	display: block;
}
body#vr #sideR .intro .fr a {
	margin: 0 0 0 7px;
	border: 1px solid #B3AFAB;
	display: block;
}
body#vr #sideR .intro .fl a:hover {
	border: 1px solid #0099ff;
}
body#vr #sideR .intro .fl img {
	margin: 1px;
  height: auto;
}
body#vr #sideR .intro li h4 {
	margin-left: 70px;
}