/* イベント共通パーツ */
body {
    background-attachment:fixed;

    /** ページ全体の背景色 **/
    background-color: #E5E7E8;

}

/* メイン領域の背景色 */
#pageW1 {
    /* メイン領域の背景色の透明度を加え、rgba()で指定する */
    background-color:rgba(229,231,232,1);



    /* 透明度をOpacityに変換するサンプル
    {Opacity} = (100 - {透明度})/100;
    */
}

/* ヘッダー領域*/
#SDEventHeadBody {
    /** ヘッダー背景色 **/
    background-color:#FFFFFF;
}

#SDEventHeadBody h2,
#SDEventHeadBody h3,
#SDEventHeadBody p {
    color:#333333;
}

/* 文字色 */
.CL1 .ticket_type,
.CL1 .ticket_type div,
.SDEvent1,
.SDEvent1 .CD1,
.SLEv1,
.SDEventContact1 .CL1,
.SLSocialForm1 li .ttl,
.SLSocialForm1 li .question,
.SLSocialForm1 li .ttl.required,
.SLSocialForm1 li .question.required,
#section .SDEvent1 .CDallR,
.CD1.eventDetailBlock,
.erInquiryBlockBody,
.SDEvent1 .CD1 .newsBlock,
.user_organization_description,
input.strA
.SLSocialForm1 .data .notein,
.SLSocialForm1 li .ttl,
.SLSocialForm1 li .question,
.includeTerm.noborder,
.inquiryCheckBox
 {
    color:#333333;
}

.SDEvent1 .CD1 a,
input.strB {
    color:#239CC9;
}

.SDEvent1 .CH1,
.SDEventContact1 .CH1 {
    color:#FFFFFF;
}

/* ボーダー */
#promotionCodeBLock.typeB,
.eventListA li,
.eventListB li,
.SLEv1 li .CLHead1,
.SLEv1 li .CL1,
.SLSocialImport1,
.SDEventContact1 .CL1 li.heading {
    border-bottom-color:#FFFFFF;
}

#promotionCodeBLock,
.CDSubmit1 {
    border-top-color:#FFFFFF;
}

.SDEvent1,
.boxC,
.boxC .bbA,
.inputBoxB,
.inputBoxB h3,
.heading h3,
.selectSessionBlock .selectSessionBody,
.selectSessionBlock .selectSessionBody table,
.selectSessionBlock .selectSessionBody table th,
.selectSessionBlock .selectSessionBody table td,
#section .SDEvent1 .CDallR table,
.CD1.eventDetailBlock table,
.erInquiryBlockBody table,
.SDEvent1 .CD1 .newsBlock table,
#privacyBodyArea table,
.user_organization_description table,
#section .SDEvent1 .CDallR table td,
.CD1.eventDetailBlock table td,
.erInquiryBlockBody table td,
.SDEvent1 .CD1 .newsBlock table td,
#privacyBodyArea table td,
.user_organization_description table td,
#section .SDEvent1 .CDallR table th,
.CD1.eventDetailBlock table th,
.erInquiryBlockBody table td,
.SDEvent1 .CD1 .newsBlock table th,
#privacyBodyArea table th,
.user_organization_description table th,
.SDEventContact1,
.SDEvent1.mobileQRBlock,
.ticketSelectBlock {
    border-color:#FFFFFF;
}

#section .SDEvent1 .CDallR hr,
.CD1.eventDetailBlock hr,
.erInquiryBlockBody hr,
.SDEvent1 .CD1 .newsBlock hr,
#privacyBodyArea hr,
.user_organization_description hr {
    background-color:#FFFFFF;
}

/* 「枠線なし」の場合、以下を指定する */
.SDEvent1,
.SDEventContact1 {
    border:none !important;
}

/* 背景色 */
.SDEvent1 .CH1,
.SDEventContact1 .CH1 {
    background-color:#FFFFFF;
}

