@charset "UTF-8";
/* --------------------------------
	ページ
-------------------------------- */
/* #toTop トップのみ調整　ここから */
#toTop {
  position: absolute !important;
  top: auto !important;
  bottom: -46px !important;
  left: auto !important;
  right: 10px;
}

/* #toTop トップのみ調整　ここまで */
.section {
  position: relative;
  top: 0px;
  left: 0px;
  /*background: #000000;*/
}

/* video に必要なcss ここから */
.tpbx1 {
  text-align: center;
  background: #000000;
  background-image: url("../img/top/top_smp_bg.jpg");
  background-position: center bottom;
  background-size: cover;
  z-index: 2;
}

#topvideo {
  visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.on_obj1 {
  position: relative;
  top: 0px;
  left: 0px;
  height: 252px;
  height: 68vw;
  z-index: 8;
}

#top_copy {
  display: block;
  width: 250px;
  width: 85vw;
  height: auto;
  position: absolute;
  top: 70px;
  top: calc(20.263vw + 10px);
  left: 50px;
  left: 7.5vw;
}

#top_mv_logo {
  display: block;
  width: 250px;
  width: 32vw;
  height: auto;
  position: absolute;
  top: 70px;
  top: calc(20.263vw + 10px);
  left: 50px;
  left: 34vw;
  opacity: 0;
}

.tpbx1 {
  z-index: 5;
  overflow: hidden;
}

.tpbx2 {
  z-index: 10;
  background: #FFFFFF;
}

.tpbx2 div {
  vertical-align: top !important;
}

.tpbx4 {
  z-index: 15;
}

.tpbx5 {
  z-index: 16;
}

.tpbx6 {
  z-index: 17;
  height: 20px;
}

.top_sttl {
  font-size: 25px;
}

.tsl1 {
  width: 6.4em;
  float: left;
  transition: transform 0.8s;
  white-space: nowrap;
  overflow: visible;
}

.tsl2 {
  width: 8.1em;
  float: left;
  white-space: nowrap;
  overflow: visible;
}

.sttlbx {
  padding: 60px 0px 20px 0px;
}

.news_bx {
  padding: 8px 0px 8px 0px;
  border-bottom: 1px dotted #C6C6C6;
}

.top_sttl_j {
  font-size: 24px;
  font-weight: bold;
}

a.list_btn_s {
  display: block;
  border: 1px solid #AAAAAA;
  line-height: 24px;
  text-align: center;
  width: 5em;
  text-indent: -1.2em;
  position: relative;
  float: right;
  color: #3F3F3F;
  text-decoration: none;
  white-space: nowrap;
  overflow: visible;
}

a.list_btn_s span::before {
  content: " ";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border: 1px solid #777777;
  top: 6px;
  right: 9px;
}

a.list_btn_s span::after {
  content: " ";
  display: block;
  width: 3px;
  height: 3px;
  position: absolute;
  border: 3px solid transparent;
  border-left: 3px solid #777777;
  top: 9px;
  right: 10px;
}

.news_icon {
  display: block;
  width: 9.5em;
  text-align: center;
  font-size: 12px;
  line-height: 1;
  padding-top: 1px;
  height: 15px;
  float: left;
}

/*iIE10以上の場合はcssを変更*/
@media all and (-ms-high-contrast: none) {
  .news_icon {
    padding-top: 2px;
  }
}

/*IE9の場合はcssを変更*/
.news_icon:not(:target) {
  padding-top: 2px\9;
}

.news_date {
  display: block;
  font-size: 13px;
  color: #9F834D;
  width: 7.5em;
  text-align: center;
  float: left;
}

a.news_bodytxt {
  display: block;
  font-size: 13px;
  color: #333333;
  clear: both;
  text-decoration: none;
  padding: 4px 0 0 0;
  line-height: 1.3;
}

a.opcp_bodytxt {
  display: block;
  font-size: 13px;
  color: #333333;
  text-decoration: none;
  line-height: 1.3;
}

.nsi_m {
  background: #9F834D;
  color: #FFFFFF;
  border: 1px solid #9F834D;
}

.nsi_a {
  background: #FFFFFF;
  color: #9F834C;
  border: 1px solid #9F834D;
}

.nsi_f {
  background: #205694;
  color: #FFFFFF;
  border: 1px solid #205694;
}

.opcp_bx {
  display: block;
  padding: 8px 0px 8px 0px;
  border-bottom: 1px dotted #C6C6C6;
}

