/* shop.css */
body, div, table, th, td, span{
	/*font-family: "ＤＦＧ流隷体ＡW5", "ＤＦ流隷体ＡW5";*/
}

div#wrap {
	height: auto;
	width: 1200px;
	margin:0 auto;
}

div#contents-left {
	float: left;
}

div#contents-left table{
	width: 630px;
	background: url("/img/prof_back.gif") no-repeat left bottom;
	font-size: 16px;
	line-height: 1.2em;
	font-weight: bold;
	border: 0;
	padding: 0;
	table-layout: fixed;
}

div#contents-left table tr td{
	font-size: 16px;
	line-height: 1.2em;
	font-weight: bold;
}

div#contents-left table tr.head{
	background: url("/img/prof_header.gif") no-repeat left top;
}

div#contents-left table tr.head td {
	height: 47px;
	height: 44px\9;
	text-align: right;
	vertical-align: bottom;
	padding: 0 15px 3px 0;
}

div#contents-left table tr.name{
	background: url("/img/prof_top.gif") no-repeat left top;
}

div#contents-left table tr.name td{
	font-size: 16px;
	padding: 0 10px 0 20px;
	height: 34px;
	vertical-align: middle;
}

div#contents-left table tr.name td span{
	font-size: 24px;
	font-weight: bold;
	vertical-align: middle;
}

div#contents-left table tr.tr1{
	background: url("/img/prof_tr_1.gif") no-repeat left top;
}

div#contents-left table tr.tr2{
	background: url("/img/prof_tr_2.gif") no-repeat left top;
}

div#contents-left table tr.tr3{
	background: url("/img/prof_tr_3.gif") no-repeat left top;
}

div#contents-left table tr.tr4{
	background: url("/img/prof_tr_4.gif") no-repeat left top;
}

div#contents-left table tr.tr5{
	background: url("/img/prof_tr_5.gif") no-repeat left top;
}

div#contents-left table tr.tr6{
	background: url("/img/prof_tr_6.gif") no-repeat left top;
}

div#contents-left table tr td.l-column{
	width: 50%;
	background-position: left top;
	padding: 30px 0 5px 24px;
}

div#contents-left table tr td.r-column{
	width: 50%;
	background-position: right top;
	padding: 30px 10px 5px 14px;
}

div#contents-left table tr.tr6 td{
	width: 100%;
	padding: 30px 18px 24px 25px;
}

.icon-nowaiting {
	position: absolute;
	left: 40px;
	bottom: 40px;
}

.rotate_icon {
  text-align: center;
	-webkit-animation: rotation 4s linear infinite;
	animation: rotation 4s linear infinite;
}

@-webkit-keyframes rotation {
  0% { transform:translateY(0) rotate(0deg) }
  10% { transform:translateY(-3px) rotate(-5deg) }
  20% { transform:translateY(0) rotate(-10deg) }
  30% { transform:translateY(-3px) rotate(-5deg) }
  40% { transform:translateY(0) rotate(0deg) }
  50% { transform:translateY(-3px) rotate(0deg) }
  60% { transform:translateY(0) rotate(5deg) }
  70% { transform:translateY(-3px) rotate(10deg) }
  80% { transform:translateY(0) rotate(5deg) }
  90% { transform:translateY(-3px) rotate(0deg) }
  100% { transform:translateY(0) rotate(0deg) }
}
@keyframes rotation {
  0% { transform:translateY(0) rotate(0deg) }
  10% { transform:translateY(-3px) rotate(-5deg) }
  20% { transform:translateY(0) rotate(-10deg) }
  30% { transform:translateY(-3px) rotate(-5deg) }
  40% { transform:translateY(0) rotate(0deg) }
  50% { transform:translateY(-3px) rotate(0deg) }
  60% { transform:translateY(0) rotate(5deg) }
  70% { transform:translateY(-3px) rotate(10deg) }
  80% { transform:translateY(0) rotate(5deg) }
  90% { transform:translateY(-3px) rotate(0deg) }
  100% { transform:translateY(0) rotate(0deg) }
}


