@charset "utf-8";

#container{
  padding:100px 0 100px;
}
#container .section_tit{
  margin-bottom:100px;
}
header{
  background-color: rgba(0,0,0,.8);
}

/* page - about */
.list{
  margin:50px 0 0;
}
.form_cover{
  width:98%;
  max-width:800px;
  margin:0 auto;
}

.page_about .list .item{
  display:flex;
  justify-content: space-between;
  margin-bottom:30px;
}
.page_about .list .img{
  padding-bottom:400px;
  position:relative;
  height:0;
  flex-grow: 1;
}
.page_about .list img{
  position:absolute;
  top:0;
  left:0;
  object-fit: cover;
  width:100%;
  height:100%;
}
.page_about .list .txt{
  flex-shrink: 0;
  width:calc(400px - 10px);
  margin-left:10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding:0 30px;
  color:#fff;
}
.page_about .list .item:nth-child(even) .txt{
  margin-left:0;
  margin-right:10px;
}
.page_about .list h3{
  font-size:30px;
}
.page_about .list .txt p{
  margin-top:20px;
}

/* page - work */
.page_work .category{
  margin:0 auto;
  width:60%;
  text-align: center;
}
.page_work .category li{
  cursor:pointer;
  display:inline-block;
  margin:0 5px 10px;
  border:1px solid #ddd;
  border-radius: 20px;
  padding:5px 20px;
  color:#888;
}
.page_work .category li.active{
 /* background:linear-gradient(129deg, #1d4ec3 38%, #5e3296 100%);*/
 background:linear-gradient(129deg, #666ab6 38%, #4e54c8 100%);
  color:#fff;
  border:none;
}
.page_work .no_data{
  text-align: center;
  display:none;
}
.page_work .no_data p{
  padding-top:100px;
  background: url("../images/icon_novid.png") no-repeat top center /auto 80px;
}
/* page - contact */
.page_contact table{
    width:100%;
}
.page_contact .input_tbl + .input_tbl{
    margin-top:80px;
}
.page_contact .input_tbl caption{
    text-align: left;
    font-size:30px;
    font-weight:800;
    margin-bottom:10px;
    color:#333;
}
.page_contact .input_tbl th,
.page_contact .input_tbl td{
    width:100%;
    display:block;
    text-align: left;
}
.page_contact .input_tbl th{
    font-weight:400;
    margin:30px 0 5px;
}
.page_contact .input_tbl td input[type='text'],
.page_contact .input_tbl textarea{
    width:100%;
    height:40px;
    border:1px solid #ccc;
    border-radius: 3px;
    padding:0 10px;
}
.page_contact .input_tbl td input + input{
    margin-top:10px;
}
.page_contact .input_tbl textarea{
    height:300px;
    padding:10px;
}
.page_contact .btn_box{
  margin-top:20px;
  text-align: center;
}
.page_contact .btn_box input{
  width:100%;
  padding:15px 0;
  border-radius:10px;
  border:none;
  font-weight: 600;
  font-size:20px;
}
.page_contact .range_box .range_price{
  display:flex;
  align-items: center;
  justify-content:space-between;
  margin-bottom:10px;
}
.page_contact .range_box input[type="range"]{
  width:100%;
  height:10px;
  accent-color: #1d4ec3;
}
.page_contact .range_box #budget{
  color:#5e3296;
  font-weight:500;
  font-size:16px;
  border:none;
  background-color: transparent;
  width:auto;
  height:auto;
  padding:5px 0 0;
  cursor:default;
}
.page_contact .range_box #budget:focus{
  outline:none;
}

.page_contact .input_tbl td .datepicker[type="text"]{
  width:47%;
  padding:0 10px 0 35px;
  background:url(../images/calendar_icon.png) no-repeat left center /contain; 
}
.page_contact .input_tbl td .datepicker[name="dateStart"] + span{
  display:inline-block;
  width:calc(6% - 9px);
  text-align:center;
}