
/** 160325 **/

.sbox_bs{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+25,f1f1f1+25,ff9ccf+25,ff9ccf+50,ffffff+50,ffffff+75,ff9ccf+75,ff9ccf+100 */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(-45deg,  #ffffff 0%, #ffffff 25%, #f1f1f1 25%, #ff9ccf 25%, #ff9ccf 50%, #ffffff 50%, #ffffff 75%, #ff9ccf 75%, #ff9ccf 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg,  #ffffff 0%,#ffffff 25%,#f1f1f1 25%,#ff9ccf 25%,#ff9ccf 50%,#ffffff 50%,#ffffff 75%,#ff9ccf 75%,#ff9ccf 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg,  #ffffff 0%,#ffffff 25%,#f1f1f1 25%,#ff9ccf 25%,#ff9ccf 50%,#ffffff 50%,#ffffff 75%,#ff9ccf 75%,#ff9ccf 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ff9ccf',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	background-size: 13px 13px;
	margin: 0 0 10px 0;
	padding: 2px;
}

.sbox_bg{
	border: 1px solid #ffbbec;
	padding: 1px;
	background: #fff;
	border-radius: 5px;
}

.sbox{
	border: 1px solid #fa92dd;
	border-radius: 3px;
	background: url(img/sbox.gif) top left;
	box-shadow:0px 0px 3px 0px #fa92dd inset;
	-moz-box-shadow:0px 0px 3px 0px #fa92dd inset;
	-webkit-box-shadow:0px 0px 3px 0px #fa92dd inset;
}

.inbox_bg{
	border: 1px solid #ddd;
	padding: 2px;
	background: #fff;
	border-radius: 5px;
	box-shadow:0px 0px 2px 0px #cccccc;
	-moz-box-shadow:0px 0px 2px 0px #cccccc;
	-webkit-box-shadow:0px 0px 2px 0px #cccccc;
}

.inbox{
	border: 1px solid #ddd;
	border-radius: 3px;
	box-shadow:0px 0px 2px 0px #cccccc inset;
	-moz-box-shadow:0px 0px 2px 0px #cccccc inset;
	-webkit-box-shadow:0px 0px 2px 0px #cccccc inset;
}


/* system */

#system{
	width			: 935px;
	margin			: 0 0 0 22px;
}


/* course */

#course{
	font-size: 0;
	line-height: 0;
	vertical-align: top;
	background		: url(./img/course.png) no-repeat 100% 100%;
}

#course .inbox_bg{
	display: inline-block;
	width: 435px;
	vertical-align: top;
	margin: 0 0 15px 15px;
}

#course .inbox{
	padding-bottom: 15px;
}

#course h4{
	width			: 430px;
	height			: 50px;
	font-size		: 24px;
	font-weight		: bold;
	line-height		: 51px;
	text-indent		: 45px;
	color			: #ff0066;
	background		: url(./img/h4-1.png) no-repeat -5px 0;
}

#course h4{
}

#course table{
	width			: 414px;
	font-size		: 19px;
	line-height		: 22px;
	margin			: 0 auto;
}

#course th{
	width			: 240px;
	font-weight		: bold;
	text-align		: left;
	padding			: 22px 0;
	border-bottom	: 2px dotted #cccccc;
}

#course th p{
	padding-left	: 34px;
}

#course td{
	font-weight		: bold;
	text-align		: right;
	padding			: 22px 0;
	border-bottom	: 2px dotted #cccccc;
}

#course td p{
	padding-right	: 5px;
}

.box1 th p{
	color			: #0066ff;
	background		: url(./img/i1.gif) no-repeat 10px 6px;
}

.box2 th p{
	color			: #009900;
	background		: url(./img/i2.gif) no-repeat 10px 6px;
}

.box3 th p{
	color			: #ff6600;
	background		: url(./img/i3.gif) no-repeat 10px 6px;
}

.box3 th span{
	font-size		: 14px;
}

#course .box4{
	display: inline-block;
	width: 400px;
}

#course .box4 p{
	font-size		: 16px;
	font-weight		: bold;
	line-height		: 22px;
	color			: #ff0000;
	padding			: 0 0 10px 18px;
}


/** play **/

#play{
	width			: 935px;
	position		: relative;
	margin			: 0 0 10px 0;
}

#play .boxtxt{
	width			: 380px;
	font-size		: 16px;
	font-weight		: bold;
	line-height		: 22px;
	color			: #ff0000;
	position		: absolute;
	top				: 17px;
	right			: 0px;
}

#play ul{
	display			: block;
	margin			: 0 0 0 18px;
}

#play ul:after{
	content			: "";
	display			: block;
	clear			: both;
}

#play li{
	float			: left;
	width			: 226px;
	height			: 60px;
	background		: url(./img/li1.png) no-repeat;
}

#play li p{
	display			: block;
	width			: 219px;
	height			: 54px;
	font-size		: 20px;
	font-weight		: bold;
	line-height		: 54px;
	text-indent		: 38px;
	color			: #990099;
}


/** op **/

#option{
	width			: 935px;
	margin			: 0 0 10px 0;
}

#option ul{
	display			: block;
	margin			: 0 0 0 18px;
}

