@charset "UTF-8";
/*
///////////////////////////////////////////
CSS FOR GALLERY02
Made by Truong Van Thanh
///////////////////////////////////////////
*/
/*/////SUB-VISUAL/////*/
#Sub-visual {
  width: 100%;
  height: 149px;
  margin: 0 auto 20px;
}

.inner-subvisual {
  width: 921px;
  height: 149px;
  position: relative;
  background: url(../images/gallery/img_subvisual.png) no-repeat center center;
}

.heading-two {
  width: 326px;
  height: 115px;
  position: absolute;
  top: 15px;
  left: 30px;
}

.heading-three {
  height: 50px;
  text-align: center;
  background: url(../images/contact/bg_h3.png) no-repeat center bottom;
  margin: 0 0 20px;
}
.heading-three.salon {
  margin: 0 0 50px;
}

.heading-four {
  text-align: left;
  margin: 0 0 15px;
}
.heading-four.case1 {
  padding: 0 0 23px 50px;
  margin: 0;
  background: url(../images/gallery02/history/bg_h4.png) no-repeat left bottom;
}
.heading-four.case2 {
  margin: 0 0 5px;
  padding: 10px 0 30px 70px;
  background: url(../images/gallery02/exhibition/bg_h4.png) no-repeat left bottom;
}

.heading-five {
  text-align: center;
  padding: 32px 0 25px 0;
  background: url(../images/gallery02/exhibition/bg_h5.png) no-repeat center bottom;
}

.breadcrumb {
  width: 900px;
  height: 25px;
  margin: 0 auto 30px;
  padding: 0 30px;
}
.breadcrumb li {
  font-size: 100%;
  line-height: 20px;
  color: #000800;
  float: left;
}
.breadcrumb li.top {
  height: 22px;
  width: 85px;
  padding: 3px 0 0 35px;
  background: url(../images/common/pattern_01.png) no-repeat left center;
}
.breadcrumb li.page {
  height: 22px;
  padding: 3px 35px 0 0;
  background: url(../images/common/pattern_02.png) no-repeat right center;
}
.breadcrumb li a {
  color: #000800;
  text-decoration: none;
}
.breadcrumb li a:hover {
  text-decoration: underline;
}

#Main {
  float: right;
}

/*/////SIDE/////*/
#Side {
  float: left;
  padding: 0 0 0 20px;
}

#Saren {
  width: 230px;
  margin: 0 0 20px;
}
#Saren .bg-top {
  width: 230px;
  padding-top: 90px;
  background: url(../images/profile/bg_top_saren.png) no-repeat left top;
}
#Saren .bg-bottom {
  width: 230px;
  padding-bottom: 10px;
  background: url(../images/profile/bg_bottom_saren.png) no-repeat left bottom;
}
#Saren .bg-middle {
  width: 230px;
  background: url(../images/profile/bg_middle_saren.png) repeat-y;
}

#Gallery {
  width: 230px;
}
#Gallery .bg-top {
  width: 230px;
  padding-top: 90px;
  background: url(../images/profile/bg_top_gallery.png) no-repeat left top;
}
#Gallery .bg-bottom {
  width: 230px;
  padding-bottom: 10px;
  background: url(../images/profile/bg_bottom_gallery.png) no-repeat left bottom;
}
#Gallery .bg-middle {
  width: 230px;
  background: url(../images/profile/bg_middle_gallery.png) repeat-y;
}

.block-sidebar {
  position: relative;
}
.block-sidebar .title-side {
  position: absolute;
  left: 2px;
  top: 32px;
  cursor: pointer;
}

.list-sidebar {
  padding: 5px 0 15px 20px;
}
.list-sidebar li {
  padding: 7px 0;
}
.list-sidebar li a {
  display: block;
}
.list-sidebar.show {
  display: block;
}
.list-sidebar.hide {
  display: none;
}

.inner-main {
  padding: 0 20px 0 0;
}

.block-gallery {
  border: 1px solid #efd6d6;
  margin: 0 0 30px;
  padding: 40px 20px 30px 20px;
}
.block-gallery.end {
  padding: 40px 35px 0 30px;
  padding: 40px 35px 10px 30px\9;
  margin: 0;
}
.block-gallery.history {
  margin: 0;
}
.block-gallery .para {
  font-size: 100%;
  line-height: 20px;
  color: #000800;
  padding: 0 0 0 5px;
}
.block-gallery .para.title {
  font-size: 134%;
}
.block-gallery .detail-para {
  margin: 0 0 30px;
}
.block-gallery .detail-para.end {
  margin: 0;
}

