@charset "UTF-8";

    .ft10 { font-size: 10px; }
    .ft11 { font-size: 11px; }
    .ft12 { font-size: 12px; }
    .ft13 { font-size: 13px; }
    .ft14 { 
	font-size: 11px;
	line-height: 1.4em;
	margin-bottom: 2%;
	}
    .ft15 { font-size: 15px; }
    .ft16 { font-size: 16px; }
    .ft17 { font-size: 17px; }
    .ft18 { font-size: 18px; }
    .ft19 { font-size: 19px; }
    .ft20 { font-size: 20px; }
    .ft21 { font-size: 21px; }
    .ft22 { font-size: 22px; }
    .ft23 { font-size: 23px; }
    .ft24 { font-size: 24px; }
    .ft25 { font-size: 25px; }
    .ft26 { font-size: 26px; }
    .ft27 { font-size: 27px; }
    .ft28 { font-size: 28px; }
    .ft29 { font-size: 29px; }
    .ft30 { font-size: 30px; }
    .ft31 { font-size: 31px; }
    .ft32 { font-size: 32px; }
    .ft33 { font-size: 33px; }
    .ft34 { font-size: 34px; }
    .ft35 { font-size: 35px; }

    .ft_ffffff { color : #fff; }

    .float_left { float : left; }
    .float_right { float : right; }
    .float_clear { clear : both; }

    .text-center { text-align : center; }
    .text-left { text-align : left; }
    .text-right { text-align : right; }

    a {
      color : #333;
      text-decoration: none;
    }

    #layer {
      position: fixed;
      z-index: 2;
      top: 0px;
      left: 0px;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.8);
      display : none;
    }
    .opacity:hover {
      opacity : 0.7;
    }

    .display_flex {
      display:-webkit-box;
      display:-moz-box;
      display:-ms-box;
      display:-webkit-flexbox;
      display:-moz-flexbox;
      display:-ms-flexbox;
      display:-webkit-flex;
      display:-moz-flex;
      display:-ms-flex;
      display:flex;
      -webkit-box-lines:multiple;
      -moz-box-lines:multiple;
      -webkit-flex-wrap:wrap;
      -moz-flex-wrap:wrap;
      -ms-flex-wrap:wrap;
      flex-wrap:wrap;
	  margin-left:2%;
    }
    .vAlignMiddle {
      position: relative;
      top: 50%;
      transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
    }
    .AlignCenter {
      position: relative;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
    }
    .AlignMiddleCenter {
      position: relative;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
    }

    #sample.sample1 .inner .campaign {
      margin-top: 20px;
      margin-bottom: 20px;
      text-align: center;
    }
    #sample.sample1 .inner .contents {
      width : 100%;
      margin : auto;
    }
    #sample.sample1 .inner .contents div.imstream_wrapper div.imstream_inner {
      width : 23.5%;
      height: 230px;
      /**/overflow: hidden;
      /*background-color : #f8f8f8;*/
	  margin-right: 1.5%;
	  margin-bottom: 2.73%;
    }
    #sample.sample1 .inner .contents div.imstream_wrapper div.imstream_inner img {
      width : 100%;
    }
    /* #sample.sample1 .inner .contents div.imstream_wrapper div.imstream_inner img:hover {
      opacity: 0.7;
    } */
    #sample.sample1 .inner .contents .modalPanel {
      z-index: 3;
      padding: 50px 20px 20px 20px;
      background-color: white;
      width: 65%;
      height: 85vh;
      position: fixed;
      top: 10%;
      left: 17%;
      /*margin-top: -245px;*/
      /*margin-left: 0px;*/
      overflow: scroll;
      -webkit-overflow-scrolling: touch
    }
    #sample.sample1 .inner .contents .modalPanel a.modalClose {
      position: absolute;
      right: 10px;
      top: 10px;
      width: 35px;
      height: 35px;
      text-align: center;
      line-height: 35px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelLeft {
      width: 49%;
      text-align: center;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelLeft img {
      width: 100%;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight {
      width: 49%;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .username {
      width: 100%;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .username img {
      border-radius: 50%;
      width: 30px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .username span {
      position: relative;
      top: -10px;
      margin-left: 5px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .description {
      width: 100%;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects {
      width: 100%;
      margin-top: 20px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects img {
      max-width: 100px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner {
      padding: 10px;
      background-color: #f8f8f8;
      margin-bottom: 10px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner a {
      display: inline-block;
      width: 30%;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner a img {
      text-align : center;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner .related_object_description {
      width: 70%;
      line-height : 20px;
      position : relative;
      color: #333;
	  padding-left:5px;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner .related_object_description a.buy {
      margin : auto;
      margin-top: 20px;
      width: 200px;
      padding-top: 10px;
      padding-bottom: 10px;
      background-color: #ff7c4d;
      display: block;
      color : #fff;
      text-align : center;
    }


/***************笆ｼ1350笆ｼ*****************/
@media screen and (max-width: 1350px) {
	#sample.sample1 .inner .contents .modalPanel {
      z-index: 3;
      padding: 50px 20px 20px 20px;
      background-color: white;
      width: 75%;
      height: 550px;
      position: fixed;
      top: 10%;
      left: 13%;
      /*margin-top: -245px;*/
      margin-left: 0px;
      overflow: scroll;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner {
      padding: 10px;
      background-color: #f8f8f8;
      margin-bottom: 10px;
    }
	#sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner .related_object_description {
      width: 70%;
      line-height : 20px;
      position : relative;
      color: #333;
	  padding-left:5px;
    }
	/*
    #sample.sample1 .inner .contents ul li {
      width : 50%;
    }*/
}


/***************笆ｼ10200笆ｼ*****************/
@media screen and (max-width: 1020px) {
	#sample.sample1 .inner .contents .modalPanel {
      z-index: 3;
      padding: 50px 20px 20px 20px;
      background-color: white;
      width: 75%;
      height: 550px;
      position: fixed;
      top: 10%;
      left: 13%;
      /*margin-top: -245px;*/
      margin-left: 0px;
      overflow: scroll;
    }
    #sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner {
      padding: 10px;
      background-color: #f8f8f8;
      margin-bottom: 10px;
    }
	#sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner .related_object_description {
      width: 65%;
      line-height : 20px;
      position : relative;
      color: #333;
	  padding-left:10px;
    }
	#sample.sample1 .inner .contents .modalPanel .modalPanelRight .related_objects .related_objects_inner .related_object_description a.buy {
      margin : auto;
      margin-top: 20px;
      width: 150px;
      padding-top: 10px;
      padding-bottom: 10px;
      background-color: #485d72;
      display: block;
      color : #fff;
      text-align : center;
    }
	/*
    #sample.sample1 .inner .contents ul li {
      width : 50%;
    }*/
}
img.mb50 {
	margin-top: 10%;
}