#option ul:after{
	content			: "";
	display			: block;
	clear			: both;
}

#option li{
	float			: left;
	width			: 455px;
	height			: 60px;
	background		: url(./img/li2.png) no-repeat;
	position		: relative;
}

#option li p{
	display			: block;
	width			: 444px;
	height			: 54px;
	font-size		: 20px;
	font-weight		: bold;
	line-height		: 54px;
	text-indent		: 38px;
	color			: #990099;
}
#option li p em{
	font-style: normal;
	font-size: 12px;
}

#option li span{
	display			: block;
	font-size		: 20px;
	font-weight		: bold;
	line-height		: 54px;
	text-align		: right;
	color			: #ff0000;
	position		: absolute;
	top				: 0;
	right			: 30px;
}


/* area */

#area{
	width			: 935px;
	margin			: 0 0 15px 0;
}

#area .inbox_bg{
	width: 895px;
	margin: 0 0 0 13px;
}

#area .inbox{
	padding: 8px 0 15px 0;
}

#area table{
	width			: 875px;
	font-size		: 22px;
	line-height		: 26px;
	margin			: 0 auto;
}

#area th{
	width			: 200px;
	font-weight		: bold;
	text-align		: left;
	padding			: 11px 0;
	border-bottom	: 2px dotted #cccccc;
}

#area th p{
	color			: #ff6699;
	background		: url(./img/i4.gif) no-repeat 10px 6px;
	padding-left	: 34px;
}

#area td{
	font-size		: 18px;
	font-weight		: bold;
	padding			: 11px 0;
	border-bottom	: 2px dotted #cccccc;
}

#area td p{
	padding-left	: 5px;
}

#area .boxtxt{
	font-size: 16px;
    font-weight: bold;
    line-height: 22px;
    color: #ff0000;
	width: 895px;
    margin: 15px 0 0 13px;
}


/** card **/

#card{
	width			: 935px;
	height			: 180px;
	background		: url(./img/card.jpg?t=0722) no-repeat;
	position		: relative;
	margin			: 0 0 10px 0;
}

#card h3{
	height: 80px;
	text-indent: -9999px;
}

#card p{
	display			: block;
	position		: absolute;
	top			: 100px;
	right			: 35px;
}

#card .boxtxt{
	width			: 380px;
	font-size		: 14px;
	font-weight		: bold;
	line-height		: 18px;
	position		: absolute;
	top			: 100px;
	left			: 35px;
}


/** hotel

#hotel{
	width			: 935px;
	height			: 325px;
	float			: left;
	background		: url(./img/hotel.jpg) no-repeat;
	position		: relative;
	margin			: 0 0 10px 0;
}

#hotel table{
	width			: 414px;
	font-size		: 22px;
	line-height		: 26px;
	margin			: 6px 0 0 31px;
}

#hotel th{
	width			: 270px;
	font-weight		: bold;
	text-align		: left;
	padding			: 11px 0;
	border-bottom	: 2px dotted #cccccc;
}

#hotel th p{
	color			: #ff6699;
	background		: url(./img/i4.gif) no-repeat 10px 6px;
	padding-left	: 34px;
}

#hotel td{
	font-weight		: bold;
	text-align		: right;
	padding			: 11px 0;
	border-bottom	: 2px dotted #cccccc;
}

#hotel td p{
	padding-right	: 5px;
}

#hotel .boxtxt{
	width			: 500px;
	font-size		: 16px;
	font-weight		: bold;
	line-height		: 26px;
	color			: #ff0000;
	position		: absolute;
	top				: 150px;
	left			: 473px;
}

**/


/** use **/

#use{
	width			: 935px;
	font-size: 0;
	line-height: 0;
}

#use .cbox{
	display: inline-block;
	vertical-align: top;
}

#use .inbox_bg{
	display: block;
	width: 435px;
	vertical-align: top;
	margin: 0 0 15px 15px;
}

#use .inbox{
	padding-bottom: 15px;
}

#use ul{
	padding			: 0 0 0 10px;
}

#use ul:after{
	content			: "";
	display			: block;
	clear			: both;
}

#use li{
	width			: 418px;
	font-size		: 13px;
	line-height		: 18px;
	border-bottom	: 1px dotted #cccccc;
	padding			: 6px 0 6px 0;
}

#use li p{
	padding			: 0 0 0 20px;
}

#use .box1 div{
	font-size		: 16px;
	font-weight		: bold;
	line-height		: 24px;
	color			: #ff0000;
	padding			: 13px 0 3px 13px;
}

#use .box1 .boxtxt{
	font-size		: 13px;
	line-height		: 18px;
	color			: #ff0000;
	padding			: 10px 0 0 13px;
}


#use .box2 ul{
	margin			: 8px 0 0 0;
}

#use .box3 ul{
	margin			: 8px 0 0 0;
}

#use .box1 li{
	background		: url(./img/i4.gif) no-repeat 1px 9px;
}

#use .box2 li{
	background		: url(./img/i5.gif) no-repeat 3px 9px;
}

#use .box3 li{
	background		: url(./img/i6.gif) no-repeat 1px 7px;
}


