/*

.dg-title -> title-style%s { Title Style } ""(不写这个class则是默认样式) / 01 / 02 / 03 / 04 / 05 / 06 / 07 / 08 / 09 / 10 / 11 / 12 / 13
if( title-style12 )
	.dg-title -> %s { Line length } ultrashort / Length / short / long
	.dg-title -> %s { Line Thin } thin1 / thin2 / thin3
end

.dg-title -> subtitle-style%s { Subtitle Style }  01 / 02 / 03 / 04
if ( subtitle-style04 )
	.dg-title -> %s { Sub-Title Line Thin } thin1 / thin2 / thin3
end

.icon -> %s { Icon Size } size-xs / size-sm / medium / size-lg / size-xl

*/




/*text slide*/
.text-slide{
	display:inline-block;
	position:relative;
	overflow:hidden;
	vertical-align: bottom;
}
.text-slide span {
	display:none;
	position:absolute;
	left:0;
	top:0;
  opacity: 0;
}
@-webkit-keyframes slide-text {
	0% {
	opacity:0;
	-webkit-transform:translateY(100%);
	}
	100% {
	opacity:1;
	-webkit-transform:translateY(0%);
	}
}
@-o-keyframes slide-text {
	0% {
	opacity:0;
	-o-transform:translateY(100%);
	}
	100% {
	opacity:1;
	-o-transform:translateY(0%);
	}
}
@keyframes slide-text {
	0% {
	opacity:0;
	transform:translateY(100%);
	}
	100% {
	opacity:1;
	transform:translateY(0%);
	}
}
@-webkit-keyframes slide-text-previous {
	0% {
	opacity:1;
	-webkit-transform:translateY(0%);
	}
	100% {
	opacity:0;
	-webkit-transform:translateY(-100%);
	}
}
@-o-keyframes slide-text-previous {
	0% {
	opacity:1;
	-o-transform:translateY(0%);
	}
	100% {
	opacity:0;
	-o-transform:translateY(-100%);
	}
}
@keyframes slide-text-previous {
	0% {
	opacity:1;
	transform:translateY(0%);
	}
	100% {
	opacity:0;
	transform:translateY(-100%);
	}
}
.text-slide span.active{
	display:inline-block;
	position:static;
 -webkit-animation-name: slide-text;
  -o-animation-name: slide-text;
  animation-name: slide-text;
  -webkit-animation-duration: 400ms;
  -o-animation-duration: 400ms;
  animation-duration: 400ms;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
	white-space:nowrap;

  opacity: 1;
}
.text-slide span.previous{
	display:inline-block;
  -webkit-animation-name: slide-text-previous;
  -o-animation-name: slide-text-previous;
  animation-name: slide-text-previous;
  -webkit-animation-duration: 400ms;
  -o-animation-duration:400ms;
  animation-duration:400ms;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
	white-space:nowrap;
  opacity: 0;
}

@-webkit-keyframes blink {
	0% {
		visibility:hidden;
		opacity:0;
	}
	50% {
		visibility:visible;
		opacity:1;
	}
	100% {
		visibility:hidden;
		opacity:0;
	}
}
@-moz-keyframes blink {
	0% {
		visibility:hidden;
		opacity:0;
	}
	50% {
		visibility:visible;
		opacity:1;
	}
	100% {
		visibility:hidden;
		opacity:0;
	}
}
@-o-keyframes blink {
	0% {
		visibility:hidden;
		opacity:0;
	}
	50% {
		visibility:visible;
		opacity:1;
	}
	100% {
		visibility:hidden;
		opacity:0;
	}
}
@keyframes blink {
	0% {
		opacity:0;
	}
	50% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}
.dg-typewriter.animation{
  display: none;
  position: relative;
}
.dg-typewriter.animated{
  display:inline-block;
}
.dg-typewriter.animated:after{
	content:"|";
	display:inline-block;
 visibility: hidden;
  opacity: 0;
  width: 12px;
  margin-right: -12px;
  text-align: center;
}

.dg-typewriter.active:after{
    -webkit-animation: blink 650ms infinite;
    -moz-animation: blink 650ms infinite;
    animation: blink 650ms infinite;
  font-weight: normal;
  visibility:visible;
  opacity: 1;
}
.color-white .dg-typewriter.animated:after{
	color:#ffffff;
}
.dg-title{
  overflow: hidden;
}

