/*header css*/
.header {background: url(../images/service.jpg) center no-repeat;height: 350px;}

.content-wrap {/* width: 1920px; margin: 0 auto; display: table-cell; vertical-align: middle;  margin: 120px 0 100px 0;*/text-align: center;}

.content-wrap h2 { text-align: center; font-size: 80px; color: #fff; margin-bottom: 0;}

.content-wrap p { width: 90%; margin: 0 auto; }

.content-wrap .desc-1 { font-size: 22px; color: #fff; }

@media (max-width: 1200px) { 
    .content-wrap p { width: 90%; margin: 0 auto; }
     }
  
@media (max-width: 960px) { 
    .header{height:200px;}
	.content-wrap h2 { font-size: 38px; color: #f2f2f2; }
    .content-wrap p { width: 70%; margin: 0 auto; }
    .content-wrap .desc-1 { font-size: 20px; color: #f2f2f2; line-height: 1.5em;} }

@media (max-width: 767px) { 
  .content-wrap h2 { font-size: 32px; color: #f2f2f2; }
  .content-wrap p { width: 80%; margin: 0 auto; }
  .content-wrap .desc-1 { font-size: 16px; color: #f2f2f2; }
 }

/*header end*/

.graybg { padding: 60px 0 30px 0; }

@media (max-width: 767px) { .graybg { padding: 30px 0; } }

.card-box { border: 1px solid #55aa66; background: #fff; transition: all .3s; position: relative; margin-bottom: 30px; padding: 2em; }

.card-box:hover { border: 1px solid #fff; box-shadow: 5px 4px 5px 0px #b7b7b7; }

.card-box:hover .card-head h3 { color: #55aa66; }

@media (max-width: 767px) { .card-box { padding: 2em; } }

.card-box .link { display: block; position: absolute; width: 100%; height: auto; top: 0; left: 0; right: 0; bottom: 0; background: #000; opacity: 0; filter: alpha(opacity=0); cursor: pointer; }

.card-head { position: absolute; margin-right: 2em; }

.card-head .card-title { margin-bottom: 2em; }

.card-head .card-img, .card-head h3 { text-align: center; }

.card-head h3 { text-align: center; font-size: 22px; font-weight: bold; transition: color .2s; }

.card-head .longname { text-align: left; }

@media (max-width: 767px) { .card-head { position: relative; margin: 0; }
  .card-head .longname { text-align: center; } }

.card-inner { line-height: 1.8em; margin: 5em 3em 2em 10em; border-left: 1px dotted #c1c1c1; padding-left: 2em; }

.shortname { margin: 3em 3em 2em 10em; }

@media (max-width: 767px) { .card-inner { margin: 0; padding: 0; border: none; } }