@charset "UTF-8";
/* Create with Compass + SCSS on windows */
/* ... One Song 灣聲官方網站 ... */
.main .orchestra > *,
.main .committee > * {
  margin: 0 auto;
}

.hiddenItem {
  font-size: 1px;
  line-height: 0;
  text-indent: 0;
  visibility: hidden;
}

.hideItem {
  display: none;
}

.clearFloat {
  clear: both;
  margin: 0;
  padding: 0;
  line-height: 0;
  font-size: 0;
  height: 0;
  display: block;
  width: 100%;
}

.main .orchestra > *,
.main .committee > * {
  padding: 0;
  max-width: 1200px;
  min-width: 1200px;
}

.main .orchestra dl,
.main .committee dl,
.main .innerCommittee dl {
  /*dt 的公用段落,置中有底色*/
}
.main .orchestra dl > dt,
.main .committee dl > dt,
.main .innerCommittee dl > dt {
  margin-bottom: 40px;
}
.main .orchestra dl > dt h3,
.main .orchestra dl > dt span,
.main .committee dl > dt h3,
.main .committee dl > dt span,
.main .innerCommittee dl > dt h3,
.main .innerCommittee dl > dt span {
  color: #fff;
}
.main .orchestra dl > dt h3,
.main .committee dl > dt h3,
.main .innerCommittee dl > dt h3 {
  position: relative;
  font-size: 1em;
  height: 40px;
}
.main .orchestra dl > dt h3 span,
.main .committee dl > dt h3 span,
.main .innerCommittee dl > dt h3 span {
  font-size: 189%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 2;
}
.main .orchestra dl > dt h3 span.colorBox,
.main .committee dl > dt h3 span.colorBox,
.main .innerCommittee dl > dt h3 span.colorBox {
  z-index: 1;
  width: auto;
  top: auto;
  left: calc(50% - 2.5em);
  right: calc(50% - 2.5em);
  bottom: 0;
  background-color: #B48663;
  height: 23px;
}
.main .orchestra dl > dt > span,
.main .committee dl > dt > span,
.main .innerCommittee dl > dt > span {
  font-size: 108%;
  display: block;
  text-align: center;
  font-weight: normal;
  letter-spacing: 1px;
  word-spacing: 1px;
}