.dg-title .italic{
  font-style: italic;
}
.dg-title .oblique{
  font-style: oblique;
}

.dg-title {
  margin-bottom: 25px;
}
.dg-title .title{
  margin: 0px 0 15px;
}


.dg-title .subtitle{
  display: inline-block;
  margin-bottom: 10px;
  font-size: 14px;
  color: #666666;
  font-weight: normal;
  line-height: 1.2;
}
.dg-title:after{
  content: "";
  display: block;
  overflow: hidden;
  height: 0;
  clear: both;
}

.dg-title.subtitle-style02 small{
	position:relative;
	display:inline-block;
	padding:0px 20px;
	margin-bottom:16px;
	color:#666666;
}
.dg-title.subtitle-style02 small:after,
.dg-title.subtitle-style02 small:before{
	content:"";
	width:80px;
	border-bottom:1px solid ;
	position:absolute;
	left:100%;
	top:50%;
  opacity: 0.9;
}
.dg-title.subtitle-style02 small:before{
	left:auto;
	right:100%;
}
.dg-title.subtitle-style02.text-left small{
  padding-left: 0;
}
.dg-title.subtitle-style02.text-right small{
  padding-right: 0;
}

.dg-title.subtitle-style02.text-left small:before,
.dg-title.subtitle-style02.text-right small:after{
  content: none;
}
.dg-title.subtitle-style03 small{
	display:inline-block;
	margin-bottom:14px;
	letter-spacing:0.070em;
	color:#666666;
}
.dg-title.subtitle-style03 small:before,
.dg-title.subtitle-style03 small:after{
	content:"";
	width:4px;
	display:inline-block;
	height:19px;
	border-top:1px solid ;
	border-bottom:1px solid ;
	vertical-align:middle;
	opacity: 0.9;
	border-color:#20a3f0;
	color:#20a3f0;
}
.dg-title.subtitle-style03 small:before{
	margin:0 25px 2px 0;
	border-left:1px solid ;
}
.dg-title.subtitle-style03 small:after{
	margin:0 0 2px 25px;
	border-right:1px solid ;
}
.dg-title.subtitle-style04 .subtitle{
  line-height: 1.8;
  letter-spacing:inherit;
}
.dg-title.subtitle-style04 .subtitle:after {
    content: "";
    display: block;
    width: 50px;
		border-bottom: 3px solid #20a3f0;
		/* border-bottom-color:#20a3f0 ; */
		border-bottom-style:solid;
		border-bottom-width:3px;
    margin:15px auto 10px;
}
.dg-title.subtitle-style04.thin3 .subtitle:after{
    border-bottom-width:3px;
}
.dg-title.subtitle-style04.thin2 .subtitle:after{
    border-bottom-width:2px;
}
.dg-title.subtitle-style04.thin1 .subtitle:after{
    border-bottom-width:1px;
}
.dg-title.subtitle-style04.text-left .subtitle:after{
  margin-left: 0;
}
.dg-title.subtitle-style04.text-right .subtitle:after{
  margin-right: 0;
}
.dg-title.subtitle-style04 .decorated.r + .subtitle{
  margin-top: -4px;
}


.dg-title .left-icon{
  margin-right: 0.4em;
  font-size: 1.1em;
}
.dg-title .right-icon{
  margin-left: 0.4em;  
  font-size: 1.1em;
}

.dg-title .top-icon,
.dg-title .bottom-icon{
  margin: 0 auto 12px;
  font-size: 20px;
}
.dg-title .title span {
  color:#20a3f0;
}


.dg-title .title-icon01{

}
.dg-title .title-icon02 .line{
  position: relative;
  display: inline-block;
  line-height: 1;
}
.dg-title .title-icon02 .line:before {
	content: "";
	width: 36px;
	height: 1px;
	border-bottom:1px solid;
	position: absolute;
	top: 50%;
  left: 100%;
	margin-top:-1px;
}
.dg-title .title-icon02 .line:after {
	content: "";
	width: 36px;
	height: 1px;
	border-bottom:1px solid;
	position: absolute;
	top: 50%;
  right: 100%;
	margin-top:-1px;
}

