@font-face {
  font-family: 'DIN Medium Regular';
  src: url(/items/font/ufonts.com_din-medium.ttf) format('truetype');
}
.din {
  font-family: 'DIN Medium Regular';
}
/***
 * Max-Width: 1100
*/
#header_container {
  border-top: 10px solid white;
}
#header {
  display: table;
  width: 100%;
  max-width: 1100px;
  margin-top: 19px;
  margin-left: auto;
  margin-right: auto;
}
/** Main Logo **/
#header > h1 {
  display: table-cell;
  vertical-align:middle;
  width: 27.9%;
  text-align:center;
}
#header > h1 a img {
  height: 65px;
}
/****** Global Navigations *******/
#gnavi {
  display: table-cell;
  vertical-align:middle;
}
#gnavi > ul {
  display: table;
/*  width: 76.6%; */
  width: 470px;
  margin-left: auto;
  border-left: 1px solid #dcdcdc;
}
#gnavi > ul li {
  display: table-cell;
  height: 50px;
  border-right: 1px solid #dcdcdc;
}
#gnavi > ul li a {
  display: table;
  width: 100%;
}
#gnavi > ul li a span {
  display: table-cell;
  vertical-align:middle;
  text-align:center;
}
#gnavi > ul li a span img {
  height: 42px;
}

/****** Header Contact *****/
#header_contacts {
  width: 16.2%;/*178px;*/
  display: table-cell;
  vertical-align:middle;
}
#header_contacts dt {
  width: 78.1%;/*139px;*/
  margin-left: 9%;
}
#header_contacts dt a {
  display: block;
  line-height:1;
  margin-bottom: 6px;
  font-size: 17px;
  color: black;
  text-decoration:none;
  background-image:url(../images/tel_icon.png);
  background-size: auto 14px;
  background-repeat:no-repeat;
  background-position:left center;
  padding-left: 18px;
  letter-spacing: 0.05em;
}

#header_contacts dt img {
  width: 100%;
}
#header_contacts dd {
  width: 78.1%;/*139px;*/
  margin-left: 9%;
}

#header_contacts dd a {
  display: table;
  background-color: black;
  width: 100%;
  line-height:0;
}
#header_contacts dd a span {
  display: table-cell;
  vertical-align:middle;
  text-align:center;
  height: 30px;
}
#header_contacts dd a span img {
  width: 78px;
}



/****************: Works Events ************************/
#c_news_event {
  width: 100%;
  margin: 0 auto;
  padding-top: 35px;
  border-top: 1px solid #dcdcdc;
}
#c_news_event .container {
  width: 100%;
  max-width: 1023px;
  margin: 0 auto;
}
#c_news_container {
  border-bottom : 1px solid #dcdcdc;
  padding-bottom: 26px;
  margin-bottom: 30px;
}
#c_event_container {
  border-bottom : 1px solid #dcdcdc;
  padding-bottom: 24px;
}
#c_news_event dl dt {
  padding-bottom: 29px;
}
#c_news_event dl dt > img {
  height: 16px;
  margin-right: 20px;
}
#c_news_event dl dt a img {
  height: 15px;
  -webkit-transition: opacity .3s;
  -moz-transition: opacity .3s;
  -o-transition: opacity .3s;
  -ms-transition: opacity .3s;
  transition: opacity .3s;
}
#c_news_event dl dt a:hover img {
  opacity: 0.7;
}

#c_news_event dl dd .fold_left {
  position: absolute;
  margin-left: -25px;
  margin-top: 55px;
}
#c_news_event dl dd .fold_right {
  position:absolute;
  margin-left: 1034px;
  margin-top: 55px;
}
#c_news_event dl dd .fold_left a,
#c_news_event dl dd .fold_right a {
  text-decoration:none;
}