div#contents-right {
	float: left;
	width: 630px;
}

div#contents-right table{
	width: 630px;
	background: url("/img/play_back.gif") no-repeat left bottom;
	border: 0;
	padding: 0;
	table-layout: fixed;
}

div#contents-right table tr td{
	font-size: 16px;
	line-height: 1.2em;
	font-weight: bold;
}

div#contents-right table tr.head{
	background: url("/img/play_header.gif") no-repeat left top;
}

div#contents-right table tr.head td {
	width: 100%;
	height: 47px;
	height: 44px\9;
	text-align: right;
	vertical-align: bottom;
	padding: 0 15px 3px 0;
}
div#contents-right table tr.head td img {
	width: 31px;
	height: 28px;
}

div#contents-right table tr.tr1{
	background: url("/img/play_tr_1.gif") no-repeat left top;
}

div#contents-right table tr.tr2{
	background: url("/img/play_tr_2.gif") no-repeat left top;
	width: 350px;
}

div#contents-right table tr.tr3{
	background: url("/img/play_tr_3.gif") no-repeat left top;
}

div#contents-right table tr.tr4{
	background: url("/img/play_tr_4.gif") no-repeat left top;
}

div#contents-right table tr.tr5{
	background: url("/img/play_tr_5.gif") no-repeat left top;
}

div#contents-right table tr td.l-column{
	width: 50%;
	background-position: left top;
	padding: 34px 0 2px 20px;
}
div#contents-right table tr td.l-column span.half {
	position: relative;
	display: inline-block;
	width: 100%;
	height: 27px;
	max-width: 31px;
	margin-left: 15.5px;
}
div#contents-right table tr td.l-column span.half::after {
	position: absolute;
	content: "";
	left: -15.5px;
	width: 15.5px;
	height: 27px;
	background: url("/img/heart1.png") top left no-repeat;
	background-size: 31px 27px;
}

div#contents-right table tr td.r-column{
	width: 50%;
	background-position: right top;
	padding: 34px 20px 2px 0;
}

div#contents-right table tr.tr4 td{
	width: 100%;
	padding: 36px 10px 5px 20px;
}

div#contents-right table tr.tr5 td{
	width: 100%;
	padding: 36px 18px 24px 20px;
}

table,
thead,
tbody,
tr,
th,
td {
	margin: 0;
	padding: 0;
	border: none !important;
}

.overLayer {
	width: 100vw;
	height: 100vh;
	background: #000;
	position: fixed;
	top: 0;
	z-index: 9999 !important;
}

.overLayer>.start {
	width: 30vw;
	height: 100vh;
	color:#000;
	font-size: 20px;
	text-align: center;
	line-height: 70px;
	background-color: #000;
	transition: .3s;
}
.flickity-slider {
	margin: 0;
	padding: 0;
}

.carousel {
	width: 100%;
	height: 100vh;
	background: none;
	/* transform: scale(0.8); */
	margin: 0;
	top: 0;
}

.carousel-cell {
	width: 100%;
	background-color: #fff;
	height: auto;
}

.carousel-cell:before,
.carousel-cell__number {
	content: "";
}

.carousel-cell-inner {
	width: 1260px;
	transform: scale(0.8) translate(0, -10%);
	height: auto;
	margin: 0 auto;
	padding: 0 0 0 0;
	-webkit-transform: scale(0.8) translate(0, -10%);
	-moz-transform: scale(0.8) translate(0, -10%);
	-ms-transform: scale(0.8) translate(0, -10%);
	-o-transform: scale(0.8) translate(0, -10%);
}

.bottom_p {
	margin-top: 10px;
}

.close_btn {
	position: absolute;
	top: 5px;
	right: 10px;
	cursor: pointer;
	z-index: 8888;
}
.flickity-viewport{
	max-height: 100vh;
}