.opcp_img {
  display: block;
  width: 90%;
  height: auto;
}

.opcp_sttl {
  display: block;
  font-size: 13px;
  line-height: 1.3;
}

.opcp_date {
  display: block;
  font-size: 13px;
  line-height: 1.3;
}

.opcp_date .link_sbtn {
  float: right;
}

.opcp_wrap {
  padding: 0 0 30px 0;
}

.lvc_bx {
  background-color: #000000;
  color: #FFFFFF;
  padding: 0 0 40px 0;
}

.lvc_bx h3 {
  color: #FFFFFF;
  text-align: center;
  padding: 20px 0px 20px 0px;
  padding: 5vh 0px 2vh 0px;
}

a.lvc_btn {
  display: inline-block;
  border: 1px solid #555555;
  line-height: 24px;
  text-align: center;
  width: 80%;
  text-indent: -1.2em;
  position: relative;
  color: #FFFFFF;
  text-decoration: none;
  white-space: nowrap;
  overflow: visible;
  left: 10%;
}

a.lvc_btn span::before {
  content: " ";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border: 1px solid #878787;
  top: 6px;
  right: 9px;
}

a.lvc_btn span::after {
  content: " ";
  display: block;
  width: 3px;
  height: 3px;
  position: absolute;
  border: 3px solid transparent;
  border-left: 3px solid #878787;
  top: 9px;
  right: 10px;
}

a:hover.lvc_btn {
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
}

.lvcmbx {
  width: 80%;
  margin: 0 auto 20px auto;
  position: relative;
}

#camera_bg {
  width: 100%;
  display: block;
}

#livecom {
  display: block;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  border: solid 1px #666666;
}

#camera_btn {
  display: block;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}

#camera_btn img {
  display: block;
  width: 100%;
}

.top_mbl_bigbtn {
  display: block;
  width: 100%;
  height: auto;
  position: relative;
}

.tpbx3 {
  background: #000000;
  padding-top: 20px;
}

a.tmt_btn {
  display: block;
  background: transparent;
  background-image: url(../img/common/bg_trslct_b_80.png);
  background-repeat: repeat;
  border: solid 1px #555555;
  line-height: 25px;
  color: #FFFFFF;
  text-decoration: none;
  width: 176px;
  text-align: center;
  position: relative;
  margin: 0px auto 0px auto;
  bottom: 40px;
}

a.tmt_btn span {
  display: inline-block;
  position: relative;
  padding-right: 1.5em;
}

a.tmt_btn span::before {
  content: " ";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border: 1px solid #888888;
  top: 6px;
  right: -2px;
}

a.tmt_btn span::after {
  content: " ";
  display: block;
  width: 3px;
  height: 3px;
  position: absolute;
  border: 3px solid transparent;
  border-left: 3px solid #CCCCCC;
  top: 9px;
  right: 0px;
}

a.csg_btn {
  display: block;
  background: transparent;
  background-image: url(../img/common/bg_trslct_b_80.png);
  background-repeat: repeat;
  border: solid 1px #555555;
  line-height: 25px;
  color: #FFFFFF;
  text-decoration: none;
  width: 176px;
  text-align: center;
  position: relative;
  margin: 0px auto 0px auto;
  bottom: 40px;
}

a.csg_btn span {
  display: inline-block;
  position: relative;
  padding-right: 1.5em;
}

a.csg_btn span::before {
  content: " ";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border: 1px solid #888888;
  top: 6px;
  right: -2px;
}

a.csg_btn span::after {
  content: " ";
  display: block;
  width: 3px;
  height: 3px;
  position: absolute;
  border: 3px solid transparent;
  border-left: 3px solid #CCCCCC;
  top: 9px;
  right: 0px;
}

#mbl_to_movie {
  display: block;
  position: relative;
  margin: 20px 10px 0px 10px;
}

#mbl_to_movie img {
  display: block;
  width: 80px;
  height: 34px;
  position: absolute;
  top: 0px;
  right: 0px;
}

a .mbl_mv_txt {
  display: block;
  color: #000000;
  text-decoration: none;
  width: 230px;
  font-size: 13px;
  position: relative;
  top: 10px;
  left: 0;
  margin: 0 auto;
  padding-right: 80px;
}

.mbl_mv_txt::before {
  content: " ";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border: 1px solid #888888;
  top: 0px;
  right: 80px;
}