#c_news_event dl dd div.news_event_items{
  height: 177px;
  width: 100%;
  overflow:hidden;
}
#c_news_event dl dd div.news_event_items ul:after {
  content: "";
  display: block;
  clear: both;
}
#c_news_event dl dd div.news_event_items li {
  width: 266px;
  float: left;
}
#c_news_event dl dd div.news_event_items li a {
  display: block;
  background-position:center center;
  background-size: cover;
  background-repeat:no-repeat;
  padding-top: 130px;
  text-decoration:none;
  width: 226px;
  color: black;
}
#c_news_event dl dd div.news_event_items li a cite {
  padding-top: 15px;
  height: 32px;
  background-color: white;
  display: block;
  color: black;
  font-size: 0.85em;
  line-height:1.4em;
  -webkit-transition: background .3s;
  -moz-transition: background .3s;
  -o-transition: background .3s;
  -ms-transition: background .3s;
  transition: background .3s;
}
#c_news_event dl dd div.news_event_items li a:hover cite {
  background-color: #eee;
}

/************ JOINUS Contact *****************/
#footer_contacts {
  width: 600px;
  margin: 0 auto;
  display: table;
}
#footer_contacts > h2 {
  display: table-cell;
  height: 146px;
  vertical-align:middle;
  line-height:0;
}
#footer_contacts > h2 img {
  width: 93px;
}
#footer_contacts #footer_contact_arrow {
  display: table-cell;
  vertical-align:middle;
  text-align: center;
  width: 77px;
  line-height:0;
}
#footer_contacts #footer_contact_arrow img {
  width: 41px;
}
#footer_contacts #footer_contact_tel {
  display: table-cell;
  vertical-align:middle;
}
#footer_contacts #footer_contact_tel a {
  background-image:url(../images/footer_tel_icon.png);
  background-position:left center;
  background-repeat:no-repeat;
  background-size: auto 22px;
  line-height: 22px;
  color: black;
  font-size: 25px;
  text-decoration:none;
  padding-left: 31px;
}
#footer_contacts #footer_contact_mail {
  display: table-cell;
  vertical-align:middle;
}
#footer_contacts #footer_contact_mail a{
  display: table;
  width: 190px;
  line-height:0;
  margin-left: auto;
}
#footer_contacts #footer_contact_mail a span {
  display: table-cell;
  vertical-align:middle;
  background-color: black;
  text-align:center;
  height: 30px;
}
#footer_contacts #footer_contact_mail a span img {
  width: 125px;
}

/******************* Footer **************************/
#footer {
  background-color: black;
  padding-top: 45px;
}
#footer > div {
  width: 100%;
  max-width: 1023px;
  margin: 0 auto;
  display: table;
}
/** Logo **/
#footer > div > h2 {
  display: table-cell;
  vertical-align: top;
  width: 30%;
}
#footer > div > h2 img {
  height: 51px;
}
#footer > div > nav {
  display: table-cell;
  vertical-align: top;
  width: 70%;
}
#footer > div > nav > div {
  width: 100%;
  display: table;
  margin-left: auto;
}
#footer > div > nav > div dl {
  display: table-cell;
  vertical-align:top;
  width: 25%;
  border-left: 1px solid #646464;
}
#footer > div > nav > div dl dt,
#footer > div > nav > div dl dd {
  padding-left: 21px;
  line-height:1;
}
#footer > div > nav > div dl dt a,
#footer > div > nav > div dl dd a {
  display: inline-block;
  margin-bottom: 10px;
  color: white;
  text-decoration:none;
  font-size: 0.95em;
}
#footer > div > nav > div dl dt a {
  font-weight:bold;
}

#footer > address {
  text-align:center;
  color: #969696;
  padding-top: 47px;
  padding-bottom: 12px;
  font-size: 0.8em;
}
/***** Content Common ********/
h2.black_h2 {
  font-size: 20px;
  color: white;
  background-color: black;
  text-align:center;
  padding: 34px 0;
}
h2.black_h2 span {
  display: inline-block;
}
.container {
  width: 100%;
  max-width: 1023px;
  margin: 40px auto;
}

