@import (once) "../../css/font.less";
@import (once) "../../css/default.less";

/* caregory_title ///////////////////////*/
.category_title{
background: url(../../image/06.jpg) no-repeat center 50%;
background-size:cover;
}

/* header ///////////////////////*/
.title{
header{
.tal;

h2{
color:@c1;
padding:0 0 20px 0;
}
h4{
color:@c3;
}

}
}

@media (max-width:500px), (max-height:500px){
.title{
header{

h2{
padding:0 0 10px 0;
}

}
}
}



/* business ///////////////////////*/
.business{
padding:10vh 0 20vh 0;

.image{
.right;

img{
margin:-70px 0 0 20px;
width:500px;
}
}
.text{
.db;
padding:50px 0 0 0;
}

}


@media (max-width:800px), (max-height:600px){
.business{
padding:5vh 0;

.image{
.fn;

img:nth-child(1){
.fn;
margin-top:20px;
width:90%;
}
}
.text{
width:auto;
padding:20px 0 0 0;
}

}
}


/* field ///////////////////////*/
.field{
padding:10vh 0;
background:@c2;

dd{
.dib;
.vat;
padding:20px;
width:50%;
}

.wrap{
padding:40px;
background:#FFFFFF;
}

dd{
h4{
font-size:21pt;
padding:0 0 20px 0;
}
p{
padding:10px 0 0 0;
}
}

}

@media (max-width:800px), (max-height:600px){
.field{
padding:5vh 0;

dd{
.db;
padding:5px 0;
width:100%;
}
.wrap{
padding:20px;
}

dd{
h4{
font-size:17pt;
}
}

}
}


/* network ///////////////////////*/
.network{
padding:10vh 0 0 0;

.text{
padding:40px 0 20px 0;
}

.image{
height:600px;
border:1px @c3 solid;
background: url(../image/zu.svg) no-repeat 0 0;
background-size:contain;
}

p{
.right;
padding:20px;
}
i:nth-child(1){
color:@c1;
}
i:nth-child(2){
color:#ed7d31;
}

}



@media (max-width:800px), (max-height:600px){
.network{
padding:5vh 0 0 0;

p{
.fn;
.tar;
padding:10px;
}
.image{
height:280px;
}

}
}


/* profile ///////////////////////*/
.profile{
padding:10vh 0;

table{
margin-top:20px;
width:100%;
border-top:1px #C9C9C9 solid;
}
td{
padding:15px;
border-bottom:1px #C9C9C9 solid;
}
td:first-child{
.tac;
background:@c2;
width:200px;
}

.map{
.db;
.right;
.r(20px);
background:@c1;
color:#FFFFFF;
.ffgm;
letter-spacing:.2em;
padding:5px 80px;
}
}



@media (max-width:500px), (max-height:500px){
.profile{
padding:5vh 0;


td:first-child{
width:90px;
}
.map{
.db;
.fn;
padding:5px 0;
width:100px;
.tac;
}

}
}



/* history ///////////////////////*/
.history{
background: url(../image/05.jpg) no-repeat center 50%;
background-size:cover;
background-attachment: fixed;

header h2,
header h4{
color:#FFFFFF;
}

article{
.pr;
padding:13vh 0;
color:#FFFFFF;
}

em{
.db;
padding:40px 0;
font-size:14pt;
.ffgm;
}

.image{
.pa;
width:240px;
top:7vh;
right:0;

li{
padding:10px 0;
font-size:9pt;
}
}

td{
.nw;
padding:5px;
}

}


@media (max-width:1200px){
.history{

td{
.db;
white-space: normal;
padding:0px;
}
td:nth-child(2){
padding:0 0 10px 50px;
line-height:130%;
}

}
}


@media (max-width:1000px), (max-height:500px){
.history{
background-attachment: scroll;

article{
padding:7vh 0;
}

em{
padding:30px 0;
font-size:11pt;
}

.image{
.ps;
width:100%;
top:10vh;
.fn;
li{
padding:0;
font-size:9pt;
}
}

.pc{
.dn;
}
.tb{
.di;
}

.slider{
li{
padding:0 0 20px 0;
.tac;
}
img{
.center;
max-height:400px;
}
}

}
}

@media (max-width:500px){
.history{

.slider{
img{
max-height:250px;
}
}

}
}


/* gallery ///////////////////////*/
.gallery{
background: url(../../image/06.jpg) no-repeat center 50%;
background-size:cover;
background-attachment: fixed;

article{
.pr;
padding:13vh 0;
color:#FFFFFF;
}

ul{
.dt;
.center;
.tac;
}

li{
.dib;
padding:30px;
width:295px;
height:295px;
}

a{
.db;
width:100%;
height:100%;
.oh;
img{
max-width:none;
width:auto;
height:100%;
margin-left:-30%;
}
}

li:first-child{
a{
img{
max-width:none;
width:auto;
height:100%;
margin-left:-30%;
}
}
}

}


@media (max-width:1000px), (max-height:500px){
.gallery{
background-attachment: scroll;

ul{
padding:20px 0 0 0;
}

li{
.dib;
padding:5px;
width:200px;
height:200px;
}

}
}

@media (max-width:500px), (max-height:500px){
.gallery{


article{
padding:7vh 0;
}

li{
.dib;
width:150px;
height:150px;
}

}
}