.main {
  /*
  .innerCommittee{
  	background-image: url('../images/about_inner_committee.jpg');
  }
  */
}
.main .siteBreadCrumb {
  padding-top: 0;
  position: relative;
}
.main .siteBreadCrumb h3 {
  position: absolute;
  top: 53px;
  left: 0;
  width: 100%;
}
.main .orchestra,
.main .committee,
.main .innerCommittee {
  padding-top: 100px;
  padding-bottom: 100px;
}
.main .orchestra dl,
.main .committee dl,
.main .innerCommittee dl {
  padding-bottom: 40px;
}
.main .orchestra dl dd .ckx p,
.main .committee dl dd .ckx p,
.main .innerCommittee dl dd .ckx p {
  margin-bottom: 35px;
}
.main .orchestra {
  padding-top: 83px;
}
.main .innerCommittee {
  padding-bottom: 0px;
}
.main .innerCommittee dl dd {
  /*.crew:before{
  	@extend %transparentImgBackGroundBefore;
  }*/
}
.main .innerCommittee dl dd .stratum {
  position: relative;
  margin-bottom: 0;
  padding: 40px 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  text-align: center;
}
.main .innerCommittee dl dd .stratum ul {
  display: inline-block;
  /*width: 1260px;*/
  margin-bottom: 0;
  text-align: center;
}
.main .innerCommittee dl dd .stratum ul li {
  display: inline-block;
  margin-bottom: 0;
  text-align: center;
}
.main .innerCommittee dl dd .stratum ul li figure {
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 0;
  width: 290px;
  height: 430px;
  text-align: left;
}
.main .innerCommittee dl dd .stratum ul li figure > a {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.main .innerCommittee dl dd .stratum ul li figure figcaption {
  position: absolute;
  right: -50px;
  bottom: 20px;
  width: 130px;
  height: 200px;
  z-index: 2;
  padding: 20px 15px;
  padding-top: 10px;
  text-align: left;
  pointer-events: none;
}
.main .innerCommittee dl dd .stratum ul li figure figcaption h4 {
  font-size: 1em;
}
.main .innerCommittee dl dd .stratum ul li figure figcaption h4 span {
  font-size: 126%;
}
.main .innerCommittee dl dd .stratum ul li figure figcaption strong.title,
.main .innerCommittee dl dd .stratum ul li figure figcaption strong.title.eng {
  /*@include fontSize("16pt");*/
  font-size: 14px;
  display: block;
  font-weight: normal;
}
.main .innerCommittee dl dd .stratum ul li figure figcaption span.intro {
  font-size: 104%;
  position: absolute;
  left: 20px;
  bottom: 5px;
  width: auto;
  height: auto;
  color: #382819;
}
.main .innerCommittee dl dd .stratum ul li figure figcaption > br {
  display: none;
}
.main .innerCommittee dl dd .member ul li {
  margin-bottom: 60px;
}
.main .innerCommittee dl dd .member ul li figure figcaption {
  right: -80px;
  background-color: #B48663;
}
.main .innerCommittee dl dd .member.primary ul li figure,
.main .innerCommittee dl dd .member.secondary ul li figure {
  width: 320px;
  height: 450px;
}
.main .innerCommittee dl dd .member ul li figure {
  width: 190px;
  height: 285px;
}
.main .innerCommittee dl dd .member.primary,
.main .innerCommittee dl dd .member.secondary {
  padding: 60px 0;
}
.main .innerCommittee dl dd .member.primary ul,
.main .innerCommittee dl dd .member.secondary ul {
  width: auto;
}
.main .innerCommittee dl dd .member.primary ul li,
.main .innerCommittee dl dd .member.secondary ul li {
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
}
.main .innerCommittee dl dd .member.secondary ul li:nth-child(3n - 1) {
  /*1,4,7,10...*/
  margin-left: 115px;
  margin-right: 115px;
}
.main .innerCommittee dl dd .member {
  padding: 40px 0;
}
.main .innerCommittee dl dd .member ul {
  width: 1260px;
}
.main .innerCommittee dl dd .member ul li:first-child,
.main .innerCommittee dl dd .member ul li:nth-child(4n + 1) {
  margin-left: 0;
}
.main .innerCommittee dl dd .member ul li {
  margin-left: 115px;
  margin-bottom: 60px;
}

@charset "UTF-8";
/* Create with Compass + SCSS on windows */
/* ... One Song 灣聲官方網站 ... */
.hiddenItem {
  font-size: 1px;
  line-height: 0;
  text-indent: 0;
  visibility: hidden;
}

.hideItem {
  display: none;
}

.clearFloat {
  clear: both;
  margin: 0;
  padding: 0;
  line-height: 0;
  font-size: 0;
  height: 0;
  display: block;
  width: 100%;
}

@media (max-width: 767.98px) {
  .main .orchestra > *,
  .main .committee > *,
  .main .innerCommittee > * {
    max-width: inherit;
    min-width: inherit;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
  .main .orchestra > *,
  .main .committee > *,
  .main .innerCommittee > * {
    max-width: inherit;
    min-width: inherit;
  }
}

@charset "UTF-8";
/* Create with Compass + SCSS on windows */
/* ... One Song 灣聲官方網站 ... */
.hiddenItem {
  font-size: 1px;
  line-height: 0;
  text-indent: 0;
  visibility: hidden;
}

.hideItem {
  display: none;
}

.clearFloat {
  clear: both;
  margin: 0;
  padding: 0;
  line-height: 0;
  font-size: 0;
  height: 0;
  display: block;
  width: 100%;
}

.main {
  background-image: none;
  /*
  .innerCommittee{
  }
  */
}
.main .orchestra,
.main .committee,
.main .innerCommittee {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
.main .orchestra dl dd .ckx p,
.main .committee dl dd .ckx p,
.main .innerCommittee dl dd .ckx p {
  font-size: 104%;
  line-height: 1.8;
  color: #fff;
}
.main .orchestra dl dd hr,
.main .committee dl dd hr,
.main .innerCommittee dl dd hr {
  border-top: #B48663 solid 1px;
}
.main .orchestra {
  background-image: url("../images/about_orchestra_bg.jpg");
}
.main .committee {
  background-image: url("../images/about_committee_bg.jpg");
}
.main .innerCommittee dl dd .member.primary,
.main .innerCommittee dl dd .member.secondary {
  background-size: cover;
}
.main .innerCommittee dl dd .member.primary {
  background-image: url("../images/about_inner_committee_prymary_bg.jpg");
  background-color: #fff;
}
.main .innerCommittee dl dd .member.secondary {
  background-image: url("../images/about_inner_committee_secondary.jpg");
  background-color: #1b1d20;
}
.main .innerCommittee dl dd .member {
  background-image: url("../images/mutual_page_bg.jpg");
  background-position: center top;
  background-color: #1b1d20;
}
.main .innerCommittee dl dd .member ul li figure figcaption h4,
.main .innerCommittee dl dd .member ul li figure figcaption strong.title,
.main .innerCommittee dl dd .member ul li figure figcaption strong.title.eng {
  color: #fff;
}
.main .innerCommittee dl dd .member ul li figure:hover figcaption {
  background-color: #fff;
}
.main .innerCommittee dl dd .member ul li figure:hover figcaption h4,
.main .innerCommittee dl dd .member ul li figure:hover figcaption strong.title,
.main .innerCommittee dl dd .member ul li figure:hover figcaption strong.title.eng {
  color: #B48663;
}
.main .innerCommittee dl dd .member.secondary ul li:nth-child(3n - 1) {
  /*1,4,7,10...*/
}

@charset "UTF-8";
/* Create with Compass + SCSS on windows */
/* ... One Song 灣聲官方網站 ... */
.hiddenItem {
  font-size: 1px;
  line-height: 0;
  text-indent: 0;
  visibility: hidden;
}

.hideItem {
  display: none;
}

.clearFloat {
  clear: both;
  margin: 0;
  padding: 0;
  line-height: 0;
  font-size: 0;
  height: 0;
  display: block;
  width: 100%;
}

@media (max-width: 767.98px) {
  .main .orchestra > *,
  .main .committee > * {
    max-width: inherit;
    min-width: inherit;
  }

  .main .siteBreadCrumb {
    padding: 0;
  }
  .main .siteBreadCrumb h3 {
    top: 30px;
    left: 15px;
    width: auto;
  }
  .main .orchestra,
  .main .committee,
  .main .innerCommittee {
    padding: 30px 15px;
  }
  .main .orchestra {
    padding-top: 113px;
  }
  .main .committee,
  .main .innerCommittee {
    padding-top: 40px;
  }
  .main .innerCommittee dl dd {
    /*
    .crew:before,
    .crew.guestChief:before,
    .crew.chiefPlayer:before,
    .crew.director:before{
    	display: none;
    }
    */
  }
  .main .innerCommittee dl dd .stratum {
    padding: 0;
    margin-bottom: 45px;
  }
  .main .innerCommittee dl dd .stratum ul {
    display: block;
    width: 100%;
  }
  .main .innerCommittee dl dd .stratum ul li figure {
    width: 100%;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption {
    width: 100%;
    height: auto;
    right: 0;
    bottom: 0;
    padding: 10px;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption h4 {
    display: inline;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption strong.title,
  .main .innerCommittee dl dd .stratum ul li figure figcaption strong.title.eng {
    display: inline;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption span.intro {
    display: none;
  }
  .main .innerCommittee dl dd .member.secondary ul li:nth-child(3n - 1) {
    /*1,4,7,10...*/
    margin-left: 0;
    margin-right: 0;
  }
  .main .innerCommittee dl dd .member.secondary ul li {
    margin-bottom: 30px;
  }
  .main .innerCommittee dl dd .member.secondary ul li figure figcaption {
    text-align: right;
    background-color: rgba(255, 255, 255, 0.65);
  }
  .main .innerCommittee dl dd .member.secondary ul li figure figcaption h4 {
    text-align: right;
  }
  .main .innerCommittee dl dd .member.secondary ul li figure figcaption h4,
  .main .innerCommittee dl dd .member.secondary ul li figure figcaption strong.title,
  .main .innerCommittee dl dd .member.secondary ul li figure figcaption strong.title.eng {
    color: #B48663;
  }
  .main .innerCommittee dl dd .member.secondary ul li figure:hover figcaption {
    background-color: #B48663;
  }
  .main .innerCommittee dl dd .member.secondary ul li figure:hover figcaption h4,
  .main .innerCommittee dl dd .member.secondary ul li figure:hover figcaption strong.title,
  .main .innerCommittee dl dd .member.secondary ul li figure:hover figcaption strong.title.eng {
    color: #fff;
  }
  .main .innerCommittee dl dd .member,
  .main .innerCommittee dl dd .member.secondary,
  .main .innerCommittee dl dd .member.secondary,
  .main .innerCommittee dl dd .member.primary {
    padding-top: 0;
    background: none !important;
  }
  .main .innerCommittee dl dd .member ul li,
  .main .innerCommittee dl dd .member.secondary ul li,
  .main .innerCommittee dl dd .member.secondary ul li,
  .main .innerCommittee dl dd .member.primary ul li {
    width: 100%;
    margin-bottom: 30px;
  }
  .main .innerCommittee dl dd .member ul li figure,
  .main .innerCommittee dl dd .member.secondary ul li figure,
  .main .innerCommittee dl dd .member.secondary ul li figure,
  .main .innerCommittee dl dd .member.primary ul li figure {
    width: 100%;
    height: 171vw;
  }
}
@media (max-width: 767.98px) and (orientation: portrait) {
  .main .innerCommittee dl dd .member ul li figure,
  .main .innerCommittee dl dd .member.secondary ul li figure,
  .main .innerCommittee dl dd .member.secondary ul li figure,
  .main .innerCommittee dl dd .member.primary ul li figure {
    width: 100%;
    height: 71vh;
  }
}
@media (max-width: 767.98px) {
  .main .innerCommittee dl dd .member ul li {
    margin-bottom: 30px;
  }
  .main .innerCommittee dl dd .member.primary,
  .main .innerCommittee dl dd .member.secondary {
    padding-bottom: 0;
  }
  .main .innerCommittee dl dd .member ul li {
    float: left;
    width: 50%;
    margin-bottom: 30px;
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
  .main .innerCommittee dl dd .member ul li figure {
    width: calc(50vw - 45px);
    height: 100vh;
  }
  .main .innerCommittee dl dd .member ul li figure figcaption {
    background-color: rgba(162, 121, 55, 0.65);
  }
  .main .innerCommittee dl dd .member ul li figure:hover figcaption {
    background-color: #fff;
  }
  .main .innerCommittee dl dd .member ul li:nth-child(2n) {
    text-align: right;
  }
}
@media (max-width: 767.98px) and (orientation: portrait) {
  .main .innerCommittee dl dd .member ul li figure {
    width: calc(50vw - 30px);
    height: 35vh;
  }
  .main .innerCommittee dl dd .member ul li figure figcaption h4 {
    display: block;
  }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  .main .orchestra > *,
  .main .committee > * {
    max-width: inherit;
    min-width: inherit;
  }

  .main .siteBreadCrumb {
    padding: 0;
  }
  .main .siteBreadCrumb h3 {
    top: 53px;
    left: 30px;
    width: calc(100% - 30px);
  }
  .main .orchestra,
  .main .committee {
    padding: 45px 30px;
  }
  .main .innerCommittee {
    padding-bottom: 0px;
  }
  .main .innerCommittee dl dd .stratum {
    padding: 30px 0;
  }
  .main .innerCommittee dl dd .stratum ul {
    display: inline-block;
    width: 100%;
  }
  .main .innerCommittee dl dd .stratum ul li figure {
    width: 26vw;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption {
    width: auto;
    height: auto;
    right: -10px;
    padding-top: 30px;
    padding-bottom: 10px;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption h4 {
    display: inline;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption strong.title,
  .main .innerCommittee dl dd .stratum ul li figure figcaption strong.title.eng {
    display: inline;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption span.intro {
    top: 5px;
    left: auto;
    right: 15px;
    bottom: auto;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px) and (orientation: portrait) {
  .main .innerCommittee dl dd .stratum {
    padding: 20px 0;
  }
  .main .innerCommittee dl dd .stratum ul li figure {
    width: 30vw;
    height: 30vh;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption {
    left: 0;
    right: 0;
    bottom: 0;
    padding: 5 5px;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption h4 span {
    font-size: 108%;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption strong.title,
  .main .innerCommittee dl dd .stratum ul li figure figcaption strong.title.eng {
    font-size: 89%;
  }
  .main .innerCommittee dl dd .stratum ul li figure figcaption span.intro {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
  .main .innerCommittee dl dd .member.primary ul li figure,
  .main .innerCommittee dl dd .member.secondary ul li figure {
    width: 30vw;
  }
  .main .innerCommittee dl dd .member ul li figure {
    width: 21vw;
    height: 40vh;
  }
  .main .innerCommittee dl dd .member
  .member.primary ul,
  .main .innerCommittee dl dd .member.secondary ul {
    width: auto;
  }
  .main .innerCommittee dl dd .member
  .member.primary ul li figure figcaption,
  .main .innerCommittee dl dd .member.secondary ul li figure figcaption {
    min-width: 19vw;
  }
  .main .innerCommittee dl dd .member.secondary ul li:nth-child(3n - 1) {
    /*1,4,7,10...*/
    margin-left: 3vw;
    margin-right: 3vw;
  }
  .main .innerCommittee dl dd .member {
    padding: 40px 0;
  }
  .main .innerCommittee dl dd .member ul li {
    margin-left: 3.5vw;
    margin-bottom: 60px;
  }
  .main .innerCommittee dl dd .member ul li figure {
    width: 18vw;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px) and (orientation: portrait) {
  .main .innerCommittee dl dd .member ul li {
    margin-bottom: 30px;
  }
  .main .innerCommittee dl dd .member ul li figure {
    width: 19vw;
    height: 25vh;
  }
  .main .innerCommittee dl dd .member ul li figure figcaption {
    background-color: rgba(162, 121, 55, 0.65);
  }
  .main .innerCommittee dl dd .member ul li figure:hover figcaption {
    background-color: #fff;
  }
  .main .innerCommittee dl dd .member.primary ul li figure,
  .main .innerCommittee dl dd .member.secondary ul li figure {
    width: 30vw;
    height: 30vh;
  }
}
