@font-face {
    font-family: Noto ;
    src: url("font/NotoSerif-Regular.ttf")/* TTF file for CSS3 browsers */
}
@font-face {
    font-family: Notob ;
    src: url("font/NotoSerif-Bold.ttf")/* TTF file for CSS3 browsers */
}
@font-face {
    font-family: SFU;
    src: url("font/SFUBodoniBoldCondensed.ttf")/* TTF file for CSS3 browsers */
}

body {
    font-family: "Noto";
    padding: 0;
    margin: 0;
    color: #4a4a4a;
}
p {
  font-family: "Noto";
}
.share{
	display:none;
}
.header {
	width: 100%;
	height: 53px;
	background-color: black;
	position: fixed;
}
.left {
	float: left;
	margin-top: 0px;
	top: 0px;
}
.right {
	float: right;
	margin-top: 0px;
	top: 0px;
}
.left img {
	margin-left: 0px;
}
.wrapper {
	width: 1000px;
	margin: 0 auto;
}
.title-page img{
	vertical-align: middle;
}
.cover-top {
	display: block;
	width: 100%;
}
.t1 {
	width: 63%;
	font-size: 30px;
	text-align: justify;
	padding: 0 20%;
	margin: 0 auto;
	margin-bottom: 30px;
}
.t1-a7{
	margin-bottom: 25px !important;
}
.t1-header{
    font-family: "Notob" !important;
    color: #4c4c4c;
    margin-top: -4%;
    margin-bottom: 6%;
    font-size: 36px;
    margin-left: 1%;
}
.ct {
	width: 68%;
	font-size: 20px;
	text-align: justify;
	margin: 0 auto;

}
.ct1 {
	padding: 0;

}
.img-1{
	width:71%;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left:14%;
}
.image {
	width: 70%;
	margin: 0 auto;
}
.image img {
	width: 330px;
	margin-left: 18px;
}
.image ul {
	padding: 0;
    list-style: none;
}
.image ul li {
    display: inline;
}
.new-cover{
	float: right;
    width: 74%;
}
.img-7{
	margin-bottom: 20px;
}
.tt1:first-letter {
    float: left;
    font-size: 0.1px;
    padding: 114px 2px 0px 122px;
    background: url(../img/1.png) no-repeat;
    background-size: 100%;
    margin-top: -6%;
}
.tt2:first-letter {
	float: right;
    font-size: .1px;
    padding: 170px 10px 0 310px;
    background: url("../img/5.png") no-repeat;
    margin-left: 10px;
}
.clear {
	clear: both;
}
.fl {
	display: inline;
}
.footer {
	width: 100%;
	font-family: "SFU";
	font-size: 20px;
    line-height: 60px;
    background-color: black;
    color: #fff;
    text-align: center;
}
.footer ul {
    list-style: none;
    margin-bottom: -20px;
}
.footer ul li {
}
.footer ul li:last-child {
    border-right: none;
}
.footer img {
	height: 58px;
}
.fb-02{
	float: left;
	max-width: 40px;
	position: fixed;
	top:69%;
	right: 3%;

}
.fb1 {
	cursor: pointer;
	float: right;
	margin-top: 15px;
	width: 100%;
	margin-right: 10px;
	box-shadow:  4px 4px 7px #8c8c8c;
	border-radius: 50px;
}
.fb2 {
	cursor: pointer;
	float: right;
	margin-top: 10px;
	width: 100%;
	margin-right: 10px;
	box-shadow: 4px 4px 7px #8c8c8c;
	border-radius: 50px;
}
#hide {
	display: none;
}
@media all and (max-width: 640px){
	.share{
		display:block;
		color:white;
		font-size:35px;
		float: right;
		margin-top: 2px;
		margin-right: 10px;
	}
	.header {
		width: 100%;
		height: 53px;
		background-color: black;
	}
	.left {
		float: left;
		margin-top: 0px;
		top: 0px;
	}
	.right {
		float: right;
		margin-top: 0px;
		top: 0px;
	}
	.left img {
		margin-left: 0px;
	}
	.wrapper {
		width: 100%;
		margin: 0 auto;
	}
	.title-page img{
		vertical-align: middle;
	}
	.cover-top {
		display: block;
		width: 100%;
	}
	.t1 {
		width: 80%;
		font-size: 30px;
		text-align: justify;
		padding: 0 10%;
		margin: 0 auto;
		margin-bottom: 30px;
		margin-top: -34px;
	}
	.ct {
		width: 80%;
		font-size: 15px;
		text-align: justify;
		padding: 0 10% 5%;
		margin: 0 auto;
	}
	.ct1 {
		padding: 0;

	}
	.mobi-tl{
		display: none;
	}
	.new-cover{
		display:none;
	}
	.img-1{
		width:100%;
	     margin-top: 0px; 
     margin-bottom: 0px; 
     margin-left: 0%; 
	}
	.image {
		width: 100%;
		margin: 0 auto;
	}
	.image img {
		width: 90%;
		margin-left: 18px;
	}
	.image ul {
		padding: 0;
	    list-style: none;
	}
	.image ul li {
	    display: block;
	}
	.ct-mobi-1, .ct-mobi-3{
		padding-bottom: 7%;
	}
	.ct-mobi-2{
		padding-top:6%;
	}
	.tt-tl:first-letter {
	    background: url(../imgmobi/6.png) no-repeat center ;
	    background-size: auto 100%;
	}
	.tt1:first-letter {
	    float: left;
	    font-size: 0.1px;
	    background: url(../img/1.png) no-repeat;
		background-size: 101%;
	    margin-top: -1%;
	    padding: 49px 80px 70px 70px;

	}
	.heart{
		width:100%;
		margin-top: -200px;
	}
	.tt2:first-letter {
		float: right;
	    font-size: .1px;
	    padding: 0;
	    background: none;
	    margin-left: 10px;
	}
	.clear {
		clear: both;
	}
	.tt3:first-letter {
		padding: 0;
		background: none;
	}
	.fl {
		display: inline;
	}
	.footer {
		width: 100%;
		font-family: "SFU";
		font-size: 16px;
	    line-height: 60px;
	    background-color: black;
	    color: #fff;
	    text-align: center;
	}
	.footer ul {
	    list-style: none;
	    margin-bottom: -20px;
	}
	.footer ul li {
	}
	.footer ul li:last-child {
	    border-right: none;
	}
	.footer img {
		height: 58px;
	}
	.fb-02{
		float: left;
		max-width: 40px;
		position: fixed;
		top:69%;
		right: 3%;
		display:none;

	}
	#btns {
		border: 1px solid black;
		background-color: #365899;
		padding:  5px;
		border-radius: 5px;
		text-decoration: none;
		font-size:  28px;
	}
	#hide {
		display: block;
	}
	.t1-a7-new{
		margin-top:-147px;
	}
}