@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Righteous);

/*  Reset CSS  */
* { margin:0;  padding:0;}
ol,ul { list-style: none; }
a { outline:0; text-decoration:none; color:#555; }
img { border:0;}
body { font:12px/1.6 arial; color:#555; }

#sns {position: fixed; top: 50px; left: 50px; z-index: 15;}
#sns li {float: left; margin-right: 20px;}
#sns li i {font-size: 25px; color: #fff; opacity: 0.5; transition: all 0.5s;}
#sns li i:hover {transform: scale(1.5); opacity: 1;}
#menu {position: fixed; top: 370px; right: 0; z-index: 14;}
#menu a {display: block; width: 300px; opacity: 0.8; height: 60px; font-size: 20px; font-weight: normal; font-family: righteous; text-align: left; border-bottom: 1px solid #555; transition: all 0.5s;}
#menu li:hover a {font-size: 27px; opacity: 1;}
#menu li.on a {font-size: 27px; opacity: 1;}
#menu li:nth-child(1):hover a {color: rgb(187,49,86); border-color: rgb(187,49,86);}
#menu li:nth-child(2):hover a {color: #333; border-color: #333;}
#menu li:nth-child(3):hover a {color: rgb(21,77,143); border-color: rgb(21,77,143);}
#menu li:nth-child(4):hover a {color: rgb(31,142,125); border-color: rgb(31,142,125);}
#menu li:nth-child(1).on a {color: rgb(187,49,86); border-color: rgb(187,49,86);}
#menu li:nth-child(2).on a {color: #333; border-color: #333;}
#menu li:nth-child(3).on a {color: rgb(21,77,143); border-color: rgb(21,77,143);}
#menu li:nth-child(4).on a {color: rgb(31,142,125); border-color: rgb(31,142,125);}
section {width: 100%; height: 700px; position: relative; background-size: cover; background-position: right top; background-attachment: fixed; overflow: hidden;}
section:nth-child(1) {background-image: url(../img/ad1.jpg);}
section:nth-child(2) {background-image: url(../img/ad2.jpg);}
section:nth-child(3) {background-image: url(../img/ad3.jpg);}
section:nth-child(4) {background-image: url(../img/ad4.jpg);}
article {position: absolute; z-index: 11; top: 300px; right: 450px; text-align: right;}
article p {font-size: 50px; font-family: righteous; line-height: 1.5;}
article span {font-size: 15px; }
section:nth-child(1) p {color:rgb(187,49,86);}
section:nth-child(1) span {color:rgb(154,93,117);}
section:nth-child(2) p {color:#333;}
section:nth-child(3) p {color:rgb(30,28,119);}
section:nth-child(3) span {color:rgb(61,67,93);}
section:nth-child(4) p {color:rgb(12,193,149);}
section:nth-child(4) span {color:rgb(75,138,128);}

.p11 {position: absolute; top: 60px; left: 140px;}
.p12 {position: absolute; top: 400px; left: 80px;}
.p13 {position: absolute; top: 200px; left:  400px;}
.p21 {position: absolute;}
.p22 {position: absolute;}
.p31 {position: absolute; top: 100px;}
.p32 {position: absolute; top: 400px; left: 120px;}
.p41 {position: absolute;}
.p42 {position: absolute;}