.mbl_mv_txt::after {
  content: " ";
  display: block;
  width: 3px;
  height: 3px;
  position: absolute;
  border: 3px solid transparent;
  border-left: 3px solid #333333;
  top: 3px;
  right: 82px;
}

/*start min-width: 360px*/
/*end min-width: 360px*/
/*start min-width: 560px*/
@media (min-width: 560px) {
  .on_obj1 {
    position: relative;
    top: 0px;
    left: 0px;
    height: 58vw;
    z-index: 8;
  }
  #top_copy {
    display: block;
    width: 70vw;
    height: auto;
    position: absolute;
    top: 40%;
    top: calc(15.263vw - 10px);
    left: 15vw;
  }
  #top_mv_logo {
    display: block;
    width: 32vw;
    height: auto;
    position: absolute;
    top: 40%;
    top: 15.263vw;
    left: 34vw;
  }
  a.lvc_btn {
    width: 40%;
    left: 30%;
  }
}

/*end min-width: 560px*/
/*start min-width: 880px*/
@media (min-width: 880px) {


.lvcmbx {
  /*width: 80%;*/
 /* margin: 0 auto 10px auto;*/
margin: 0 auto 10px 10%;
  position: relative;
}
  #livecom {
    max-width: 280px;
  }
#camera_bg {
  max-width: 280px;
}
#camera_btn img {
  max-width: 280px;
}
  /*menuここから*/
  #menu {
    position: fixed;
    top: 98px;
    left: 96%;
    left: calc(100% - 40px);
    height: 40px;
    z-index: 70;
    width: 100%;
    padding: 0;
    margin: 0;
  }
  #menu li {
    display: block;
    width: 10px;
    margin: 10px;
    background: #666;
    /*background: rgba(0, 0, 0, 0.5);*/
    -webkit-border-radius: 10px;
    border-radius: 10px;
  }
  #menu li.active {
    background: #B0A435;
  }
  #menu li a {
    text-decoration: none;
    color: #000;
  }
  #menu li.active a:hover {
    color: #000;
  }
  #menu li:hover {
    background: #bbb;
  }
  #menu li a,
  #menu li.active a {
    padding: 5px;
    display: block;
  }
  #menu li.active a {
    color: #fff;
  }
  /*menuここまで*/
  #topvideo {
    visibility: visible;
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    background-color: #000000;
    /* in case the video doesn't fit the whole page*/
    background-position: center center;
    background-size: contain;
    object-fit: cover;
    /*cover video background */
    z-index: 3;
  }
}

@media all and (min-width: 880px) and (-ms-high-contrast: none) {
  /*ie10以上で両側に黒面が出ないように、movieを大きく表示*/
  #topvideo {
    width: 150%;
    height: auto;
    top: -5%;
  }
}