.SDEvent1 .CD1,
.fb-like-box,
.fb-comments,
input.strA,
.SDEventContact1,
.SDEventRt1,
.SDEvent1.mobileQRBlock {
    background-color:#FFFFFF;
}

/*********************************************
* 全体要素（EventRegistのCSS上書き）
*********************************************/

/* 不要な要素を非表示 */
.SDEventRt1 {
  display: none;
}

/* ボックスラッパー */
.SDEvent1 {
    background-color: #FFFFFF;
    padding-top: 20px;
  }

/* ボックスタイトル */
.CH1 {
  position: relative !important;
  width: max-content !important;
  padding: 0.7em 2em !important;
  background: linear-gradient(150deg, #333333, #333333) !important;
  margin-bottom: 10px;
  border-radius: 0 !important;
  -weblit-border-radius: 0 !important;
  font-size: 16px !important;
  font-weight: bold !important;
}

/*********************************************
* イベント概要共通
*********************************************/

/*------------------------------
* 定数
------------------------------*/
:root {
  --base-font-color: #333333;
  --base-gray-color: #edeeef;
  --base-green-color: #1ba6a1;
}

/*------------------------------
* ラッパー
------------------------------*/
.wrapper {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  padding: 10px;
  margin: 0;
  background-color: #ffffff;
}

.wrapper * {
  box-sizing: border-box;
  display: block;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.5;
  color: #333333;
  background-color: transparent;
  text-decoration: none;
  text-align: left;
  letter-spacing: 0.01em;
  padding: 0;
  margin: 0;
}

/*------------------------------
* セクション
------------------------------*/
.section {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  padding: 0;
  margin-bottom: 50px;
}

.section-title {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding-bottom: 2px;
  margin-bottom: 40px;
  text-align: left;
  font-size: 18px;
  font-weight: bold;
  border-bottom: 5px solid var(--base-green-color);
}

.section-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  padding: 20px;
  margin: 0;
}

/*------------------------------
* セクション - narrow
------------------------------*/
@media screen and (max-width: 580px) {
  .section-content {
    padding: 20px 0px;
  }
}

/*********************************************
* イントロダクション - wide
*********************************************/

.introduction-text {
  display: block;
  width: 100%;
  height: auto;
  text-align: left;
  margin-bottom: 20px;
}

.introduction-img-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  height: 260px;
  padding: 0;
  margin: 0;
}

.introduction-img {
  display: block;
  width: 57%;
  height: 100%;
}

.introduction-img {
  background: url(https://er-static.s3.amazonaws.com/uploads/event_image/4e648c184b02a6c6479393233b8785f8/18dfdea3768012f587ab8429378fc59f319f7617.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/*********************************************
* イントロダクション - middle
*********************************************/

@media screen and (max-width: 768px) {
  .introduction-img {
    display: block;
    min-width: 65%;
    height: 100%;
  }
}

/*********************************************
* イントロダクション - narrow
*********************************************/
@media screen and (max-width: 580px) {
  .introduction-img-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 200px;
    padding: 0;
    margin: 0;
  }

  .introduction-img {
    display: block;
    min-width: 80%;
    max-width: 80%;
    height: 100%;
  }
}

/*********************************************
* おすすめ - wide
*********************************************/

:root {
  --recommend-list-copy-mark-size: 36px;
  --recommend-list-copy-width: 55%;
}

.recommend-lists-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}

.recommend-list {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  min-width: 100%;
  height: auto;
  padding: 20px;
  margin-bottom: 20px;
  background-color: var(--base-gray-color);
  border-radius: 10px;
}

.recommend-list-copy {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: var(--recommend-list-copy-width);
  height: 100%;
  margin-bottom: 0;
}

.recommend-list-copy-mark {
  display: block;
  width: var(--recommend-list-copy-mark-size);
  min-width: var(--recommend-list-copy-mark-size);
  height: var(--recommend-list-copy-mark-size);
}