.articel-poem {
  padding: 0 20px;
  background: url(../images/gallery02/poem/flower01.png) no-repeat 485px 90px;
}

.inner-poem {
  padding: 35px 0 0;
}

/*/////SALON/////*/
.inner-salon {
  padding: 0 0 40px 20px;
}

.box-salon {
  margin: 10px 0 0;
}
.box-salon .left {
  width: 264px;
  float: left;
  padding: 4px 4px 4px 5px;
  border: 1px solid #efd6d6
}
.box-salon .right {
  width: 265px;
  float: right;
  position: relative;
}

.info-salon {
  text-align: right;
  padding: 10px 5px 0;
}
.info-salon .title {
  font-size: 117%;
  color: #000800;
  padding: 0 0 5px;
}

.para-pace {
  font-size: 171%;
}

.tel-salon {
  font-size: 100%;
  font-weight: bold;
  padding: 0 0 8px;
}

.btn-hp {
  padding: 0 0 5px;
}

.kochira {
  display: block;
  text-decoration: none;
  color: #000800;
  font-size: 117%;
  text-align: left;
  padding: 50px 0 50px 100px;
  background: url(../images/gallery02/poem/flower03.png) no-repeat left center;
}

.parttern01 {
  padding-top: 12px;
  background: url(../images/gallery02/poem/parttern01.png) no-repeat left top;
}

.parttern02 {
  padding-bottom: 12px;
  background: url(../images/gallery02/poem/parttern01.png) no-repeat left bottom;
}

.flower02 {
  width: 52px;
  height: 49px;
  position: absolute;
  right: -20px;
  bottom: -19px;
  background: url(../images/gallery02/poem/flower02.png) no-repeat;
}

/*/////HISTORY/////*/
#History .section {
  margin: 0 0 30px;
}
#History .section.end {
  margin: 0;
}
#History .time {
  font-size: 100%;
  text-align: right;
  color: #000800;
  padding: 0 25px 10px;
}
#History .para {
  padding: 0 0 10px !important;
}
#History .para.note {
  color: #866909;
}
#History .detail {
  padding: 0 15px;
}

.sms-top {
  text-align: center;
  font-size: 117%;
  padding: 20px 0 70px;
  color: #000800;
}

/*/////EXHIBITION/////*/
#Exhibition {
  padding: 40px 15px 10px 15px;
  margin: 0;
}
#Exhibition .para {
  font-size: 117% !important;
  color: #000800;
  padding: 0 0 15px;
}
#Exhibition .para.time-work {
  font-size: 100% !important;
}
#Exhibition .section {
  margin: 0 0 50px;
}
#Exhibition .section.end {
  margin: 0;
}

.inner-exhibition {
  padding: 20px 0 0;
}

.detail-exhi {
  padding: 20px 0 0;
}
.detail-exhi.end {
  padding: 0;
}

.sms-exhi {
  text-align: center;
}

.btn-movie {
  text-align: right;
  margin: 0 0 15px;
}

.box-exhi {
  width: 620px;
  height: 385px;
  margin: 0 auto;
  padding: 95px 0 0;
  position: relative;
  background: url(../images/gallery02/exhibition/bg_slideshow.png) no-repeat;
}
.box-exhi .inner-slide {
  width: 410px;
  margin: 0 auto;
  overflow: hidden;
}
.box-exhi .inner-slide img {
  vertical-align: middle;
}
.box-exhi .bx-controls {
  margin: 40px 0 0;
  text-align: center;
}
.box-exhi .bx-pager {
  display: block;
}
.box-exhi .bx-pager-item {
  width: 23px;
  height: 24px;
  padding: 5px;
  display: inline;
}
.box-exhi .bx-pager-item a {
  display: inline-block;
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  width: 23px;
  height: 24px;
  background: url(../images/gallery02/exhibition/ar_off.png) no-repeat center center;
}
.box-exhi .bx-pager-item a.active {
  background: url(../images/gallery02/exhibition/ar_on.png) no-repeat center center;
}