@media (min-width: 880px) {
  @supports (-ms-accelerator: true) {
    /*edgeで両側に黒面が出ないように、movieを大きく表示*/
    #topvideo {
      width: 150%;
      height: auto;
      top: -5%;
    }
  }
  @supports (-ms-ime-align: auto) {
    /*edgeで両側に黒面が出ないように、movieを大きく表示*/
    #topvideo {
      width: 150%;
      height: auto;
      top: -5%;
    }
  }
  /*Hiding video controls */
  video::-webkit-media-controls {
    display: none !important;
  }
  .on_obj1 {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 8;
  }
  #top_copy {
    display: block;
    width: 54vw;
    height: auto;
    position: absolute;
    top: 40%;
    top: calc(50% - 9.06vw);
    left: 23vw;
  }
  #top_mv_logo {
    display: block;
    width: 36vw;
    height: auto;
    position: absolute;
    top: 40%;
    top: calc(50% - 9.06vw);
    left: 32vw;
  }
  #top_to2nd {
    display: block;
  }
  #top_btm_txt {
    display: block;
    width: 22%;
    height: auto;
    position: absolute;
    bottom: 102px;
    left: 39%;
  }
  #top_arrow_box {
    display: block;
  }
  #top_arrow {
    display: block;
    width: 4%;
    height: auto;
    position: absolute;
    bottom: 146px;
    left: 48%;
    animation: fluffy 3s ease infinite;
  }
  @keyframes fluffy {
    0% {
      -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
    }
    5% {
      -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
    }
    10% {
      -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
    }
    20% {
      -ms-transform: translateY(-15px);
	  -webkit-transform: translateY(-15px);
	  transform: translateY(-15px);
    }
    25% {
      -ms-transform: translateY(2px);
	  -webkit-transform: translateY(2px);
	  transform: translateY(2px);
    }
    30% {
      -ms-transform: translateY(-10px);
	  -webkit-transform: translateY(-10px);
	  transform: translateY(-10px);
    }
    50% {
      -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
    }
    100% {
      -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
    }
  }
  .tpbx1 {
    background-image: none;
  }
  .top_sttl {
    font-size: 30px;
  }
  .top_sttl_j {
    font-size: 28px;
  }
  a.news_bodytxt .link_sbtn,
  a.opcp_bodytxt .link_sbtn {
    transition: transform 0.8s;
  }
  a:hover.list_btn_s {
    -ms-transform: scale(1.05, 1.05);
    -webkit-transform: scale(1.05, 1.05);
    -moz-transform: scale(1.05, 1.05);
    -o-transform: scale(1.05, 1.05);
    transform: scale(1.05, 1.05);
  }
  a:hover.news_bodytxt,
  a:hover.opcp_bodytxt {
    color: #999999;
  }
  a:hover.news_bodytxt .link_sbtn,
  a:hover.opcp_bodytxt .link_sbtn {
    transform: rotateY(360deg);
    -webkit-transform: rotateY(360deg);
  }
  .opcp_wrap {
    position: absolute;
    top: 300px;
    top: 42vh;
    left: 0px;
    margin: 0 60px;
    width: calc(100vw - 120px);
    max-width: 1200px;
    overflow:hidden;/*for swiper*/
  }

  a.list_btn_s {
    float: left;
    top: 3px;
  }
  .tsl1 {
    width: 7.5em;
  }
  .tsl2 {
    width: 9.5em;
  }
  .lvc_bx {
    background-color: #FFFFFF;
    color: #000000;
    padding: 0 0 30px 0;
    position: relative;
  }
  .lvc_bx h3 {
    color: #000000;
    text-align: left;
    padding-left: 10%;
  }
  a.lvc_btn {
    display: inline-block;
    border: 1px solid #555555;
    line-height: 24px;
    text-align: center;
    width: 13em;
    text-indent: -1.2em;
    color: #000000;
    text-decoration: none;
    white-space: nowrap;
    overflow: visible;
position:relative;
left:35%;
left:calc( 80% - 148px );

    /*
left:140px;
position: absolute;
        top: 0px;
        right: 0px;*/
  }
  .news_bx {
    padding: 3px 0px 3px 0px;
    padding: .8vh 0px .8vh 0px;
    border-bottom: 1px dotted #C6C6C6;
  }
  .opcp_bx {
    padding: 3px 0px 3px 0px;
    padding: .8vh 0px .8vh 0px;
  }
  .sttlbx {
    padding: 20px 0 0 0;
    padding: 5vh 0 0 0;
    height: 70px;
    height: 13vh;
  }
  .opcp_date .link_sbtn {
    float: none;
    margin-top: -4px;
  }
  .opcp_sttl {
    display: inline;
    line-height: 1;
  }
  .opcp_date {
    display: inline;
    padding: 0 0 0 10px;
    line-height: 1;
  }
  a.opcp_bodytxt {
    line-height: 2.2;
  }
  .opcp_img {
    max-width: 84px;
  }
  /*トーナメントコンテンツここから*/
  .tpbx3 {
    z-index: 14;
    background: #000000;
    position: relative;
    padding-top: 0px;
  }
  .tpbx3 .sttlbx {
    padding: 50px 0px 0px 0px;
    height: 110px;
  }
  .tpbx3 .top_sttl {
    color: #FFFFFF;
    font-size: 28px;
    text-align: center;
    line-height: 1;
  }
  .tpbx3 .fp-tableCell {
    vertical-align: top !important;
  }
  .swiper-container {
    width: 90%;
    width: calc(100vw - 120px);
    height: 400px;
    height: calc(100vh - 240px);
    margin: 0px 60px 0px 60px;
    background: #000000;
  }
  .swiper-slide {
    width: 90%;
    width: calc(100vw - 120px) !important;
    height: 90%;
    height: calc(100% - 60px);
    background: #333333;
  }
  .swiper-container2 .swiper-slide {
   /* width: 90%;
    width: calc(100vw - 120px) !important;
    height: 90%;
    height: calc(100% - 60px);
    width:auto !important;
    height:auto !important;*/
    background: transparent !important;

  }
  .tmt_p_1 {
    background-image: url(../img/tournament/photo/for_top_1.jpg);
    background-size: cover;
  }
  .tmt_p_2 {
    background-image: url(../img/tournament/photo/for_top_2.jpg);
    background-size: cover;
  }
  .tmt_p_3 {
    background-image: url(../img/tournament/photo/for_top_3.jpg);
    background-size: cover;
  }
  .bgp_center {
    background-position: center center;
  }
  .bgp_top {
    background-position: center top;
  }
  .bgp_bottom {
    background-position: center bottom;
  }
  .tmt_txt_wrap {
    width: 40%;
    height: 50%;
    height: calc(100% - 300px);
    position: absolute;
    top: 110px;
    right: 60px;
    background: transparent;
    background-image: url(../img/common/bg_trslct_80.png);
    background-repeat: repeat;
    z-index: 10;
    color: #FFFFFF;
    padding: 14px 14px;
  }
  #toplogo_mynavi {
    width: 210px;
    height: auto;
  }
  .tmt_year {
    display: inline-block;
    font-size: 42px;
    line-height: 1;
    width: 2.2em;
    height: 1em;
    position: relative;
    right: -.2em;
    top: 10px;
  }
  .tmt_txt_body {
    font-size: 13px;
    line-height: 1.65;
    padding-top: 10px;
    overflow: hidden;
  }
  a.tmt_btn {
    background: #90723C;
    border: solid 1px #A68E63;
    color: #FFFFFF;
    margin: 20px auto 4px auto;
    position: absolute;
    bottom: 10px;
    right: 14px;
  }
  a:hover.tmt_btn {
    -ms-transform: scale(1.03, 1.03);
    -webkit-transform: scale(1.03, 1.03);
    -moz-transform: scale(1.03, 1.03);
    -o-transform: scale(1.03, 1.03);
    transform: scale(1.03, 1.03);
  }
  a.tmt_btn span::before {
    border: 1px solid #C4B497;
  }
  a.tmt_btn span::after {
    border: 3px solid transparent;
    border-left: 3px solid #DED5C5;
  }
  /*トーナメントコンテンツここまで*/
  .tpbx4 {
    background-image: url(../img/top/top_crs_bg_pc.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
  }
  .tpbx4 .fp-tableCell {
    vertical-align: top !important;
  }
  .tpbx4 .sttlbx {
    position: relative;
    top: 0;
    left: 0;
    padding: 0;
    height: 30%;
    height: calc(28.4vh + 68px);
    font-size: 13px;
    width: 53em;
    margin: 0 auto;
  }
  .tpbx4 .top_sttl {
    color: #FFFFFF;
    font-size: 28px;
    text-align: center;
    padding-top: 30px;
    padding-top: 14.6vh;
    line-height: 1;
  }
  .tpbx4 .top_sttl_sub {
    color: #FFFFFF;
    padding-top: 30px;
    padding-top: 4.6vh;
    text-align: center;
    line-height: 1;
  }
  a.csg_btn {
    background: #90723C;
    border: solid 1px #A68E63;
    color: #FFFFFF;
    margin: 20px auto 4px auto;
    position: absolute;
    bottom: 0;
    right: 2em;
  }
  a:hover.csg_btn {
    -ms-transform: scale(1.03, 1.03);
    -webkit-transform: scale(1.03, 1.03);
    -moz-transform: scale(1.03, 1.03);
    -o-transform: scale(1.03, 1.03);
    transform: scale(1.03, 1.03);
  }
  a.csg_btn span::before {
    border: 1px solid #C4B497;
  }
  a.csg_btn span::after {
    border: 3px solid transparent;
    border-left: 3px solid #DED5C5;
  }
  .tpbx5 .fp-tableCell {
    vertical-align: top !important;
    padding-top: 130px;
  }
  #livecom {
    border: solid 1px #CCCCCC;
  }
  a.lvc_btn {
    border: 1px solid #AAAAAA;
  }
  a.lvc_btn span::before {
    border: 1px solid #878787;
  }
  a.lvc_btn span::after {
    border-left: 3px solid #878787;
  }
  a:hover.lvc_btn {
    -ms-transform: scale(1.03, 1.03);
    -webkit-transform: scale(1.03, 1.03);
    -moz-transform: scale(1.03, 1.03);
    -o-transform: scale(1.03, 1.03);
    transform: scale(1.03, 1.03);
  }
  .top_arrow_to_next {
    display: block;
    width: 4%;
    height: auto;
    position: absolute;
    bottom: 100px;
    left: 48%;
  }
  .top_arrow_to_next img {
    display: block;
    width: 80%;
    height: auto;
    margin: 0 auto;
  }
}

