.da-slider{
background:#00a2f2;
color:#ffffff;
}
.da-slide{
background:url(sem/sem1.png);
background-repeat: no-repeat;
z-index:1;
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  display:block;
}
.da-slide1{
background-image:url("image6.png");
background-repeat: no-repeat;
z-index:1;
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
   display:block;
}
.da-slide2{
background-image:url("image7.png");
background-repeat: no-repeat;
z-index:1;
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
   display:block;
}
.da-slide3{
background-image:url("image9.png");
background-repeat: no-repeat;
z-index:1;
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
   display:block;
}
.da-slide4{
background-image:url("seo1.png");
background-repeat: no-repeat;
z-index:1;
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
   display:block;
}
.da-slide h2{
font-size:20px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide p{
font-size:16px;
margin-top:30px;
margin-left:550px;
line-height:2em;
overflow:hidden;
color:#fff;
}
.da-slide1 h2{
font-size:20px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide1 p{
font-size:16px;
margin-top:30px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide2 h2{
font-size:20px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide2 p{
font-size:16px;
margin-top:30px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide3 h2{
font-size:20px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide3 p{
font-size:16px;
margin-top:30px;
margin-left:550px;
line-height:1.3em;
overflow:hidden;
color:#fff;
}
.da-slide4 h2{
font-size:20px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
color:#fff;
}
.da-slide4 p{
font-size:16px;
padding-top:10px;
margin-left:550px;
line-height:1.5em;
overflow:hidden;
margin-top:10px;
color:#fff;
height:120px;
}
.da-link{
margin-top:20px;
margin-left:550px;
}
.da-dots{
z-index:1;
}
.da-arrows span.da-arrows-next{
z-index:1;
}  
@media (min-width: 320px) and (max-width: 480px) {
.da-slide {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:250px;
  background-position: 80px 90px;
}
.da-slide1 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:250px;
  background-position: 80px 110px;
}
.da-slide2 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:250px;
  background-position: 80px 100px;
}
.da-slide3 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:250px;
  background-position: 80px 60px;
}
.da-slide4 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:250px;
  background-position: 80px 60px;
}
.da-slide h2{
font-size:12px;
margin-left:0px;
width:70%;
margin-top:0px;
}
.da-slide p{
font-size:12px;
width:55%;
height:auto;
margin-top:-10px;
margin-left:0px;
line-height:2em;
margin-top:60px;
}
.da-slide1 h2{
font-size:12px;
margin-left:0px;
width:70%;
margin-top:0px;
}
.da-slide1 p{
font-size:12px;
width:55%;
height:auto;
margin-top:-10px;
margin-left:0px;
line-height:2em;
margin-top:60px;
}
.da-slide2 h2{
font-size:12px;
margin-left:0px;
width:70%;
margin-top:0px;
}
.da-slide2 p{
font-size:12px;
width:55%;
height:auto;
margin-top:-10px;
margin-left:0px;
line-height:2em;
margin-top:70px;
}
.da-slide2 .da-link{
margin-top:70px;
margin-left:50px;
}
.da-slide3 h2{
font-size:12px;
margin-left:0px;
width:70%;
margin-top:-30px;
}
.da-slide3 p{
font-size:12px;
width:55%;
height:auto;
margin-top:-10px;
margin-left:0px;
line-height:2em;
margin-top:35px;
}
.da-slide4 h2{
font-size:12px;
margin-left:0px;
width:70%;
margin-top:-30px;
}
.da-slide4 p{
font-size:12px;
width:50%;
height:auto;
margin-top:15px;
margin-left:0px;
line-height:2em;
}
.da-slide4 .da-link{
margin-top:80px;
}
.da-link{
margin-left:0px;
margin-top:60px;
}
.da-arrows span.da-arrows-next{
margin-right:150px;
z-index:1;
}
.da-arrows span.da-arrows-prev{
z-index:1;
}
.da-dots{
margin-left:-60px;
}
 }
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .da-slide h2{
font-size:20px;
margin-left:80px;
}
.da-slide p{
font-size:12px;
width:50%;
height:auto;
margin-left:80px;
}    
  .da-slide1 h2{
font-size:12px;
margin-left:80px;
}
.da-slide1 p{
font-size:12px;
width:50%;
height:auto;
margin-left:80px;
}    
  .da-slide2 h2{
font-size:12px;
margin-left:80px;
}
.da-slide2 p{
font-size:12px;
width:50%;
height:auto;
margin-left:80px;
}    
  .da-slide3 h2{
font-size:12px;
margin-left:80px;
}
.da-slide3 p{
font-size:12px;
width:50%;
height:auto;
margin-left:80px;
}  
  .da-slide4 h2{
font-size:12px;
margin-left:80px;
}
.da-slide4 p{
font-size:12px;
width:50%;
height:auto;
margin-left:80px;
}      
.da-link{
margin-left:80px;
margin-top:40px;
}
}
@media only screen and (min-width: 411px) and (max-width: 823px) {
.da-slide h2{
font-size:13px;
margin-left:0px;
width:65%;
}
.da-slide p{
font-size:12px;
width:60%;
height:auto;
margin-top:60px;
margin-left:0px;
line-height:2em;
}
.da-slide .da-link{
margin-top:40px;
}
.da-slide1 h2{
font-size:13px;
margin-left:0px;
width:65%;
}
.da-slide1 p{
font-size:12px;
width:65%;
height:auto;
margin-top:60px;
margin-left:0px;
line-height:2em;
}
.da-slide1 .da-link{
margin-top:70px;
}
.da-slide2 h2{
font-size:13px;
margin-left:0px;
width:65%;
}
.da-slide2 p{
font-size:12px;
width:65%;
height:auto;
margin-top:65px;
margin-left:0px;
line-height:2em;
}
.da-slide2 .da-link{
margin-top:70px;
margin-left:0;
}
.da-slide3 h2{
font-size:13px;
margin-left:0px;
width:65%;
}
.da-slide3 p{
font-size:12px;
width:65%;
height:auto;
margin-top:35px;
margin-left:0px;
line-height:2em;
}
.da-slide4 h2{
font-size:13px;
margin-left:0px;
width:65%;
}
.da-slide4 p{
font-size:12px;
width:65%;
height:auto;
margin-top:20px;
margin-left:0px;
line-height:2em;
}
.da-slide4 .da-link{
margin-top:55px;
}
.da-arrows span.da-arrows-next{
margin-right:115px;
}  
}
@media only screen and (device-width: 768px) {
.da-slide {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:450px;
  background-position: 450px 60px;
}
.da-slide h2{
font-size:20px;
margin-left:0px;
width:65%;
}
.da-slide p{
font-size:18px;
width:55%;
height:auto;
margin-top:20px;
margin-left:0px;
line-height:2em;
}
.da-slide .da-link{
margin-left:0;
}
.da-slide1 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:450px;
  background-position: 450px 120px;
}
.da-slide1 h2{
font-size:20px;
margin-left:0px;
width:65%;

}
.da-slide1 p{
font-size:18px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide1 .da-link{
margin-left:0;
}
.da-slide2 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:450px;
  background-position: 450px 120px;
}
.da-slide2 h2{
font-size:20px;
margin-left:0px;
width:65%;
margin-top:-20px;
}
.da-slide2 p{
font-size:18px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide2 .da-link{
margin-left:0;
}
.da-slide3 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:450px;
  background-position: 450px 120px;
}
.da-slide3 h2{
font-size:20px;
margin-left:0px;
width:65%;
margin-top:-20px;
}
.da-slide3 p{
font-size:18px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide3 .da-link{
margin-left:0px;
margin-top:60px;
}
.da-slide4 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:450px;
  background-position: 450px 60px;
}
.da-slide4 h2{
font-size:20px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide4 p{
font-size:18px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide4 .da-link{
margin-left:230px;
margin-top:80px;
}
.da-arrows span.da-arrows-next{
margin-right:20px;
}  
}
@media screen 
  and (min-device-width: 360px) 
  and (max-device-width: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: landscape) {
.da-slide {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 400px 60px;
}
.da-slide h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide p{
font-size:16px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide .da-link{
margin-left:0px;
}
.da-arrows span.da-arrows-prev{
z-index:1;
}
.da-arrows span.da-arrows-next{
margin-right:10px;
}  
.da-slide1 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 400px 60px;
}
.da-slide1 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide1 p{
font-size:16px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide1 .da-link{
margin-left:0px;
}
.da-slide2 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 400px 60px;
}
.da-slide2 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide2 p{
font-size:16px;
width:55%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide2 .da-link{
margin-left:0px;
}
.da-slide3 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 400px 60px;
}
.da-slide3 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:70%;
}
.da-slide3 p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide3 .da-link{
margin-left:0px;
margin-top:70px;
}
.da-slide4 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 400px 60px;
}
.da-slide4 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:75%;
}
.da-slide4 p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide4 .da-link{
margin-left:0px;
margin-top:70px;
}
}
@media (min-width: 481px) and (max-width: 767px) {
.da-slide p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 450px 60px;
}
.da-slide h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide .da-link{
margin-left:0px;
margin-top:0px;
}
.da-slide1 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 450px 60px;
}
.da-slide1 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide1 p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide1 .da-link{
margin-left:0px;
margin-top:0px;
}
.da-slide2 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 450px 60px;
}
.da-slide2 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide2 p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide2 .da-link{
margin-left:0px;
margin-top:10px;
}
.da-slide3 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 450px 60px;
}
.da-slide3 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide3 p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide3 .da-link{
margin-left:0px;
margin-top:40px;
}
.da-slide4 {
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
 /* background-color: rgba(0,0,0,0.5); /* Black background with opacity */*/
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
  background-size:380px;
  background-position: 450px 60px;
}
.da-slide4 h2{
font-size:18px;
margin-left:0px;
margin-top:-20px;
width:65%;
}
.da-slide4 p{
font-size:16px;
width:65%;
height:auto;
margin-top:-20px;
margin-left:0px;
line-height:2em;
}
.da-slide4 .da-link{
margin-left:0px;
margin-top:50px;
}
.da-arrows span.da-arrows-next{
margin-right:10px;
}  
}