/********** 奇人デマゴギー囁く **********/ /********** 背景 **********/ body {background-image: url(../images/background-mono.svg)} /********** ヘッダー **********/ header {border-top: solid 0px #B3B3B3; border-bottom: solid 5px #B3B3B3; border-left: solid 1px #B3B3B3; border-right: solid 1px #B3B3B3} /*ポイントカラー #C26B6B*/ #header2 h1 {border-bottom: solid 3px #B3B3B3} #breadcrumbs ul {border-top: solid 1px #B3B3B3} /********** ナビメニュー **********/ nav .child li {border: solid 1px #B3B3B3} /********** 二段組み **********/ section {width: 268px} .main article {width: 590px; background-color: #C4A3A3; border-top: solid 2px #C26B6B; border-bottom: solid 1px #C26B6B; border-left: solid 2px #C26B6B; border-right: solid 1px #C26B6B; -webkit-transform: rotateY(180deg); transform: rotateY(180deg); -ms-transition: 0.8s; -webkit-transition: 0.8s; transition: 0.8s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; float: right} .main article:hover {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);} /********** プロフィール **********/ table,th,td {border: solid 1px #808080} table {border-collapse: collapse; font-size: 14px; margin-left: 15px; margin-bottom: 93px/*70px*/; float: left; color: #333333} th,td {padding-left: 25px; padding-right: 25px; padding-top: 9px; padding-bottom: 7px} td {width: 482px; background-color: #E2D2D2; border-left: solid 2px #808080; line-height: 1.8} th {text-align: left; font-weight: normal; width: 70px; background-color: #C4A3A3; border-left: solid 3px #C26B6B} table {-webkit-transform: rotateY(180deg); transform: rotateY(180deg); -ms-transition: 0.8s; -webkit-transition: 0.8s; transition: 0.8s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out} table:hover {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);} caption {border-top: solid 1px #808080; border-left: solid 3px #C26B6B} #kijin-image {float: right; width: 200px; height: 256px; margin-left: 3px; margin-right: 15px; margin-top: 40px; margin-bottom: 70px; border: solid 1px #C26B6B; border-left: solid 3px #C26B6B; border-radius: 2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: rotateX(180deg); transform: rotateX(180deg); -ms-transition: 0.8s; -webkit-transition: 0.8s; transition: 0.8s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out} #kijin-image:hover {-webkit-transform: rotateX(0deg); transform: rotateX(0deg)} #kijin-image img {width: 196px; height: 254px; float: right} /********** リンク **********/ .links {border-top: solid 5px #C26B6B; border-bottom: solid 2px #C26B6B} .links h2 {border-top: solid 2px #C26B6B; border-bottom: solid 1px #C3C3C3; background-color: #F2F2F2} /********** 更新 **********/ .new {margin-bottom: 31px;/*本来-8px*/ box-shadow: 0 3px #FA8333} .new-end {margin-top: -87px;/*本来-32px*/ margin-bottom: 85px; box-shadow: 0 -3px #FA8333} .new p {background-color: #FA8333; color: #FFFFF0} .new-end p {background-color: #FA8333; color: #FF6600} /********** 囁き **********/ .tab, .social-button {clear: both; width: 850px; margin-left: auto; margin-right: auto; margin-bottom: 6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-left: solid 14px #C4A3A3; border-right: solid 14px #C4A3A3; border-top: solid 1px #C26B6B; border-bottom: solid 1px #C26B6B; border-radius: 1px; box-shadow: 10px 0 #C26B6B, -10px 0 #C26B6B, 0 -13px #C26B6B, 0 -23px #35B44E; background-color: #FFFFF0; padding-top: 12px; padding-bottom: 12px} .tab p {text-align: center; line-height: 0} .tweet {clear: both; width: 850px; margin-left: auto; margin-right: auto; margin-bottom: 6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-left: solid 14px #C26B6B; border-right: solid 14px #C26B6B; border-top: solid 1px #C26B6B; border-bottom: solid 1px #C26B6B; border-radius: 1px; box-shadow: 10px 0 #C4A3A3, -10px 0 #C4A3A3; background-color: #FFFFF0; padding-top: 15px; padding-bottom: 15px} .tweet p {text-align: center} /********** 似非ソーシャルボタン **********/ .social-button {margin-bottom: 116px; overflow: auto; padding-top: 15px; padding-bottom: 15px; box-shadow: 10px 0 #C26B6B, -10px 0 #C26B6B, 0 13px #C26B6B, 0 23px #35B44E} /********** 更新タグ用 **********/ #social-top, #social-bottom {margin-bottom: 93px} .button-fb {float: left; width: 200px; height: 30px; background-image :url(../images/button-fb.svg); background-repeat: no-repeat; text-indent: -8000px; margin-left: 105px; margin-right: 10px} .button-fb:hover {background-image :url(../images/button-danger1.svg)} .button-twitter {float: left; width: 200px; height: 30px; background-image :url(../images/button-twitter.svg); background-repeat: no-repeat; text-indent: -8000px; margin-right: 10px} .button-twitter:hover {background-image :url(../images/button-danger1.svg)} .button-speak {float: left; width: 200px; height: 30px; background-image :url(../images/button-speak.svg); background-repeat: no-repeat; text-indent: -8000px} .button-speak:hover {background-image :url(../images/button-safe.svg)} /********** soon **********/ #soon {width: 870px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; clear: both; border-top: solid 4px #C26B6B; border-bottom: solid 4px #C26B6B; border-left: solid 2px #C26B6B; border-right: solid 2px #C26B6B; background-color: #FFFFF0; text-align: center; margin-left: auto; margin-right: auto; margin-bottom: 50px}