/*end min-width: 880px*/
/*start min-width: 940px*/
@media (min-width: 940px) {
  a.lvc_btn {
left:132px;
  }

}
/*end min-width: 960px*/
/*start min-width: 1000px*/
@media (min-width: 1000px) {
  a.lvc_btn {
left:136px;
  }
  .news_wrap {
    padding-right: 20px;
  }

  a.tmt_btn {
    right: 36px;
  }
  .tmt_txt_wrap {
    padding: 14px 36px;
  }
}

/*end min-width: 1000px*/
/*start min-width: 1100px*/
@media (min-width: 1100px) {
  #top_mv_logo {
    width: 30vw;
    height: auto;
    top: calc(50% - 8vw);
    left: 35vw;
  }
  #top_btm_txt {
    width: 240px;
    left: calc(50% - 120px);
  }
}

/*end min-width: 1100px*/
/*start min-width: 1200px*/
@media (min-width: 1200px) {
  .news_wrap {
    padding-right: 30px;
  }
  a.news_bodytxt {
    display: block;
    font-size: 13px;
    color: #333333;
    clear: none;
    text-decoration: none;
    padding: 0 0 0 0;
    line-height: 1;
  }
  .news_bx {
    padding: 5px 0px 5px 0px;
    padding: 2.2vh 0px 2.2vh 0px;
  }
  .sttlbx {
    padding: 20px 0px 20px 0px;
    padding: 8vh 0px 2vh 0px;
    height: 70px;
    height: 14vh;
  }
  .opcp_wrap {
    top: 320px;
    top: 40vh;
    margin: 0;
    left:60px;
    left:calc( 50vw - 540px );
    //padding: 0;
    width: 1080px;
    display: block;
  }
  .opcp_wrap .sttlbx {
    height: 110px;
    height: 16vh;
  }
  .lvc_bx h3 {
    padding: 8vh 0px 2vh 0px;
    width: 280px;
    margin: 0 auto 0 0;
    padding-right: 0;
    padding-left: 0;
  }
.lvcmbx {
    width: 280px;
    margin: 0 auto 10px 10%;
    position: relative;
}
  #livecom {
    width: 280px;
    margin: 0 auto 0 0;
  }