/***** Pager *****/
.pager {
  text-align: center;
  padding-bottom: 45px;
}
.pager a,
.pager span {
  display: inline-block;
  padding: 4px 8px;
  border-radius:6px;
  text-decoration:none;
}
.pager a {
  border: 1px solid #0B0B0B;
  background-color: #0B0B0B;
  color: white;
}
.pager a:hover {
  background-color: #646464;
}
.pager span {
  border: 1px solid #0B0B0B;
}
/**********************************************************

                        Media Query

***********************************************************/
@media only screen and (max-width: 1100px) {
#c_news_event .container {
  width: 93%;
}
#c_news_event dl dd .fold_left {
  margin-left: 0;
  left: 1%;
}

#c_news_event dl dd .fold_right {
  margin-left: 0;
  right: 1%;
}
.container {
  width: 93%;
}
}
@media only screen and (max-width: 890px) {
#gnavi > ul {
  width: 90%;
}

#footer > div > h2 {
  display: table-header-group;
  width: 100%;
}
#footer > div > h2 a {
  display: inline-block;
  margin-left: 3%;
  margin-bottom: 30px;
}

#footer > div > nav {
  display: table-footer-group;
  width: 100%;
}

}
@media only screen and (max-width: 768px) {

#gnavi {
  display: table-footer-group;
}
#header {
  width: 93%;
}

#header h1{
  display:table-row;
  float: left;
  width: 226px;
}
#header_contacts {
  display:table-row;
  float: right;
  margin-top: -57px;
  width: 140px;
}
#header_contacts dt,
#header_contacts dd {
  width: 100%;
  margin-left:0;
}
#gnavi > ul {
  width: 100%;
  margin-left: auto;
  margin-top: 25px;
}
}
@media only screen and (max-width: 667px) {
#footer_contacts {
  width: 82%;
  display: block;
  margin-top: 40px;
  margin-bottom: 40px;
}
#footer_contacts:after {
  content: "";
  display: block;
  clear: both;
}

#footer_contacts > h2 {
  width: 100%;
  display: block;
  text-align:center;
  height: auto;
  margin-bottom: 20px;
}
#footer_contacts #footer_contact_arrow {
  display: none;
}
#footer_contacts #footer_contact_tel {
  width: 50%;
  float: left;
  text-align:center;
  display: table;
}
#footer_contacts #footer_contact_tel a {
/*  display: table-cell; */
  height: 30px;
  vertical-align:middle;
  text-align:center;
}
#footer_contacts #footer_contact_mail {
  width: 50%;
  float: left;
  display: block;
}
#footer_contacts #footer_contact_mail a {
  width: 100%;
  max-width: 190px;
  margin-right: auto;
}
#footer > div > nav > div {
  display: block;
  width: 93%;
  margin-left: auto;
  margin-right: auto;
}
#footer > div > nav > div:after {
  content: "";
  display: block;
  clear: both;
}

#footer > div > nav > div dl {
  width: 50%;
  display: block;
  border-left: none;
  float: left;
  padding-bottom: 12px;
}
#footer > div > nav > div dl dt, #footer > div > nav > div dl dd {
  padding-left: 0;
}

}
@media only screen and (max-width: 568px) {
#footer_contacts #footer_contact_tel,
#footer_contacts #footer_contact_mail {
  width: 222px;
  float: none;
  display: block;
  margin: 0 auto;
}
#footer_contacts #footer_contact_tel a {
  display: block;
}
#footer_contacts #footer_contact_mail a {
  max-width:none;
}
}
@media only screen and (max-width: 414px) {
#header_contacts {
  display: none;
}
#gnavi > ul {
  display: block;
  border-right: 1px solid #dcdcdc;
}
#gnavi > ul:after {
  content: "";
  display: block;
  clear: both;
}
#gnavi > ul li {
  display: block;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
#gnavi_about,
#gnav_reasons{
  width: 25%;
}
#gnavi > ul li#gnav_reasons {
  float: right;
  border-right: none;
}
#gnavi_onsale {
  width: 50%;
}
#gnavi_works,
#gnavi_event {
  width: 50%;
  margin-top: 5px;
}
#gnavi > ul li#gnavi_event {
  border-right: none;
}
}