.recommend-list-copy-mark {
  background: url(https://er-static.s3.amazonaws.com/uploads/event_image/4e648c184b02a6c6479393233b8785f8/12756505a33d0f9bb0eb3222d4150f475d19e055.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.recommend-list-copy-text {
  display: block;
  font-size: 17px;
  font-weight: bold;
  line-height: 1.7;
  color: var(--base-font-color);
  width: calc(100% - var(--recommend-list-copy-mark-size));
  min-width: calc(100% - var(--recommend-list-copy-mark-size));
  padding-top: calc(var(--recommend-list-copy-mark-size) * 0.13);
  padding-left: 0.7em;
}

.recommend-list-img-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  width: calc(100% - var(--recommend-list-copy-width));
  min-width: calc(100% - var(--recommend-list-copy-width));
  height: 200px;
}

.recommend-list-img {
  display: block;
  width: 100%;
  min-width: 100%;
  height: 100%;
}

.recommend-list:nth-of-type(1) .recommend-list-img {
  background: url(https://er-static.s3.amazonaws.com/uploads/event_image/4e648c184b02a6c6479393233b8785f8/b21cfc2a9d5e4f4cf2b797c4c4618e87773e2d77.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.recommend-list:nth-of-type(2) .recommend-list-img {
  background: url(https://er-static.s3.amazonaws.com/uploads/event_image/4e648c184b02a6c6479393233b8785f8/c68cfb75f3cf0391166ea10dd5cd5a77b4478722.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.recommend-list:nth-of-type(3) .recommend-list-img {
  background: url(https://er-static.s3.amazonaws.com/uploads/event_image/4e648c184b02a6c6479393233b8785f8/4e1232f546ef973815ed9970274b26d6b4bf31ae.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/*********************************************
* おすすめ - middle
*********************************************/

@media screen and (max-width: 768px) {
  .recommend-list-copy-mark {
    display: block;
    width: calc(var(--recommend-list-copy-mark-size) * 0.9);
    min-width: calc(var(--recommend-list-copy-mark-size) * 0.9);
    height: calc(var(--recommend-list-copy-mark-size) * 0.9);
  }

  .recommend-list-copy-text {
    font-size: calc(17px * 0.9);
    width: calc(100% - var(--recommend-list-copy-mark-size) * 0.9);
    min-width: calc(100% - var(--recommend-list-copy-mark-size) * 0.9);
    padding-top: calc(var(--recommend-list-copy-mark-size) * 0.13);
  }

  .recommend-list-img-wrapper {
    height: 180px;
  }
}

/*********************************************
* おすすめ - narrow
*********************************************/

@media screen and (max-width: 580px) {
  .recommend-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 0px;
  }

  .recommend-list-copy {
    margin-bottom: 20px;
  }

  .recommend-list-img-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-width: 100%;
    height: 160px;
  }
}

/*********************************************
* タイムスケジュール - wide, middle, narrow
*********************************************/

/*------------------------------
* 日付レベル
------------------------------*/
.schedule-date-lists-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
}

.schedule-date-list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  background-color: var(--base-gray-color);
  border-radius: 10px;
  padding: 30px 25px;
  margin-bottom: 20px;
}

.schedule-date-title {
  display: block;
  text-align: left;
  font-size: 20px;
  font-weight: normal;
  color: var(--base-font-color);
  margin-bottom: 30px;
}

/*------------------------------
* 時刻レベル
------------------------------*/
.schedule-time-lists-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
}

.schedule-time-list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
}

.schedule-time-label {
  display: block;
  text-align: left;
  font-size: 14px;
  color: var(--base-green-color);
  background-color: #ffffff;
  font-weight: bold;
  line-height: 1;
  padding: 0.6em 1.5em;
  margin-bottom: 30px;
  border-radius: 1.5em;
}

.schedule-time-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  padding: 0px 20px;
  margin: 0;
}

.schedule-time-content-title {
  display: block;
  font-size: 14px;
  font-weight: bold;
  text-align: left;
  line-height: 1.5;
  margin-bottom: 30px;
}

.schedule-time-content-description {
  display: block;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  line-height: 1.5;
  margin-bottom: 30px;
}