a.lvc_btn {
    right: 20%;
}
  #camera_bg {
    width: 280px;
    margin: 0 auto 0 0;
  }

  .tpbx2_inbx {
    width: 1200px;
    margin-left: calc(50vw - 600px);
  }
  .swiper-container {
    width: 1080px;
    margin: 0 auto;
  }
  .swiper-slide {
    width: 1080px !important;
  }
  .tmt_txt_wrap {
    width: 400px;
    right: calc(50vw - 540px);
  }
  .tmt_txt_body {
    line-height: 1.8;
  }
  a.opcp_bodytxt {
    padding-left: 10px;
  }
  #top_mv_logo {
    top: calc(50% - 7vw);
  }
}

/*end min-width: 1200px*/
/*start min-width: 1400px*/
@media (min-width: 1400px) {
  #top_mv_logo {
    width: 28vw;
    height: auto;
    left: 36vw;
    top: calc(50% - 7vw);
  }
}

/*end min-width: 1400px*/
/*start min-width: 1600px*/
@media (min-width: 1600px) {
  #top_mv_logo {
    width: 24vw;
    height: auto;
    left: 38vw;
  }
}

/*end min-width: 1600px*/

/* 2019 03 バナー告知を追加　ここから */
.topbnr-cart {
    display: block;
    text-indent: -9999px;
    background-image: url(../img/top/bnr-cart-smp.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    height: 14vw;
    margin: 20px 10px 0px 10px;
}
@media (min-width: 880px) { 
.topbnr-cart {
    background-image: url(../img/top/bnr-cart-pc.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 140px;/*280px*/
    height: 74px;/*148px*/
    position: absolute;
    top:calc( 55vh + 30px );
    left:calc( 62.5% + 144px );
    z-index: 3;
    margin: 0px 0px 0px 0px;
}
.topbnr-pcbox{
        content: "";
        display: block;
        width: 170px;
        height: 150px;
        background-color: #FFFFFF;
        position: absolute;
    top:calc( 55vh + 30px );
    left:calc( 62.5% + 124px );
        z-index: 2;
    }
.opcp_bx {
    padding: 3px 160px 3px 0px;
    padding: .8vh 160px .8vh 0px;
}
}
@media (min-width: 950px) {
.topbnr-cart{
    width: 187px;/*280px*/
    height: 99px;/*148px*/
    left:calc( 62.5% + 115px );
    }

.topbnr-pcbox{
    width: 320px;
    height: 170px;
    left:calc( 62.5% + 95px );
    }
}

@media (min-width: 1200px) {
.topbnr-cart{
    width: 280px;
    height: 148px;
    left:calc( 50% + 220px );
    top:calc( 14vh + 280px );
    
    }

.topbnr-pcbox{
    width: 400px;
    height: 270px;
    
    left:calc( 50% + 200px );
    top:calc( 14vh + 270px );
    }
}
/* 2019 03 バナー告知を追加　ここまで */

/* 2019 05 会員募集バナーを追加　ここから */
.tbnr_mbsp_a{
    display: block;
    height: 96px;
    border:1px solid #CCCCCC;
    margin:20px 10px 0px 10px;
    background: rgb(254,254,254); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(254,254,254,1) 3%, rgba(228,228,218,1) 71%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(254,254,254,1) 3%,rgba(228,228,218,1) 71%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(254,254,254,1) 3%,rgba(228,228,218,1) 71%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#e4e4da',GradientType=0 ); /* IE6-9 */  
}
.tbnr_mbsp_img{
    display: block;
    width:250px;
    height: 53px;
    margin:21px auto 0 auto;  
}
@media (min-width: 390px) {
.tbnr_mbsp_a{
    height: 110px;
}
.tbnr_mbsp_img{
    width:318px;
    height: 67px;
}
}/*end min-width: 390px*/

@media (min-width: 880px) {
.tbnr_mbsp_a{
width:290px;
height: 96px;
margin:0px;
position: absolute;
    top:-200px;
    right:20px;
}
.tbnr_mbsp_img{
width:250px;
height: 53px;
}    
}/*end min-width: 880px*/

@media (min-width: 1100px) {
.tbnr_mbsp_a{
right:50px;
}
    
}/*end min-width: 1100px*/


@media (min-width: 1300px) {
.tbnr_mbsp_a{
width:366px;
height: 110px; 
top:-214px;
}
.tbnr_mbsp_img{
    width:318px;
    height: 67px;
}

}/*end min-width: 1300px*/

@media (min-width: 1700px) {
.tbnr_mbsp_a{
width:460px;
height: 134px;
top:-240px;
}
.tbnr_mbsp_img{
    width:382px;
    height: 81px;
    margin:26px auto 0 auto; 
}

}/*end min-width: 1700px*/
/* 2019 05 会員募集バナーを追加　ここまで */


/* 2020 05 コロナ対策、カレーラーメン記事リンクを追加　ここから */


.temp_newsbx{
padding: 20px 0 0 0;
}
a.temp_a{
display: inline-block;
color: #333333;
text-decoration:none;
font-size:13px;
padding: 4px 20px 4px 0;
background: transparent url(../img/common/line-jagged-g.png) bottom left / 12px 4px repeat-x;
}
.temp_date{
display:inline-block;
padding:0 6px 6px 0;
}
.temp_ttl{
display:inline-block;
position:relative;
padding:0 0 6px 0;
}
.temp_ttl::before {
  content: " ";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  border: 1px solid #777777;
  top: 0px;
  right: -18px;
}

.temp_ttl::after {
  content: " ";
  display: block;
  width: 3px;
  height: 3px;
  position: absolute;
  border: 3px solid transparent;
  border-left: 3px solid #777777;
  top: 3px;
  right: -17px;
}
a.temp_a2{
display: inline-block;
color: #000000;
text-decoration:none;
font-size:13px;
padding: 4px 17px 6px 0;
border-bottom:1px solid #999999;
margin-bottom:20px;
position:relative;
}
.temp_a2::after {
  content: " ";
  display: block;
  width: 4px;
  height: 4px;
  position: absolute;
  border: 4px solid transparent;
  border-left: 4px solid #777777;
  top: 7px;
  right: 0px;
}
.temp_icon_att{
display: inline-block;
padding-right:6px;
position:relative;
top:-1px;
}
@media (min-width: 880px) {
.temp_newsbx{
padding: 1.6vh 0 0 0;
}
.temp_br{
display:none;
}
a.temp_a{
position:relative;
left:20px;
}
}/*end min-width: 880px*/

@media (min-width: 1200px) {
.temp_newsbx{
padding: 2.2vh 0 0 0;
}
a.temp_a{
left:30px;
}
}/*end min-width: 1200px*/

/* 2020 05 コロナ対策、カレーラーメン記事リンクを追加　ここまで */



/* 2020 10 ドレスコード バナーを追加 ここから */
.tbnr_dress_a{
    display: block;
    height: 63px;
    margin:20px 10px 0px 10px;
    padding:2px 0 0 0;
    background:#DEE1EA;
    position:relative;
}
.tbnr_dress_a_in{
display:block;
height:55px;
background:transparent;
border:1px solid #BEB29B;
margin:2px 4px 0 4px;
}
.tbnr_dress_img{
    display: block;
    width:250px;
    height: 62px;
    margin:0px auto 0 auto;
    position:relative;
    top:-4px;
}


@media (min-width: 880px) {
.tbnr_dress_a{
width:290px;
margin:0px;
position: absolute;
    top:-200px;
    right:20px;
}

}/*end min-width: 880px*/

@media (min-width: 1100px) {
.tbnr_dress_a{
right:50px;
}
    
}/*end min-width: 1100px*/


@media (min-width: 1300px) {
.tbnr_dress_a{
width:342px;
height: 73px; 
top:-214px;
}
.tbnr_dress_a_in{
height:65px;
}
.tbnr_dress_img{
    width:290px;
    height: 72px;
}

}/*end min-width: 1300px*/

@media (min-width: 1700px) {
.tbnr_dress_a{
width:382px;
height: 83px;
top:-240px;
}
.tbnr_dress_a_in{
height:75px;
}
.tbnr_dress_img{
    width:330px;
    height: 82px;
}

}/*end min-width: 1700px*/
/* 2020 10 ドレスコード バナーを追加 ここまで */



/* 2021 03 オンラインショップ バナーを追加 ここから */
.tbnr_shop_a{
    display: block;
    height: 63px;
    margin:20px 10px 0px 10px;
    padding:2px 0 0 0;
    background: url("../img/top/top_bnr_shop_smp.jpg") center / cover no-repeat #000000;
    position:relative;
}

.tbnr_shop_a_in{
display: block;
text-indent:-9999px;
}



@media (min-width: 880px) {
.tbnr_shop_a{
background: url("../img/top/top_bnr_shop_pc.jpg") center / cover no-repeat #000000;
width:290px;
margin:0px;
position: absolute;
    top:-274px;
    right:20px;
}

}/*end min-width: 880px*/

@media (min-width: 1100px) {
.tbnr_shop_a{
right:50px;
}
    
}/*end min-width: 1100px*/


@media (min-width: 1300px) {
.tbnr_shop_a{
width:342px;
height: 73px; 
top:-300px;
}
.tbnr_shop_a_in{
height:65px;
}
.tbnr_shop_img{
    width:290px;
    height: 72px;
}

}/*end min-width: 1300px*/

@media (min-width: 1700px) {
.tbnr_shop_a{
width:382px;
height: 83px;
top:-336px;
}
.tbnr_shop_a_in{
height:75px;
}
.tbnr_shop_img{
    width:330px;
    height: 82px;
}

}/*end min-width: 1700px*/
/* 2021 03 オンラインショップ バナーを追加 ここまで */




/* 2021 09 イレギュラーなバナーを追加 ここから */
.tpbx_irregular {
  position: relative;
  top: 0px;
  left: 0px;
  height: 0;
  overflow:visible;
  z-index: 8;
  }
.tbnr_vinyl_a{
display:block;
position:absolute;
top:-68vw;
top:calc( 62px - 68vw );
left:10px;
z-index: 8;
width:90%;
width:calc( 100% - 20px );
height:auto;
}
.tbnr_vinyl_img{
display:block;
width:100%;
height:auto;
}
@media (min-width: 480px) {
.tbnr_vinyl_a{
width:460px;
}
}
@media (min-width: 560px) {
.tpbx_irregular {
    position: relative;
    top: 0px;
    left: 0px;
    height: 0;
    z-index: 8;
  }
.tbnr_vinyl_a{
top:-58vw;
top:calc( 62px - 58vw );
}
}
@media (min-width: 880px) {
.tpbx_irregular {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 500px;
    height: 200px;
    z-index: 8;
  }
  .tbnr_vinyl_a{
top:20px;
left:20px;
}
}


/* 2021 03 オンラインショップ バナーを追加 ここまで */