.dg-title .icon .line .icon-svg *{
  stroke-width: 3;
}
.dg-title .icon.size-xs .line{
  font-size: 20px;
  padding: 0px 6px;
}
.dg-title .icon.size-xs .line .icon-svg{
  width: 20px;
  height: 20px;
}
.dg-title .icon.size-sm .line{
  font-size: 26px;
  padding: 0px 8px;
}
.dg-title .icon.size-sm .line .icon-svg{
  width: 26px;
  height: 26px;
}
.dg-title .icon.medium .line{
  font-size: 32px;
  padding: 0px 10px;
}
.dg-title .icon.medium .line .icon-svg{
  width: 32px;
  height: 32px;
}
.dg-title .icon.size-lg .line{
  font-size: 37px;
  padding: 0px 12px;
}
.dg-title .icon.size-lg .line .icon-svg{
  width: 37px;
  height: 37px;
}
.dg-title .icon.size-xl .line{
  font-size: 42px;
  padding: 0px 14px;
}
.dg-title .icon.size-xl .line .icon-svg{
  width: 42px;
  height: 42px;
}


.dg-title .title-icon02.icon .line:before,
.dg-title .title-icon02.icon .line:after {
  width: 28px;
}

.dg-title.text-left .icon .line:after{
  content:none;
}
.dg-title.text-right .icon .line:before {
  content:none;
}
.dg-title.text-left .icon .line{
  padding-left: 0;
}
.dg-title.text-right .icon .line {
  padding-right: 0;
}

.dg-title.title-style01 .decorated.r{
  position: relative;
  height: 21px;
  display: block;
  width: 52px;
  margin:20px auto 17px;
}

.dg-title.title-style01 .decorated.r:after,
.dg-title.title-style01 .decorated.r:before{
	content:"";
  position: absolute;

}
.dg-title.title-style01 .decorated.r:after{
	border-top:1px solid ;
	border-bottom:1px solid ;
  top: 0;
  bottom: 0;
  left:7px;
  right: 7px;
}
.dg-title.title-style01 .decorated.r:before{
	border-bottom:1px solid ;
  left: 0;
  right: 0;
  top: 50%;
  margin-top: -1px;
}



.dg-title.title-style02 .decorated.l{
	margin:auto;
	width:80px;
	overflow:hidden;
  display: block;
	margin-bottom:21px;
}
.dg-title.title-style02 .decorated.l:before{
  content:"123";
  content:".\2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002 \2002.";  
	display:inline-block;
  text-decoration: line-through;
  -moz-text-decoration-style: wavy;
  text-decoration-style: wavy; 
	font-size:13px;
	line-height:1;
	white-space:nowrap;
	text-indent:-8px;
	width:80px;
	overflow:hidden;
  vertical-align: middle;
}


.dg-title.title-style03 .decorated.r{
	display:block;
	margin:15px auto 15px;
	-webkit-transform:scale(1.3,0.95);
	transform:scale(1.3,0.95);
	width:34px;
  height: 41px;
  position:relative;
}
.dg-title.title-style03 .decorated.r:after,
.dg-title.title-style03 .decorated.r:before{
	content:"";
	position:absolute;
	width:19px;
	height:19px;
	top:4px;
	left:0px;
	border:1px solid ;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg) ;
	margin:0 8px;
}
.dg-title.title-style03 .decorated.r:before{
	margin-top:13px;
}

