/*---------------------------------------------------------
Theme Name: beauty-dietoz
Description: オリジナルテンプレート
Version: test ver.
Author: Y.Satou
---------------------------------------------------------*/

@charset "utf-8";

.Alink {
    pointer-events: auto !important;}

/* common */
body {
	background: #FDDFF7;
	color: #333333;
	font-size: 13px;
	font-family: 'メイリオ', Meiryo, Arial, 'Lucida Grande', 'Trebuchet MS', Verdana, Sans-Serif;
	text-align: center;
	margin: 0 auto;
	padding: 0;
	line-height: 140%;}

a:link{ text-decoration: underline; color:#DA3C81;}
a:visited{ text-decoration:none; color:#DA3C81;}
a:hover{ text-decoration:none; color:#BFBFFF;}

img {
	margin: 0;
	padding: 0;
	vertical-align: bottom;}
img , img a {border-style:none;}
a img:hover {
	filter:alpha(opacity=65);
	-moz-opacity:0.65;
	-khtml-opacity:0.65;
	opacity:0.65;}

.clear {clear: both;}
.clearfix {display: block;}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}

.none {display: none;}

.boader {text-decoration: underline !important;}
.alignleft {text-align: left;}
.aligncenter {text-align: center;}
.alignright {text-align: right;}

article,aside,canvas,details,figcaption,figure,header,footer,hgroup,menu,nav,section,summary {
	display: block;}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	margin: 0;
	padding: 0;}
ol, ul, li, p, form, input, dt, dd {
	margin: 0;
	padding: 0;}
div,p {
	word-wrap: break-word;
	word-break: break-all;}
hr{margin:0;}
ul,li {list-style-type:none;}
nav li {display: inline-table;}
nav li a {text-decoration: none !important;}

.moreLink {
	margin-top: 10px;
	text-decoration: none;}
.moreLink a {
	text-decoration: none;}
.textOverflow { overflow: hidden; }

.postmeta {
	font-size: 11px;
	margin: 10px -5px;
	padding: 1px 5px;
	background: #eee;}
.postmeta p {
	float: left;}
.postmeta p:after {
	content: "|";
	margin: 0px 3px;
	display: inline-block;}
.postmeta ul {}
.postmeta li {
	float: left;}

.postmeta a {
	float: left;}
.postmeta a:after {
	display: inline-block;
	content: ",";}
.postmeta a:last-of-type:after {
	content: "";}
.post-categories li a:after {
	display: inline-block;
	content: "," !important;
	margin-right: 3px;}

blockquote {
	margin: 0px 5px;
	padding: 10px 10px 0px;
	border: 1px solid #ccc;
	background: #eee;}

/* レイアウト */
#header {
	width: 1020px;
	text-align: left;
	margin: 0 auto;
/*	background: #fff;*/}
#contents {
	width: 1020px;
	margin: 0 auto;
	text-align: left;
	background: #fff;}
#sideLeft {
	float: left;
	width: 200px;
	margin: 0px 0px 30px 5px;}
#main {
	float: left;
	width: 500px;
	margin: 0px 5px 0px;}
#sideRight {
	float: right;
	width: 300px;
	margin: 5px 5px 30px 0px;}
#footer {
	width: 1020px;
	margin: 0 auto;
	background: #fff;}