/*********************************************
* プロフィール - wide
*********************************************/
:root {
  --profile-img-size: 240px;
}

.profile-lists-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
}

.profile-list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  background-color: var(--base-gray-color);
  border-radius: 10px;
  padding: 30px 50px;
  margin-bottom: 20px;
}

.profile-img-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  min-width: 100%;
  height: auto;
  padding: 0;
  margin: 0;
}

.profile-img {
  display: block;
  width: var(--profile-img-size);
  min-width: var(--profile-img-size);
  max-width: var(--profile-img-size);
  height: auto;
}

.profile-name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  font-size: 18px;
  font-weight: bold;
  padding: 1.2em 0.1em;
  margin: 0;
  width: 100%;
  height: auto;
  border-top: 2px solid #999999;
  border-bottom: 2px solid #999999;
}

.profile-description {
  display: block;
  width: 100%;
  height: auto;
  font-size: 14px;
  color: var(--base-font-color);
  padding: 1.3em 0em;
  margin: 0;
}

/*********************************************
* プロフィール - narrow
*********************************************/

@media screen and (max-width: 580px) {
  .profile-list {
    padding: 25px 20px;
    margin-bottom: 20px;
  }

  .profile-img {
    display: block;
    width: 85%;
    min-width: 160px;
    max-width: 160px;
    height: auto;
  }
}

/*********************************************
* 協賛企業
*********************************************/

.logo-lists-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  min-width: 100%;
  padding: 0;
}

.logo-list-sunward {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 200px;
  min-width: 200px;
  max-width: 200px;
  height: auto;
  margin: 0px 10px 30px 10px;
}

.logo-list-ds {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 270px;
  min-width: 270px;
  max-width: 270px;
  height: auto;
  margin: 0px 10px 30px 10px;
}

.logo-list-idea {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 200px;
  min-width: 200px;
  max-width: 200px;
  height: auto;
  margin: 0px 10px 30px 10px;
}


.logo-list-ecrowd {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 300px;
  min-width: 300px;
  max-width: 300px;
  height: auto;
  margin: 0px 10px 30px 10px;
}

.logo-list-cocozas {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 200px;
  min-width: 200px;
  max-width: 200px;
  height: auto;
  margin: 0px 10px 30px 10px;
}

.logo-text {
  width: auto;
  height: auto;
  align-items: center;
  font-size: 40px;
  font-weight: bold;
  color: #000000;
  margin: 0;
}

.logo-img {
  display: block;
  width: 100%;
  min-width: 100%;
  height: auto;
}


/*********************************************
* 協賛企業 - narrow
*********************************************/
@media screen and (max-width: 580px) {
  .logo-lists-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
  }

  .logo-list-sunward {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    height: auto;
    margin: 0px 10px 30px 10px;
  }
  
  .logo-list-ds {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 270px;
    min-width: 270px;
    max-width: 270px;
    height: auto;
    margin: 0px 10px 30px 10px;
  }

  .logo-list-idea {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    height: auto;
    margin: 0px 10px 30px 10px;
  }
  
  
  .logo-list-ecrowd {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 300px;
    min-width: 300px;
    max-width: 300px;
    height: auto;
    margin: 0px 10px 30px 10px;
  }
  
  .logo-list-cocozas {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    height: auto;
    margin: 0px 10px 30px 10px;
  }
}

/*********************************************
* 注意事項
*********************************************/
.note-title {
  display: block;
  font-size: 14px;
  color: var(--base-font-color);
  font-weight: bold;
  text-align: left;
  width: 100%;
  margin-bottom: 0.5em;
}

.note-list-content {
  display: block;
  font-size: 12px;
  color: var(--base-font-color);
  font-weight: normal;
  text-align: left;
  width: 100%;
}

/*********************************************
* 視聴方法
*********************************************/
.view-method {
  display: block;
  font-size: 14px;
  color: var(--base-font-color);
  font-weight: bold;
  text-align: left;
  width: 100%;
  margin-bottom: 0.5em;
}