.dg-title.title-style04 .decorated.r{
	display:block;
	margin:23px auto 12px;
  width: 110px;
  height: 2px;
}
.dg-title.title-style04 .decorated.r:after{
	content:"";
	height:100%;
  width: 100%;
	font-size:36px;
  display: block;
	background-image: linear-gradient(to right, #4db5fd 0%, #52d4d2 60%);
	background-image: -webkit-linear-gradient(to right, #4db5fd 0%, #52d4d2 60%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4db5fd', endColorstr='#52d4d2', GradientType=1 );
}


.dg-title.title-style05 .title{
  display: inline-block;
  position: relative;
  padding: 0.4em 1.2em;
}
.dg-title.title-style05 .decorated{
  display: block;
}

.dg-title.title-style05 .title:after,
.dg-title.title-style05 .title:before,
.dg-title.title-style05 .title .line:after,
.dg-title.title-style05 .title .line:before{
	content:"";
	position:absolute;
	border-width:1px;
	width:15px;
	height:15px;
}
.dg-title.title-style05 .title:after{
	left:0;
	top:0;
	border-left-style:solid;
	border-top-style:solid;
}
.dg-title.title-style05 .title:before{
	right:0;
	top:0;
	border-right-style:solid;
	border-top-style:solid;
}
.dg-title.title-style05 .title .line:after{
	left:0;
	bottom:0;
	border-left-style:solid;
	border-bottom-style:solid;
}
.dg-title.title-style05 .title .line:before{
	right:0;
	bottom:0;
	border-right-style:solid;
	border-bottom-style:solid;
}


.dg-title.title-style06 .decorated{
  display: block;
}
.dg-title.title-style06 .title{
  position:relative;
	display:inline-block;
 	padding:0 0.8em;
}
.dg-title.title-style06 .title:after,
.dg-title.title-style06 .title:before{
	content:"";
	border-bottom:1px solid ;
	width:2em;
  position:absolute;
  margin-top: -1px;
	top:50%;
	left:100%;
}
.dg-title.title-style06 .title:before{
	left:auto;
	right:100%;
}
.dg-title.title-style06.text-left .title:before,
.dg-title.title-style06.text-right .title:after{
   content: none
}
@media only screen and (max-width: 767px) {
	.dg-title.title-style06 .title:after,
	.dg-title.title-style06 .title:before{
		width:0;
	}
	.dg-title.title-style06 .title{
		 padding:0;
	}
}


.dg-title.title-style07 .title{
	position: relative;
	display: inline-block;
 	padding:0;
}
.dg-title.title-style07 .decorated{
  display: block;
}

.dg-title.title-style07 .title .line:before{
	 content: "";
	 position:absolute;
	 right:-23px;
	 border-left:1px solid ;
	 height: 21px;
	 top:50%;
	 margin: -11px 0 0 0;
}
.dg-title.title-style07 .title .line:after{
	 content: "";
	 position:absolute;
	 right:-28px;
	 border-left:1px solid ;
	 height: 15px;
	 top:50%;
	 margin: -9px 0 0 0;
}
.dg-title.title-style07 .title:before{
	 content: "";
	 position:absolute;
	 left:-23px;
	 border-left:1px solid ;
	 height: 21px;
	 top:50%;
	 margin: -11px 0 0 0;
}
.dg-title.title-style07 .title:after{
	 content: "";
	 position:absolute;
	 left:-28px;
	 border-left:1px solid ;
	 height: 15px;
	 top:50%;
	 margin: -9px 0 0 0;
}



.dg-title.title-style08 .title{
	position: relative;
	display: inline-block;
  padding: 0.4em 1.2em;
  margin-top: 4px;
  margin-left: 4px;
  margin-right: 4px;
}
.dg-title.title-style08 .decorated{
  display: block;
}


.dg-title.title-style08 .title:after,
.dg-title.title-style08 .title:before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:42px;
	height:22px;
}
.dg-title.title-style08 .title:after{
	top:-4px;
	border-left:1px solid ;
}
.dg-title.title-style08 .title:before{
	left:-5px;
	border-top:1px solid ;
}
.dg-title.title-style08 .title > .line:after,
.dg-title.title-style08 .title > .line:before{
	content:"";
	position:absolute;
	bottom:0;
	right:0;
	width:42px;
	height:22px;
}
.dg-title.title-style08 .title > .line:after{
	bottom:-4px;
	border-right:1px solid ;
}
.dg-title.title-style08 .title > .line:before{
	right:-5px;
	border-bottom:1px solid ;
}

.dg-title.title-style09{
  
}

.dg-title.title-style09 .decorated.r{
	position:relative;
	border-bottom:1px solid ;
	width:150px;
	display:block;
  margin:25px auto 14px;
}
.dg-title.title-style09 .decorated.r:after,
.dg-title.title-style09 .decorated.r:before{
	content:"";
	width:9px;
	height:9px;
	border:1px solid ;
	border-radius:50%;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	position:absolute;
	bottom:-5px;
	left:-9px;
}
.dg-title.title-style09 .decorated.r:before{
	right:-9px;
	left:auto;
}
.dg-title.title-style09.text-left .decorated.r:after{
  content: none;
}
.dg-title.title-style09.text-right .decorated.r:before{
  content: none;
}


.dg-title.title-style10 .decorated.r{
  position: relative; 
  width:46px;
  margin: auto;
  display: block;
  line-height: 0;
	border-top:1px solid ;
  padding-top: 5px;
  margin-bottom: 10px;
}
.dg-title.title-style10 .decorated.r:after{
	content:"";
	border-bottom:1px solid ;
	width:37px;
  display: inline-block;
  vertical-align: middle;
}

.dg-title.title-style11 .decorated.l{
  display: block;
  width: 56px;
  height: 22px;
 	border-right:1px solid ;
 	border-left:1px solid ;
  position: relative;
  margin: 2px auto 15px;
}
.dg-title.title-style11 .decorated.l:after,
.dg-title.title-style11 .decorated.l:before{
	content:"";
	position:absolute;
	width:42px;
	border-top:1px solid ;
}
.dg-title.title-style11 .decorated.l:after{
  top:4px;
  left: -5px;
}
.dg-title.title-style11 .decorated.l:before{
  bottom:4px;
  right: -5px;
}

.dg-title.title-style12 .decorated.r{
	width:100px;
	/* border-bottom:1px solid ; */
	border-bottom-width: 1px;
	border-bottom-style: solid;
	display:block;
	margin:18px auto 15px;
}
.dg-title.title-style12.short .decorated.r{
  width: 50px;
}
.dg-title.title-style12.Length .decorated.r{
  width:33px;
}
.dg-title.title-style12.ultrashort .decorated.r{
  width: 18px;
}
.dg-title.title-style12.thin3 .decorated.r{
  border-bottom-width: 3px;
}
.dg-title.title-style12.thin2 .decorated.r{
  border-bottom-width: 2px;
}

.dg-title.title-style13{
	display: flex;
	align-items: center;
}
.dg-title.title-style13 .title{
	margin: 0;
	flex-shrink: 0;
	padding-left: 0.8em;
	padding-right: 0.8em;
}
.dg-title.title-style13 .decorated{
	width: 100%;
}


.dg-title.text-left,
.dg-title.title-style01.text-left .decorated.r,
.dg-title.title-style02.text-left .decorated.r,
.dg-title.title-style02.text-left .decorated.l,
.dg-title.title-style03.text-left .decorated.r,
.dg-title.title-style04.text-left .decorated.r,
.dg-title.title-style09.text-left .decorated.r,
.dg-title.title-style10.text-left .decorated.r,
.dg-title.title-style12.text-left .decorated.r{
  margin-left: 0;
}
.dg-title.text-right,
.dg-title.title-style01.text-right .decorated.r,
.dg-title.title-style02.text-right .decorated.r,
.dg-title.title-style02.text-right .decorated.l,
.dg-title.title-style03.text-right .decorated.r,
.dg-title.title-style04.text-right .decorated.r,
.dg-title.title-style09.text-right .decorated.r,
.dg-title.title-style10.text-right .decorated.r,
.dg-title.title-style12.text-right .decorated.r{
  margin-right: 0;
}
.dg-title.title-style11.text-left .decorated.l{
  margin-left: 4px;
}
.dg-title.title-style11.text-right .decorated.l{
  margin-right: 4px;
 
}


.dg-title .decorated,
.dg-title .title > .line,
.dg-title .title:after,
.dg-title .title:before{
  color:#20a3f0;
  border-color:#20a3f0;
}
.dg-title > .icon {
  color:#20a3f0;
}
.dg-title.title-style08 .title > .line,
.dg-title.title-style08 .title:after,
.dg-title.title-style08 .title:before,
.dg-title.title-style07 .title > .line,
.dg-title.title-style07 .title:after,
.dg-title.title-style07 .title:before,
.dg-title.title-style11 .title > .line,
.dg-title.title-style11 .title:after,
.dg-title.title-style11 .title:before,
.dg-title.title-style10 .decorated,
.dg-title.title-style09 .decorated{
  color:#a8a8a8;
  border-color:#a8a8a8;
}

.dg-title .animation.number {
  display: inline-block;
}


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

	.dg-title {
    margin-bottom: 15px;
}
  
  .dg-title .icon.size-xs .line{
     font-size: 20px;
     padding: 0px 10px;
  }
  .dg-title .icon.size-sm .line{
     font-size: 24px;
     padding: 0px 10px;
  }
  .dg-title .icon.medium .line{
    font-size: 28px;
     padding: 0px 12px;
  }
  .dg-title .icon.size-lg .line{
    font-size: 32px;
     padding: 0px 15px;
  }
  .dg-title .icon.size-xl .line{
     font-size: 36px;
     padding: 0px 15px;
  }

}