/* タイトルバー */
#header nav { border-bottom: solid 15px #fff;}
#header nav , #sideLeft h1 , #sideRight h1 , #main .archive h1 , #main .postRank h1 , #main .postIndex h1 ,#main .noPage h1 {
	background: linear-gradient(#F7CFD7, #FDADD4, #F7CFD7);
	background: -webkit-linear-gradient(#F7CFD7, #FDADD4, #F7CFD7);
	background: -moz-linear-gradient(#F7CFD7, #FDADD4, #F7CFD7);}
#header nav li a , #sideLeft h1 , #sideRight h1 , #main .archive h1 , #main .postRank h1 , #main .postIndex h1 ,#main .noPage h1 { color: #DA3C81; }


/* header */
.h1Area {
	color: #aaa;
	font-size: 11px;
	padding: 0px 5px 0px;}
.h1Area h1 {
	font-weight: normal;}
.headerImgArea img {
	width: 100%;}

.siteTitle {
	margin: -54px 5px 0px;}
.siteTitleText {
	font-size: 28px;
	font-weight: bold;
	margin: 10px 10px 0px 5px;}
.siteTitleText a {
	color: #333;
	text-decoration: none;}
.siteTitleText a:hover {
	color: #BFBFFF;}
.siteTitle p {
	margin: 1px 7px 2px;
	padding: 5px 0px 0px;}

#header nav li {
	float: left;
	width: 19.9%;
	border-right: 1px solid #fff;}
#header nav li:last-of-type {
	border-right: 0;}
#header nav li a {
	display: block;
	font-weight: bold;
	text-align: center;
	padding: 10px 0px;}
#header nav li a:hover {
	color: #fff;
	background: #B7175B;}

.rssHeader {
	text-align: center;
	padding-left: 1px;}
.rssArea {
	display: inline-block;
	text-align: left;
	width: 505px;
	height: 173px;
	margin: 15px 0px 10px;
	border: 1px solid #ccc;
	overflow-y: scroll;}
.rssArea li {
	padding: 3px 5px;
	border-bottom: 1px dotted #ccc;
	white-space: nowrap;
	overflow: hidden;}
.rssArea li:nth-of-type(1):after,.rssArea li:nth-of-type(2):after,.rssArea li:nth-of-type(3):after,.rssArea li:nth-of-type(4):after,.rssArea li:nth-of-type(5):after {
	content: "NEW!";
	color: #ff0000;
	margin-left: 5px;}

/* main */
#main section {
	margin-bottom: 20px;
	padding: 5px;
	border: 1px solid #ccc;
	border-radius: 2px;}
#main .archive h1 {
	font-size: 15px;
	font-weight: normal;
	padding: 7px 10px 5px;
	margin: -6px -6px 0px;
	border-radius: 2px 2px 0px 0px;}
#main .postRank h1 , #main .postIndex h1 ,#main .noPage h1 {
	font-size: 15px;
	font-weight: normal;
	padding: 7px 10px 5px;
	margin: -6px -6px 5px;
	border-radius: 2px 2px 0px 0px;}