.info-time {
  padding: 0 15px;
  margin: 0 0 30px;
}
.info-time .left {
  width: 330px;
  float: left;
}
.info-time .right {
  width: 250px;
  float: right;
}
.info-time .ttl-large {
  font-size: 230%;
  color: #000800;
  margin: 35px 0 0;
  line-height: 30px;
  text-align: center;
}
.info-time .font-time {
  font-size: 117%;
  color: #000800;
  margin: 0 0 40px;
  text-align: center;
  font-family: "Times New Roman", Georgia, Serif;
}
.info-time .time-work {
  font-size: 100% !important;
  line-height: 20px;
}

.promo-arte {
  width: 596px;
  margin: 0 auto;
  position: relative;
}
.promo-arte .bg-top {
  padding-top: 30px;
  background: url(../images/gallery02/exhibition/bg_top_promo.png) no-repeat left top;
}
.promo-arte .bg-bottom {
  padding-bottom: 35px;
  background: url(../images/gallery02/exhibition/bg_bottom_promo.png) no-repeat left bottom;
}
.promo-arte .bg-middle {
  background: url(../images/gallery02/exhibition/bg_middle_promo.png) repeat-y;
}

.inner-promo {
  padding: 20px 20px 10px 25px;
}
.inner-promo .title {
  margin: 0 0 15px;
}
.inner-promo .name-project {
  font-size: 100%;
  color: #000800;
}
.inner-promo .name-project .tingle2 {
  font-size: 150%;
}
.inner-promo .name-project .tingle1 {
  font-size: 117%;
}
.inner-promo .link-project {
  font-size: 100%;
  margin: 0 0 20px;
}
.inner-promo .link-project a {
  text-decoration: none;
  color: #f06c0a;
}
.inner-promo .link-project a:hover {
  text-decoration: underline;
}
.inner-promo .para-address {
  margin: 5px 0 0;
}
.inner-promo .para2 {
  font-size: 100%;
  line-height: 20px;
  padding: 0 0 15px;
}
.inner-promo .btn-map {
  display: block;
  width: 146px;
  height: 48px;
  position: absolute;
  right: 15px;
  bottom: 45px;
}

.inner-promo .btn-map2 {
  display: block;
  width: 146px;
  height: 48px;
  position: absolute;
  right: 15px;
  bottom: 45px;
}

.solo-show {
  padding: 0 10px 30px 20px;
}

.collaborate {
  padding: 0 0 0 20px;
  *padding: 0 0 20px 20px;
}
.collaborate .list-solo li {
  margin: 0 35px 20px 0;
}
.collaborate .list-solo li .inner-solo {
  padding: 5px 0px 20px 20px;
}
.collaborate .list-solo li.odd .inner-solo {
  padding: 5px 0px 20px 5px;
  margin: 0 0 20px 0;
}

.list-solo {
  padding: 25px 0 0;
}
.list-solo li {
  float: left;
  width: 285px;
  min-height: 240px;
  margin: 0 32px 20px 0;
  position: relative;
}
.list-solo li .inner-solo {
  position: relative;
  padding: 20px 0px 20px 20px;
  z-index: 3;
}
.list-solo li.odd {
  margin: 0 0 20px 0;
}
.list-solo li.odd .inner-solo {
  padding: 20px 0 20px;
}
.list-solo .photo-solo {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.list-solo .title {
  font-size: 117%;
  margin: 0 0 5px;
  line-height: 20px;
  color: #000800;
}
.list-solo .txt {
  font-size: 100%;
  line-height: 26px;
  color: #000800;
}

.bottom-link {
  padding: 15px 2px;
}
.bottom-link a {
  color: #000800;
  font-size: 100%;
  text-decoration: none !important;
}
.bottom-link a.link-next {
  float: right;
  padding: 0 60px 0 0;
  background: url(../images/gallery02/poem/link_next.png) no-repeat right center;
}
.bottom-link a.link-back {
  float: left;
  padding: 0 0 0 60px;
  background: url(../images/gallery02/poem/link_back.png) no-repeat left center;
}

.hidden {
  display: none;
}

.cl-pink {
  color: #f355bd;
}

.cl-cyan {
  color: #b48a40;
}