@charset "UTF-8";
/* SpCommonReset
**************************** */
/* h1 and h2 */
.beams-anaWrap {
max-width:750px;
width:100%;
margin:0 auto;
-webkit-text-size-adjust:100%;
background: #fff;
}
.beams-anaWrap img {
vertical-align: top;
width: 100%;
height: auto;
zoom: 1 !important;
}
.beams-anaWrap a {
display: block;
}
h1 {
padding-top: 0;
}
h2 {
padding: 0;
font-size: 0;
background-color: transparent;
}
.pcOnly {
display: none;
}
.pc-content {
display: none;
}

/* wrap */
.beams-anaWrap {
max-width:750px;
width:100%;
margin:0 auto;
-webkit-text-size-adjust:100%;
background: #ffffff;
}
.beams-anaWrap img {
vertical-align: top;
width: 100%;
height: auto;
zoom: 1 !important;
}
.beams-anaWrap h2 {
margin-top: 12%;
margin-bottom: 6%;
}
/* navBlockA01 */
.navBlockA01{
margin-top: calc(40 / 750 * 100%);
}
.navBlockA01 ul{
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}
.navBlockA01 ul li:first-child{
margin: 0 30px;
}
.navBlockA01 ul li{
width: calc(330 / 750 * 100%);
}
/* comingSoon */
.comingSoon{
width: calc(520 / 750 * 100%);
margin: auto;
}
.itemImg{
width: calc(690 / 750 * 100%);
margin: calc(90 / 750 * 100%) auto 0;
}
/* conceptBlock */
.conceptBlock{
margin-top: calc(100 / 750 * 100%);
padding: calc(110 / 750 * 100%) calc(60 / 750 * 100%);
background: url(/contents/0018/img/event/beams-ana/beams-ana_sp_bg_001_260817.jpg) no-repeat;
aspect-ratio: 750 / 2557;
background-size: contain;
}
.conceptBlock h2{
margin: 0;
}
.conceptBlock h3{
margin-top: calc(60 / 750 * 100%);
}
.conceptBlock p{
margin-top: calc(10 / 750 * 100%);
font-size: clamp(13px, 3.8vw, 28px);
line-height: 1.44;
}
.conceptBlock .conceptImg{
margin-top: calc(60 / 750 * 100%);
}
/* designerBlock */
.designerBlock{
margin-top: calc(100 / 750 * 100%);
padding: calc(100 / 750 * 100%) calc(60 / 750 * 100%);
background: url(/contents/0018/img/event/beams-ana/beams-ana_sp_bg_002_260817.jpg) no-repeat;
aspect-ratio: 750 / 2549;
background-size: contain;
}
.designerBlock h2{
margin: 0;
}
.designerBlock h3{
margin-top: calc(60 / 750 * 100%);
}
.designerBlock .designerImg{
width: calc(330 / 690 * 100%);
margin: calc(20 / 750 * 100%) auto 0;
}
.designerBlock .designerTxt{
margin-top: calc(50 / 750 * 100%);
}
.designerBlock .designerTxt p{
margin-top: calc(30 / 750 * 100%);
font-size: clamp(13px, 3.8vw, 28px);
line-height: 1.44;
}
.designerBlock .lineBlock{
margin: calc(50 / 750 * 100%) 0 calc(50 / 750 * 100%);
border-top: 1px solid #ccc;
}
.imgBlock {
margin-top: calc(50 / 750 * 100%);
}
.ttlBlockA01 {
margin-top: 12%;
}
/* bannerList */
.col2-286_286 .bannerList {
  --gap: 20px;
  gap: var(--gap);
}

.col3-286_286 .bannerList {
  --gap: 10px;
  gap: var(--gap);
}
/* .bannerItem:first-child{
width: 100%;
} */
.bannerItem{
width: 49%;
}
.bannerWrap {
  margin: calc(50 / 750 * 100%) auto;
}
.titleBlock-h2 {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}
.bannerList {
  margin-top: calc(20 / 750 * 100%);
  margin-inline: auto;
  width:calc(690 / 750 * 100%);
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
}
.justify-content-center .bannerList {
  justify-content: center !important;
}
.noteBox.gray {
  margin-top:  calc(30 / 750 * 100%);
  margin-inline: auto;
  padding: 0.5em 1em;
  width: calc(690 / 750 * 100%);
  background-color: #e3e5ed;
}
.noteBox.gray .noteText {
  padding-left: 1em;
  text-indent: -1em;
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: 0.3px;
}
.noteBox {
  margin-top:  calc(30 / 750 * 100%);
  margin-inline: auto;
  width: calc(690 / 750 * 100%);
}
.noteBox .noteText {
  padding-left: 1em;
  text-indent: -1em;
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: 0.3px;
}