.postCont {
	padding: 5px 5px 10px;
	margin: 10px 5px;
	border-bottom: 1px dotted #ccc;}
.postCont h2 {
	font-size: 25px;
	line-height: 120%;
	margin-bottom: 10px;}
.postCont .thumbBox {
	float: left;
	width: 150px;
	height: 150px;
	margin-right: 10px;
	overflow: hidden;
	border: 1px solid #ccc;}
.postCont .thumbBoxImg {
	display: table-cell;
	vertical-align: middle;
	width: 150px;
	height: 150px;} 
.postCont .thumbBox img {
	width: 150px;
	height: auto;}
.archiveMoreLink {
	text-align: right;
	margin: -8px 5px -3px;
	padding: 5px;}
.archiveMoreLink a {
	color: #666;
	text-decoration: none;}
.archiveMoreLink a:hover {
	text-decoration: underline;}

.postRank .postCont h2 , .postIndex  .postCont h2 {
	font-size: 20px;
	margin-bottom: 5px;
	padding-top: 5px;}
.postRank .postCont .thumbBox {
	width: 100px;
	height: 100px;
	margin: 0px 10px 10px 30px;}
.postIndex .postCont .thumbBox {
	width: 100px;
	height: 100px;
	margin: 0px 10px 10px 0px;}
.postRank .postCont .thumbBoxImg , .postIndex .postCont .thumbBoxImg {
	display: table-cell;
	width: 100px;
	height: 100px;
	vertical-align: middle;}
.postRank .postCont .thumbBox img , .postIndex .postCont .thumbBox img {
	width: 100px;
	height: auto;}
.postRank .postCont .thumbBox:before {
	display: block;
	font-weight: bold;
	color: #666;
	position: absolute;
	padding: 1px 5px 0px;
	margin: 38px 0px 0px -32px;}
.postRank .postCont:nth-of-type(1) .thumbBox:before {
	content: "1"; 
	border: 3px solid #ffa500;}
.postRank .postCont:nth-of-type(2) .thumbBox:before {
	content: "2";
	border: 3px solid #c0c0c0;}
.postRank .postCont:nth-of-type(3) .thumbBox:before {
	content: "3";
	border: 3px solid #6c3524;}

.postRank .postCont .postmeta {
	margin: 5px -5px 0px !important;
	background: none;}

.postRank .postCont {
	margin-bottom: 0 !important;
	padding: 0px 5px !important;}
.postRank .postCont:first-of-type {
	padding-top: 10px !important;
	border-top: 1px dotted #ccc;}
.postRank .postCont:last-of-type {
	border-bottom: 0;
	padding-bottom: 0px !important;}

.rankEdit {
	text-align: center;}
.rankEdit li {
	display: inline-table;}
.rankEdit li a {
	color: #aaa;
	text-decoration: none;
	display: block;
	width: 200px;
	margin: 5px 5px 0px;
	padding: 5px 0px;
	border: 1px solid #ddd;
	background: #eee;}
.rankEdit li.selectTab a {
	font-weight: bold;
	color: #666 !important;}
.rankEdit li a:hover {
	color: #fff;
	background: #aaa;}
.rankArea { display: none; }
	
/* single */
.single {
	padding: 10px !important;
	border-bottom: 1px dotted #ccc;}
.single h1 {
	font-size: 25px;
	line-height: 120%;
	padding: 10px 5px;}

.postText {
	padding: 0px 3px;}
.postText h2 {
	font-size: 17px;
	margin-bottom: 10px;
	padding: 2px 7px 0px;
	border-left: 3px solid #999;}
.postText h3 {
	font-size: 15px;
	margin-bottom: 10px;
	padding: 2px 7px 0px;
	border-left: 3px solid #999;}
.postText h4 {
	margin-bottom: 10px;
	padding: 2px 7px 0px;
	border-left: 3px solid #999;}
.postText img {
	margin: 10px 0px;
	max-width: 470px;
	height: auto;
	pointer-events:none;}
.postText p {
	margin: 0px 0px 10px;}

.postText iframe {
	max-width: 450px;}

.postIndex .postCont {
	margin: 5px;}
.postIndex .postCont:last-of-type {
	margin-bottom: 0;
	border-bottom: 0;}
.postIndex .moreLink {
	text-align: right;
	padding: 0px 5px 5px;}

.postText table {
	font-size: 11px;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-collapse: collapse;}
.postText table th {
	font-weight: bold;
	background: #bbb;}
.postText table th , .postText table td {
	padding: 0px 2px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;}

/* side */
#sideLeft section , #sideRight section {
	margin-bottom: 30px;}
#sideLeft h1 , #sideRight h1 {
	font-weight: normal;
	text-align: left;
	margin: 0px 0px 10px;
	padding: 5px 10px;
	border-radius: 2px;}

/* sideLeft */
.sidePostCont:hover {
	filter:alpha(opacity=65);
	-moz-opacity:0.65;
	-khtml-opacity:0.65;
	opacity:0.65;}
.sidePostThumb {
	width: 195px;
	height: 140px;
	margin-bottom: 5px;
	border: 3px solid #555;
	overflow: hidden;}
.sidePostThumb img {
	width: 195px;}
.sidePostThumb a img:hover {
	filter:alpha(opacity=100);
	-moz-opacity:1.00;
	-khtml-opacity:1.00;
	opacity:1.00;}
.sidePostTitle {
	width: 187px;
	height: 32px;
	margin-top: -45px;
	padding: 2px 7px 5px;
	background: #555;
	position: absolute;
	filter:alpha(opacity=85);
	-moz-opacity:0.85;
	-khtml-opacity:0.85;
	opacity:0.85;}
.sidePostTitle h2 {
	color: #fff;
	font-size: 11px;
	font-weight: normal;}

/* sideRight */
.howToGame {
	margin: 10px 0px !important;}
.howToGame img {
	width: 300px;}

#sideRight li {
	margin: 0px 5px 10px 8px;}
#sideRight li:before {
	content: "▶";
	color: #999;
	border: 2px solid #999;
	border-radius: 50px;
	margin-right: 5px;
	padding: 0px 2px 0px 3px;
	line-height: 150%;
	font-size: 11px;
	vertical-align: middle;}
#sideRight li a {
	font-weight: bold;
	color: #333;
	text-decoration: none;
	padding-bottom: 5px;}
#sideRight li a:hover {
	text-decoration: underline;}

.catList .catChild {
	margin: 8px 0px 0px 15px ;}
.catList .catChild li {
	margin: 0px 0px 5px 25px !important;
	list-style-type: disc;}
.catList .catChild li:before {
	content: "" !important;
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;}
.catList .catChild li a {
	margin-left: -2px;}

.newCommCont {
	margin: 10px;}
.newCommImg {
	float: left;
	width: 50px;
	height: 50px;
	margin-right: 10px;
	overflow: hidden;
	border: 1px solid #ccc;}
.newCommImg .thumbBoxImg {
	display: table-cell;
	vertical-align: middle;
	width: 50px;
	height: 50px;}
.newCommImg img {
	width: 50px;
	height: auto;}
.newCommCont h2:after {
	content: "に";
	font-weight: normal;
	font-size: 11px;
	margin-left: 5px;}
.newCommCont p {
	font-size: 11px;}
.newCommCont p span {
	margin: 5px 5px 5px 0px;}

/* pankuzu */
.pankuzu {
	color: #666;
	margin: 0px 10px 5px;}
.pankuzu li {
	float: left;}
.pankuzu li a {
	color: #666;}
	
/* comment */
#reply-title , .says , .reply , .comment-edit-link , .comment-subscription-form { display: none; }

.postComm {
	margin: 10px 0px;
	padding-top: 10px;
	border-top: 1px solid #ccc;}
.postComm h1 {
	font-size: 15px;
	margin-left: 30px;}
.postComm h1:before {
	content: "?";
	font-size: 12px;
	text-align: center;
	color: #888;
	width: 17px;
	margin: -4px 0px 0px -30px;
	padding: 1px 0px 0px 1px;
	border: 2px solid #888;
	border-radius: 17px;
	display: inline-block;
	position: absolute;}
.comm {
	margin: 5px 5px 10px;
	padding: 5px 0px;}
.commEdit {}
.commEdit input[type="text"] {
	padding: 2px;
	border: 1px solid #aaa;
	border-radius: 3px;}

.comment-author , .comment-meta {
	display: inline-table;
	font-size: 11px;}
.comment-author a , .commentmetadata a{
	pointer-events:none;
	text-decoration: none;
	color: #666;}

.fn {
	font-style: normal !important;}
.comment-author:after {
	content: "\3055\3093";
	margin-left: 3px;}
.commentmetadata {
	margin-left: 20px;}

.comment-body {
	margin-bottom: 10px;
	padding-bottom: 10px;}
.comment-body p {
	clear: both;
	margin: 5px 5px 10px -23px;
	padding: 5px;
	background: #eee;}

.commList li {
	list-style-type: decimal;
	margin-left: 29px;}

.commFormTags {
	margin-top: 0px !important;
	font-weight: bold;}
.commEdit {
	margin: 10px 5px;
	padding: 10px;
	border: 1px solid #aaa;
	border-radius: 2px;
	background: #eee;}
.commEdit p {
	margin-bottom: 10px;}
.commEdit p:last-of-type {
	margin-bottom: 0;}
.form-submit input[type="submit"] {
	color: #555;
	padding: 1px 5px;}
.commEdit textarea {
	width: 99%;
	margin-top: 2px;
	padding: 2px;
	border: 1px solid #aaa;
	border-radius: 3px;}

.noComm {
	margin: 0px 0px 10px;
	padding: 10px;
	border: 3px solid #ddd;}

.postComm .pageNavi {
	margin: 0px -15px !important;}
.postComm .pageNavi a {
	font-weight: normal;
	text-decoration: none;
	font-size: 12px;
	color: #666;}
.nav-previous { float: left; }
.nav-next { float: right; }

/* calendar */
.postCalendar {
	text-align: center;}
.postCalendar caption {
	font-weight: bold;
	padding: 2px 0px 0px;
	background: #FBBCD6;}
.postCalendar table {
	text-align: center;
	width: 99%;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-spacing: 0;}
.postCalendar th , .postCalendar td {
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;}

/* toTop */
.toTop {
	font-weight: bold;
	font-size: 15px;
	text-align: right;
	padding-right: 5px;}
.toTop a {
	color: #333;}

/* footer */
.footerBox {
	background: #FDADD4;}
#footer nav {
	padding: 5px;
	text-align: left;}
#footer nav li:after {
	content: "|";
	margin-left: 5px;}
#footer nav li:last-of-type:after {
	content: "";}
#footer nav li a {
	color: #555;}
#footer nav li a:hover {
	text-decoration: underline !important;}
	
.copyright {
	color: #777;
	margin-top: 46px;
	text-align: center;}
.copyright a {
	color: #777;}
.copyright a:hover {
	text-decoration: none;}

/* search */
.search {
	text-align: center;
	margin: -5px 0px -20px !important;}

.search input[type="text"] {
	display: inline-block;
	width: 230px;
	padding: 0px 5px;
	font-size: 14px;
	height: 32px;
	border: 0;
	background: #FDDFF7;}
.search input[type="image"] {
	display: inline-block;
	vertical-align: top;
	margin-left: -5px;}

/* pageNavi */
.pageNavi {
	margin: 10px 10px 0px;
	text-align: center;}
.pageNavi li {
	display: inline-block;
	font-weight: bold;
	padding: 5px 9px;
	background: #999;}
.pageNavi li a {
	color: #333;
	font-weight: normal !important;}

.single .pageNavi {
	text-align: left;
	margin: 0px -10px 20px;
	padding: 5px;
	font-weight: bold;
	background: #eee;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;}
.single .pageNavi p {
	margin: 5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;}
.single .pageNavi p a {
	margin-left: 10px;
	font-weight: normal;}

.wp-pagenavi span , .wp-pagenavi a {
	display: inline-block;
	margin: 0px 3px 5px;
	padding: 4px 9px;
	border: 1px solid #aaa;
	background: #eee;}
.wp-pagenavi .current {
	font-weight: bold;}
.wp-pagenavi a.page {
	color: #999;}
.wp-pagenavi .nextpostslink , .wp-pagenavi .previouspostslink , .wp-pagenavi .first , .wp-pagenavi .last {
	color: #333;}

/* contact */
.wpcf7 {
	padding: 10px 10px 0px !important;
	background: #eee;
	border: 1px solid #ccc;}
.wpcf7 p {
	margin: 0px 0px 10px !important;}
.wpcf7 p:last-of-type {
	margin: -10px 0px 0px !important;}
.wpcf7 span {
	font-size: 11px;}
.wpcf7-acceptance {
	vertical-align: middle;
	margin-right: 3px;}
.wpcf7 input[type="text"] , .wpcf7 input[type="email"] , .wpcf7 textarea {
	width: 98%;
	padding: 3px;}
.wpcf7-submit {
	padding: 1px 4px;
	font-size: 12px;}
.wpcf7-response-output {
	margin: 0px 0px 10px !important;
	background: #fff !important;
	border: 2px solid #666 !important;}

/* 404 */

.noPage {
	margin: 10px 5px;
	padding: 10px;
	border: 3px solid #ddd;}

/* sns */
.snsBtn {
	margin: 20px 0px 20px;}
.snsBtn li {
	display: inline-table;
	vertical-align: text-top;}
.snsBtn li:first-of-type {
	margin-right: -40px;}
.snsBtn li:nth-of-type(2) {
	margin-right: -10px;
	margin-left: 16px;}

/* ad */
.adArea {
	text-align: center;
	margin: 10px 0px;}

#sideLeft .adArea {
	margin: -10px 0px 15px;}
#sideLeft .adArea img {
	width: 200px;}
	
#sideRight .adArea {
	margin: 0px 0px 10px;}
#adHoming {
	padding: 20px 0px;}

#footer .adArea {
	margin: 0px;
	padding: 5px 0px;}

.rssPrBox {
	width: 195px;
	height: 140px;
	margin-bottom: 5px;
	border: 3px solid #555;
	overflow: hidden;}
.rssPrBox img {
	width: 195px;}
.rssPrBoxTitle {
	width: 184px;
	height: 32px;
	color: #fff;
	font-size: 11px;
	margin-top: -23px;
	padding: 2px 7px 5px;
	background: #555;
	position: absolute;
	filter:alpha(opacity=85);
	-moz-opacity:0.85;
	-khtml-opacity:0.85;
	opacity:0.85;}

.codeBord {
	margin-bottom: 10px !important;}
.codeBord img {
	width: 198px;
	border: 1px solid #ccc;}

.nowEvent {
	margin-bottom: 10px !important;}
.nowEvent h1 { 
	margin-bottom: 3px !important; }
.nowEvent img {
	width: 198px;
	margin-bottom:3px;
	border: 1px solid #eee;}

p.jump {
    margin:0 auto;
    background: url("http://beauty.dietoz.com/img/itemBtn.png") no-repeat;
    width:400px;
    height:80px;
    text-indent:-99999px;
}
p.jump.jump2 {
  -webkit-animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: bottom center;
  -webkit-animation-name: jump2;
}

@-webkit-keyframes jump2 {
  0%{-webkit-transform: scale(1, 1);}
  48%{-webkit-transform: scale(1, 1);}
  50%{-webkit-transform: scale(1, 1);}
  53%{-webkit-transform: scale(1, 1) translate(0, -5px);}
  57.5%{-webkit-transform: scale(1, 1) translate(0, -3px);}
  59%{-webkit-transform: scale(1, 1) translate(0, 0px);}
  100% {-webkit-transform: scale(1, 1);
  }
}


.itemBtn { width:400px; height:100px; display:block;}
.itemBtn img:hover { width:400px; height:100px; background: url("http://beauty.dietoz.com/img/itemBtn2.png") center no-repeat;}
.animated {
	margin:0 auto;
	animation-duration: 1s;	-webkit-animation-duration: 1s;
	animation-fill-mode: both;	-webkit-animation-fill-mode: both;
	animation-iteration-count: infinite;	-webkit-animation-iteration-count: infinite;
	background: url("http://beauty.dietoz.com/img/itemBtn.png") center no-repeat;
	width:400px;
	height:100px;
	cursor: pointer;
}
.animated:hover {background: url("http://beauty.dietoz.com/img/itemBtn2.png") center no-repeat;}
.animated span { visibility: hidden;}
 @-webkit-keyframes tada {
 0% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
 10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);}
 30%, 50%, 70%, 90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);}
 40%, 60%, 80% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);}
 100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}
.tada {
 -webkit-animation-name: tada;	animation-name: tada;
 0% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
 10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);}
 30%, 50%, 70%, 90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);}
 40%, 60%, 80% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);}
 100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}
.swing {
    transform-origin: top center; -webkit-transform-origin: center 100px 0;
    animation-name: swing; -webkit-animation-name: swing;
    animation-duration: 3s; -webkit-animation-duration: 3s;
    animation-fill-mode: both; -webkit-animation-fill-mode: both;
    animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite;
    -ms-transform-origin: center 100px 0;
    -o-transform-origin: center 100px 0;
    width: 400px;
    height: 100px;
    background: url("http://beauty.dietoz.com/img/itemBtn.png") no-repeat;
    margin: 0 auto;
    cursor: pointer;
}
.swing span { visibility: hidden;}
@-webkit-keyframes swing {
  30% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg);}
  40% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg);}
  45% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg);}
  50% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg);}
  55% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg);}
  60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg);}
  65% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg);}
  100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg);}
}
@keyframes swing {
  30% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg);}
  40% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg);}
  45% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg);}
  50% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); }
  55% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg);}
  60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg);}
  65% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg);}
  100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg);}
}


.Bnone,
.Bnone th,
.Bnone tr,
.Bnone td {
	border:none !important;}
.Spding,
.Spding th,
.Spding tr,
.Spding td {
	padding:5px !important;}

.wid50 { width:50px;}
.wid100 { width:100px;}
.wid150 { width:150px;}
.wid200 { width:200px;}
.wid250 { width:250px;}
.wid300 { width:300px;}
.wid350 { width:350px;}
.wid400 { width:400px;}
.wid450 { width:450px;}
.wid500 { width:500px;}

.Cname { color:#;}
.hoshi1 { color:#0a0a0a;}
.hoshi2 { color:#3f1f00;}
.hoshi3 { color:#ce6700;}
.hoshi4 { color:#ff0080;}
.hoshi5 { color:#950000;}
.hoshi6 { color:#6a6a00;}
.Chp { color:#950095;}
.Cmp { color:#004a95;}
.Catk { color:#950000;}
.Cdef { color:#353535;}

.bold	{ font-weight: bold;}
.normal	{ font-weight: normal;}
.ita	{ font-style: italic;}
.obli	{ font-style: oblique;}
.txtL {text-align:left;}
.txtC {text-align:center;}
.txtR {text-align:right;}

/* -- FONT SIZE -- */

.fs10 { font-size: 10px;}
.fs11 { font-size: 11px;}
.fs12 { font-size: 12px;}
.fs13 { font-size: 13px;}
.fs14 { font-size: 14px;}
.fs15 { font-size: 15px;}
.fs16 { font-size: 16px;}
.fs17 { font-size: 17px;}
.fs18 { font-size: 18px;}
.fs19 { font-size: 19px;}
.fs20 { font-size: 20px;}
.fs21 { font-size: 21px;}
.fs22 { font-size: 22px;}
.fs23 { font-size: 23px;}
.fs24 { font-size: 24px;}
.fs25 { font-size: 25px;}
.fs26 { font-size: 26px;}
.fs27 { font-size: 27px;}
.fs28 { font-size: 28px;}
.fs29 { font-size: 29px;}
.fs30 { font-size: 30px;}
.fs31 { font-size: 31px;}
.fs32 { font-size: 32px;}
.fs33 { font-size: 33px;}
.fs34 { font-size: 34px;}
.fs35 { font-size: 35px;}
.fs36 { font-size: 36px;}
.fs37 { font-size: 37px;}
.fs38 { font-size: 38px;}
.fs39 { font-size: 39px;}
.fs40 { font-size: 40px;}
.fs50 { font-size: 50px;}
.fs60 { font-size: 60px;}
.fs70 { font-size: 70px;}
.fs80 { font-size: 80px;}
.fs90 { font-size: 90px;}
.fs100 { font-size: 100px;}
.fs0 { font-size: 0px;}

.BGwhite { background:#FFF !important;}

/* -- COLOR -- */
.orange		{ color:#FFA500;}
.Dorange	{ color:#FF8C00;}
.Rorange	{ color:#FF4500;}
.red		{ color:#FF0000;}
.Dred		{ color:#8B0000;}
.Lcyan		{ color:#E0FFFF;}
.cyan		{ color:#00FFFF;}
.Dcyan		{ color:#008B8B;}
.Lblue		{ color:#ADD8E6;}
.blue		{ color:#0000FF;}
.Dblue		{ color:#00008B;}
.Llime		{ color:#7CFC00;}
.lime		{ color:#00FF00;}
.Dlime		{ color:#228B22;}
.gray		{ color:#808080;}
.gray2		{ color:#dfdfdf;}
.Dgray		{ color:#A9A9A9;}
.black		{ color:#000000;}
.violet		{ color:#EE82EE;}
.pink		{ color:#FFC0CB;}
.magenta	{ color:#FF00FF;}
.Dmagenta	{ color:#8B008B;}
.yellow		{ color:#FFFF00;}
.gold		{ color:#FFD700;}
.Lgreen		{ color:lightgreen;}
.green		{ color:#008000;}
.Dgreen		{ color:#006400;}
.cccccc		{ color:#cccccc;}
.c2c2c2	{ color: #c2c2c2;}	/*E*/
.77ecff { color: #77ecff;}	/*D*/
.3fc604 { color: #3fc604;}	/*C*/
.ff6b00 { color: #ff6b00;}	/*B*/
.e3cb03 { color: #e3cb03;}	/*A*/
.007fff { color: #007fff;}	/*S*/
.a2902e { color: #a2902e;}	/*レア*/
.a4545e { color: #a4545e;}	/*古典*/


/* float
 --------------------------------------------------- */
.floatL { float:left;}
.floatR { float:right;}

/*line height
 --------------------------------------------------- */
.lh10 { line-height:10px;}
.lh11 { line-height:11px;}
.lh12 { line-height:12px;}
.lh13 { line-height:13px;}
.lh14 { line-height:14px;}
.lh15 { line-height:15px;}
.lh16 { line-height:16px;}
.lh17 { line-height:17px;}
.lh18 { line-height:18px;}
.lh19 { line-height:19px;}
.lh20 { line-height:20px;}
.lh21 { line-height:21px;}
.lh22 { line-height:22px;}
.lh23 { line-height:23px;}
.lh24 { line-height:24px;}
.lh25 { line-height:25px;}
.lh26 { line-height:26px;}
.lh27 { line-height:27px;}
.lh28 { line-height:28px;}
.lh29 { line-height:29px;}
.lh30 { line-height:30px;}
.lh40 { line-height:40px;}
.lh50 { line-height:50px;}
.lh60 { line-height:60px;}
.lh70 { line-height:70px;}
.lh80 { line-height:80px;}
.lh90 { line-height:90px;}
.lh100 { line-height:100px;}
/* margin-top
 --------------------------------------------------- */
.mt0 { margin-top: 0 !important;}
.mt5 { margin-top: 5px !important;}
.mt10 { margin-top: 10px !important;}
.mt15 { margin-top: 15px !important;}
.mt20 { margin-top: 20px !important;}
.mt25 { margin-top: 25px !important;}
.mt30 { margin-top: 30px !important;}
.mt35 { margin-top: 35px !important;}
.mt40 { margin-top: 40px !important;}
.mt45 { margin-top: 45px !important;}
.mt50 { margin-top: 50px !important;}
.mt55 { margin-top: 55px !important;}
.mt60 { margin-top: 60px !important;}
.mt65 { margin-top: 65px !important;}
.mt70 { margin-top: 70px !important;}
.mt75 { margin-top: 75px !important;}
.mt80 { margin-top: 80px !important;}
.mt85 { margin-top: 85px !important;}
.mt90 { margin-top: 90px !important;}
.mt95 { margin-top: 95px !important;}
.mt100 { margin-top: 100px !important;}
.mt110 { margin-top: 110px !important;}
.mt200 { margin-top: 200px !important;}
.mt250 { margin-top: 250px !important;}
.mt300 { margin-top: 300px !important;}
.mt350 { margin-top: 350px !important;}
.mt400 { margin-top: 400px !important;}
.mt450 { margin-top: 450px !important;}
.mt500 { margin-top: 500px !important;}
/* margin-left
 --------------------------------------------------- */
.ml0 { margin-left: 0 !important;}
.ml5 { margin-left: 5px !important;}
.ml10 { margin-left: 10px !important;}
.ml15 { margin-left: 15px !important;}
.ml20 { margin-left: 20px !important;}
.ml25 { margin-left: 25px !important;}
.ml30 { margin-left: 30px !important;}
.ml35 { margin-left: 35px !important;}
.ml40 { margin-left: 40px !important;}
.ml45 { margin-left: 45px !important;}
.ml50 { margin-left: 50px !important;}
.ml55 { margin-left: 55px !important;}
.ml60 { margin-left: 60px !important;}
.ml65 { margin-left: 65px !important;}
.ml70 { margin-left: 70px !important;}
.ml75 { margin-left: 75px !important;}
.ml80 { margin-left: 80px !important;}
.ml85 { margin-left: 85px !important;}
.ml90 { margin-left: 90px !important;}
.ml95 { margin-left: 95px !important;}
.ml100 { margin-left: 100px !important;}
.ml110 { margin-left: 110px !important;}
.ml200 { margin-left: 200px !important;}
/* margin-bottom
 --------------------------------------------------- */
.mb0 { margin-bottom: 0 !important;}
.mb5 { margin-bottom: 5px !important;}
.mb10 { margin-bottom: 10px !important;}
.mb15 { margin-bottom: 15px !important;}
.mb20 { margin-bottom: 20px !important;}
.mb25 { margin-bottom: 25px !important;}
.mb30 { margin-bottom: 30px !important;}
.mb35 { margin-bottom: 35px !important;}
.mb40 { margin-bottom: 40px !important;}
.mb45 { margin-bottom: 45px !important;}
.mb50 { margin-bottom: 50px !important;}
.mb55 { margin-bottom: 55px !important;}
.mb60 { margin-bottom: 60px !important;}
.mb65 { margin-bottom: 65px !important;}
.mb70 { margin-bottom: 70px !important;}
.mb75 { margin-bottom: 75px !important;}
.mb80 { margin-bottom: 80px !important;}
.mb85 { margin-bottom: 85px !important;}
.mb90 { margin-bottom: 90px !important;}
.mb95 { margin-bottom: 95px !important;}
.mb100 { margin-bottom: 100px !important;}
.mb110 { margin-bottom: 110px !important;}
.pb110 { padding-bottom: 110px !important;}
.mb200 { margin-bottom: 200px !important;}
/* margin-right
 --------------------------------------------------- */
.mr0 { margin-right: 0 !important;}
.mr5 { margin-right: 5px !important;}
.mr10 { margin-right: 10px !important;}
.mr15 { margin-right: 15px !important;}
.mr20 { margin-right: 20px !important;}
.mr25 { margin-right: 25px !important;}
.mr30 { margin-right: 30px !important;}
.mr35 { margin-right: 35px !important;}
.mr40 { margin-right: 40px !important;}
.mr45 { margin-right: 45px !important;}
.mr50 { margin-right: 50px !important;}
.mr55 { margin-right: 55px !important;}
.mr60 { margin-right: 60px !important;}
.mr65 { margin-right: 65px !important;}
.mr70 { margin-right: 70px !important;}
.mr75 { margin-right: 75px !important;}
.mr80 { margin-right: 80px !important;}
.mr85 { margin-right: 85px !important;}
.mr90 { margin-right: 90px !important;}
.mr95 { margin-right: 95px !important;}
.mr100 { margin-right: 100px !important;}

.pd5 { padding:5px !important;}
.pd10 { padding:10px !important;}
.pd15 { padding:15px !important;}
.pd20 { padding:20px !important;}
.pd25 { padding:25px !important;}
.pd30 { padding:30px !important;}
.pd35 { padding:35px !important;}
.pd40 { padding:40px !important;}
.pd45 { padding:45px !important;}
.pd50 { padding:50px !important;}