@charset "utf-8";

/******************************
 VANILLA
******************************/

/*--------------------
 STAGE
--------------------*/

#stage {
	width: 1000px;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 50px;
}

/*--------------------
 MAIN
--------------------*/

#main {
	width: 1000px;
}

/*--------------------
 SIDE
--------------------*/

#side {
	float: left;
	width: 180px;
}

/*--------------------
 CONTENTS HEADER
--------------------*/

#contents-header {
	margin: 0 auto 0 auto;
}

/*--------------------
 SECTION
--------------------*/

article > section {
	margin-top: 30px;
}


/*--------------------
 TTL
--------------------*/

article > section > h2 {
	margin-bottom: 20px;
}





/******************************
 MODULE
******************************/

/*--------------------
 LINK
--------------------*/

a.txtlink {
	padding-left: 12px;
	background:
		url(../images/arrow01.png)
		no-repeat
		0px 0.25em;
}
a.txtlink:hover {
	text-decoration: underline;
}

a.outlink span {
    background: url("../images/icon_window.gif") no-repeat scroll right 0 transparent;
    margin-right: 5px;
    padding: 0 12px 0 0;
}

/*--------------------
 FUNC
--------------------*/

#func li {
	float: left;
	margin: 0 13px 13px 0;
	width: 237px;
}
#func li:nth-of-type(3),
#func li:nth-of-type(6) {
	margin-right: 0;
}

/*--------------------
 BEGINNER
--------------------*/

#beginner li:nth-of-type(1) {
	float: left;
}
#beginner li:nth-of-type(2) {
	float: right;
}

/*--------------------
 MONO
--------------------*/

.mono {
	font-size: 13px;
}
.mono ul li {
	margin-bottom: 10px;
	padding-bottom: 6px;
	border-bottom: 1px dotted #ccc;
}
.mono ul li a:hover {
	text-decoration: underline;
}
.mono p {
	text-align: right;
}

/*--------------------
 DUO
--------------------*/

.duo {
	font-size: 13px;
}
.duo > div:first-of-type {
	float: left;
	width: 360px;
}
.duo > div:last-of-type {
	float: right;
	width: 360px;
}
.duo h2 {
	margin-bottom: 10px;
}
.duo h3 {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px dotted #ccc;
}
.duo ul li {
	margin-bottom: 10px;
	padding-bottom: 6px;
	border-bottom: 1px dotted #ccc;
}
.duo p {
	text-align: right;
}
.duo a:hover {
	text-decoration: underline;
}

/*--------------------
 QUERY
--------------------*/

.query li {
	padding-left: 22px;
	background:
		url(../images/query/icon_q.png)
		no-repeat
		0 1px;
}

/******************************
 SIDE
******************************/

/*--------------------
 SIDE LOGIN
--------------------*/

#login {
	position: relative;
	margin-top: 6px;
	margin-bottom: 15px;
	width: 180px;
	height: 121px;
	background:
		url(../images/login/bg.png)
	;
}
#login div {
	position: absolute;
	bottom: 8px;
	left: 8px;
}

/*--------------------
 SIDE MAINTE
--------------------*/

#sideMainte {
	border:1px solid #bbb;
	min-height: 113px;
	margin-bottom: 15px;
	border-radius: 3px;
}
#sideMainte h3 {
	background: #575757;
	color: #fff;
	text-align: center;
	font-size: 13px;
	line-height: 1.3;
	padding:4px 0;
}


/*--------------------
 SIDE INQUIRY
--------------------*/

#inquiry {
	position: relative;
	margin-bottom: 15px;
	width: 180px;
	height: 129px;
	background:
		url(../images/inquiry/bg.png)
	;
}
#inquiry div {
	position: absolute;
	bottom: 8px;
	left: 8px;
}

/*--------------------
 SIDE TOOL
--------------------*/

#tool {
	margin-bottom: 15px;
}

/*--------------------
 SIDE INFO
--------------------*/

#info {
	position: relative;
	margin-bottom: 15px;
	width: 180px;
	height: 158px;
	background:
		url(../images/info/bg.png)
	;
}
#info div.btn1st {
	position: absolute;
	left: 8px;
	top: 86px;
}
#info div.btn2nd {
	position: absolute;
	left: 8px;
	bottom: 10px;
}

/*--------------------
 MSG
--------------------*/

.msg li {
	padding-left: 22px;
	background:
		url(../images/query/icon_hatena.png)
		no-repeat
		0 0;
}

/*--------------------
 ARW
--------------------*/

.arw li a {
	padding-left: 12px;
	background:
		url(../images/arrow01.png)
		no-repeat
		0px 0.25em;
}
.arw li a:hover {
	text-decoration: underline;
}

/*--------------------
 REPORT
--------------------*/

.report dl {
	overflow: hidden;
	margin-bottom: 10px;
	padding-bottom: 6px;
	border-bottom: 1px dotted #ccc;
}
.report dt {
	float: left;
	width: 150px;
	color: #888;
}
.report dd {
	float: left;
	padding-left: 12px;
	background:
		url(../images/arrow01.png)
		no-repeat
		0px 0.5em;
}
.report dd a:hover {
	text-decoration: underline;
}


/*--------------------
 REPORT add
--------------------*/

.reportadd dl {
	overflow: hidden;
	margin-bottom: 10px;
	padding-bottom: 6px;
	border-bottom: 1px dotted #ccc;
}
.reportadd dt {
	float: left;
	width: 100px;
	color: #888;
}
.reportadd dd {
	float: left;
	padding-left: 12px;
	background:
		url(../images/arrow01.png)
		no-repeat
		0px 0.5em;
}
.reportadd dd a:hover {
	text-decoration: underline;
}




/*--------------------
 TAB
--------------------*/

/* TABNAVI */

#start #tabNavi {
	position: relative;
	height: 48px;
	margin: 0 0 0 10px;
}
#start #tabNavi li:nth-of-type(1) {
	position: absolute;
	top: 14px;
	left: 0px;
}
#start #tabNavi li:nth-of-type(2) {
	position: absolute;
	top: 14px;
	left: 241px;
}
#start #tabNavi li:nth-of-type(3) {
	position: absolute;
	top: 14px;
	left: 480px;
}
#start #tabNavi li.selected {
	top: 0px;
}

#track #tabNavi {
	position: relative;
	height: 47px;
	margin: 0 0 0 10px;
}
#track #tabNavi li:nth-of-type(1) {
	position: absolute;
	top: 14px;
	left: 0px;
}
#track #tabNavi li:nth-of-type(2) {
	position: absolute;
	top: 14px;
	left: 330px;
}
#track #tabNavi li.selected {
	top: 0px;
}
/* TAB CONTENTS */

#start #tabCont {
	padding: 10px 20px 10px 20px;
	border: 10px solid #FFF896;
}
#start #tabCont section {
	margin: 0px 0 30px 0;
}
#start #tabCont h2 {
	margin: 10px 0 20px 0;
}
#start #tabCont ul li {
	position: relative;
	float: left;
	padding: 15px 8px 20px 12px;
	margin: 0 17px 17px 0;
	width: 310px;
	height: 80px;
	background: #FFFBDA;
	border-radius: 5px;
/* 	box-shadow: 1px 1px 2px #bbb; */
}

#track #tabCont {
	padding: 10px 20px 10px 20px;
	border: 10px solid #FFF896;
}
#track #tabCont section {
	margin: 0px 0 30px 0;
}
#track #tabCont h2 {
	margin: 10px 0 20px 0;
}
#track #tabCont ul li {
	position: relative;
	float: left;
	padding: 15px 8px 20px 12px;
	margin: 0 17px 17px 0;
	width: 310px;
	height: 80px;
	background: #FFFBDA;
	border-radius: 5px;
	box-shadow: 1px 1px 2px #bbb;
}

/* BOX01 */

#start #tabCont #box01 li {
	height: 115px;
}
#start #tabCont #box01 li:nth-of-type(even) {
	margin-right: 0;
}
#start #tabCont #box01 li div:nth-of-type(1) {
	position: absolute;
	left: 12px;
	bottom: 12px;
}
#start #tabCont #box01 li div:nth-of-type(2) {
	position: absolute;
	left: 168px;
	bottom: 12px;
}

/* BOX02 */

#start #tabCont #box02 a:hover li {
	opacity: 0.6;
}
#start #tabCont #box02 a:nth-of-type(even) li {
	margin-right: 0;
}


/*--------------------
 AREA
--------------------*/
#area {
	margin-top: 30px;
	padding: 30px;
	border: 1px solid #bbb;
	border-radius: 7px;
}

/*--------------------
 track
--------------------*/

#track #area h2 {
	margin:  30px 0 10px 0;
}
#track #area #flow {
	margin-bottom: 50px;
}
#track #area h3 {
	margin:  0 0 20px 0;
}
#track #area section > p {
	margin-bottom: 20px;
}

#track #area ol li > p {
	margin-bottom: 30px;
	padding-left: 22px;
	background:
		url("../images/track/num01.png")
		no-repeat
		0px 0px;
}
#track #area ol li:nth-of-type(1) > p {
	background-image:
		url("../images/track/num01.png")
}
#track #area ol li:nth-of-type(2) > p {
	background-image:
		url("../images/track/num02.png")
}
#track #area ol li:nth-of-type(3) > p {
	background-image:
		url("../images/track/num03.png")
}
#track #area ol li:nth-of-type(4) > p {
	background-image:
		url("../images/track/num04.png")
}
#track #area ol li:nth-of-type(5) > p {
	background-image:
		url("../images/track/num05.png")
}
#track #area ol li:nth-of-type(6) > p {
	background-image:
		url("../images/track/num06.png")
}
#track #area ol li:nth-of-type(7) > p {
	background-image:
		url("../images/track/num07.png")
}
#track #area ol li:nth-of-type(8) > p {
	background-image:
		url("../images/track/num08.png")
}
#track #area ol li:nth-of-type(9) > p {
	background-image:
		url("../images/track/num09.png")
}
#track #area ol li:nth-of-type(10) > p {
	background-image:
		url("../images/track/num10.png")
}

/* UL */
#track #area ul li > p {
	margin-bottom: 20px;
	padding-left: 22px;
	background:
		url("../images/track/num01.png")
		no-repeat
		0px 0px;
}
#track #area ul li:nth-of-type(1) > p {
	background-image:
		url("../images/track/num01.png")
}
#track #area ul li:nth-of-type(2) > p {
	background-image:
		url("../images/track/num02.png")
}
#track #area ul li:nth-of-type(3) > p {
	background-image:
		url("../images/track/num03.png")
}
#track #area ul li:nth-of-type(4) > p {
	background-image:
		url("../images/track/num04.png")
}
#track #area ul li:nth-of-type(5) > p {
	background-image:
		url("../images/track/num05.png")
}
#track #area ul li:nth-of-type(6) > p {
	background-image:
		url("../images/track/num06.png")
}
#track #area ul li:nth-of-type(7) > p {
	background-image:
		url("../images/track/num07.png")
}
#track #area ul li:nth-of-type(8) > p {
	background-image:
		url("../images/track/num08.png")
}

/* FIGURE */
#track #area li figure {
	margin-bottom: 30px;
	text-align: center;
}
#track #area li figure img {
	box-shadow: 2px 2px 3px #ccc;
}

/* SMALL */
#track #area p small {
	display: block;
	margin-top: 4px;
	color: #666;
}

/* COMPLETE */
#track #area p.complete {
	margin: 50px 0 20px 0;
	padding: 10px;
	background-color: #FFFAC6;
	text-align: center;
	border-radius: 100px;
}

/* ASIDE */
#track #area aside {
	position: relative;
	border: 1px solid #ddd;
	margin-bottom: 30px;
	padding: 30px;
	background-color: #f7f7f7;
	font-size: 12px;
}
#track #area aside h4 {
	margin-bottom: 15px;
	height: 47px;
	line-height: 47px;
	padding-left: 55px;
	background:
		url(../images/track/point.png)
		no-repeat;
	font-size: 15px;
	font-weight: bold;
	color: #F6AA00;
}
#track #area aside h5 {
	font-size: 13px;
	font-weight: bold;
}
#track #area aside p {
	margin-top: 12px;
	line-height: 1.8;
}
#track #area aside div {
	position: absolute;
	right: 30px;
	bottom: 30px;
}
#track .pointInside {
	position: relative;
	padding: 15px;
	border: 1px solid #ddd;
	background: #fff;
}

/* TABLE */

#track #area li > table {
	width: 100%;
	margin-bottom: 30px;
	border-collapse: collapse;
}
#track #area li > table th {
	padding: 5px 10px;
	width: 30%;
	border: 1px solid #bbb;
	background: #fff;
	font-weight: normal;
	font-size: 12px;
}
#track #area li > table td {
	padding: 5px 10px;
	border: 1px solid #bbb;
	background: #fff;
	vertical-align: top;
	font-size: 12px;
}
#track #area aside table {
	border-collapse: collapse;
}
#track #area aside table td {
	padding: 10px;
	border: 1px solid #bbb;
	background: #fff;
}
#track #area table thead td {
	width: 50%;
	background-color: #F6AA00;
	color: #fff;
	text-align: center;
}
#track #area table .hcell {
	background-color: #F6AA00;
	color: #fff;
}
#track #area table caption {
	caption-side: bottom;
	margin-top: 5px;
	text-align: left;
}
#tarck #area table {
	width: 100%;
}
#track #area table.duo td{
	width: 50%;
}
#track #area table.tri td {
	width: 33%;
}
#track #area table.quad td {
	width: 25%;
}

/* H6 */
#track h6 {
	font-weight: bold;
	font-size: 13px;
	color: #F29600;
}

/*--------------------
 PAGETOP
--------------------*/

#track .pagetop {
	margin: 40px 0 60px 0;
	border-bottom: 1px dotted #bbb;
}

/*--------------------
 EXAMPLE
--------------------*/

#track .example dt {
	margin-bottom: 10px;
}
#track .example dd {
	height: 100px;
	padding: 10px 20px 0 20px;
	background:
		url("../images/track/example/bg.png")
		no-repeat
		0px 0px
}

/*--------------------
 EXBOX
--------------------*/

#track .exbox {
	padding: 0 20px 20px 20px;
	border: 10px solid #FFF896;
}
#track .exbox h2 {
	margin: 0 0 10px 0;
}
#track .exbox figure {
	margin-bottom: 10px;
}

/*--------------------
 LINK
--------------------*/

#track a:hover {
	text-decoration: underline;
}

/*--------------------
 FIGCAPTION
--------------------*/

#track figcaption {
	margin-bottom: 5px;
}

/*--------------------
 COLOR
--------------------*/

.alert {
	color: #C30D23;
	font-weight: bold;
}

/*--------------------
 COLOR
--------------------*/

.caption {
	color: #666;
	font-size: 12px;
}

/*--------------------
 LIST
--------------------*/

#track #area li.dot,
#track #area ul.dot li {
	padding-left: 13px;
	background: url("../images/track/icon_dot.png") no-repeat 0 5px;
}

/*--------------------
 TABLE01
--------------------*/

#track .table01 th {
	padding: 8px;
	background: #fff;
	text-align: left;
	border: 1px solid #bbb;
	font-size: 12px;
}
#track .table01 td {
	width: 50px;
	padding: 5px;
	text-align: center;
	border: 1px solid #bbb;
	font-size: 12px;
}

/******************************
 SHELF
******************************/

/* LEFT */
#shelf #fix #left {
	float: left;
	width: 358px;
}

/* RIGHT */
#shelf #fix #right {
	float: right;
	width: 358px;
}

/* BOX */
#shelf #fix .box {
	position: relative;
	margin-bottom: 24px;
	padding: 8px 13px 13px 13px;
	min-height: 84px;
	border-radius: 5px;
	background-color: #FFFBDA;
	box-shadow: 1px 1px 2px #ccc;
}
#shelf #fix .box h3 {
	margin-bottom: 15px;
}
#shelf #fix .box ul li {
	margin-bottom: 3px;
	padding-left: 15px;
	background:
		url("../images/shelf/arw.png")
		no-repeat 0 2px;
	font-size: 13px;
}
#shelf #fix .box ul li a:hover {
	text-decoration: underline;
}
#shelf #fix .box figure {
	position: absolute;
	right: 10px;
	bottom: 10px;
}

/******************************
 FAQ
******************************/

/*--------------------
 KEYWORD
--------------------*/

#keyword .searchBox {
	height: 23px;
	padding-left: 6px;
}
.searchBtn {
	width: 51px;
	height: 27px;
	border: 0px;
	vertical-align: top;
	background: url("https://support.sakura.ad.jp/faq/images/btn.png");
}

/******************************
 MAINTE
******************************/

.highlight {
	padding: 0 0 0 10px;
	margin: 4px 0 0 0;
	background-color: #fffde6 !important;
}
.txt20 { font-size: 20px !important; }
.txt20 span { font-size: 13px !important; }
.rsLine { background: url(https://support.sakura.ad.jp/mainte/images/hl02.png) 0px 10px no-repeat !important; }
.vpsLine { background: url(https://support.sakura.ad.jp/mainte/images/hl03.png) 0px 10px no-repeat !important; }
.ssLine { background: url(https://support.sakura.ad.jp/mainte/images/hl04.png) 0px 10px no-repeat !important; }
.cloudLine { background: url(https://support.sakura.ad.jp/mainte/images/hl05.png) 0px 10px no-repeat !important; }
.dcLine { background: url(https://support.sakura.ad.jp/mainte/images/hl06.png) 0px 10px no-repeat !important; }

/******************************
 BASE
******************************/

/*--------------------
 VISUAL
--------------------*/

#base .visual {
	padding-left: 30px;
	width: 710px;
	height: 85px;
	border-radius: 5px;
	background: #48ABD6;
	box-shadow: 1px 1px 1px #ccc;
	color: #fff;
	font-weight: normal;
	font-size: 30px;
	line-height: 85px;
	position: relative;
}
#base article {font-size: 13px;}

/*--------------------
 TTL
--------------------*/

#base .ttl {
	padding-left: 15px;
	background: url(../images/default/ttl.png) no-repeat 0px 2px;
	color: #31A0D0;
	font-weight: normal;
	font-size: 23px;
}

/*--------------------
 HL
--------------------*/

#base .hl {
	margin-bottom: 12px;
	height: 30px;
	background: url(../images/default/hl.png) no-repeat 0px 23px;
	font-size: 17px;
}

/*--------------------
 TABLE01
--------------------*/

#base .table01 {
	border-collapse: collapse;
	width: 100%;
}
#base .table01 th {
	border: 1px solid #aaa;
	background: #31A0D0;
	color: #fff;
	padding: 3px;
	white-space: nowrap;
}
#base .table01 td {
	border: 1px solid #aaa;
	padding: 3px 10px;
	font-size: 12px;
}
#base .table01 .bgcell td {
	background: #e0f1f8;
}
#base .table01 .red {
	color: #dd0000;
}
#base .caption a:hover {
	text-decoration: underline;
}

/*--------------------
 CAL
--------------------*/

.cal {
	border-collapse: collapse;
	border: 1px solid #ccc;
}
.cal th {
	width: 96px;
	height: 30px;
	border: 1px solid #ccc;
	vertical-align: middle;
	font-size: 14px;
}
.cal th:nth-of-type(1) {
	color: #ff0000;
}
.cal th:nth-of-type(7) {
	color: #036EB7;
}
.cal td {
	padding: 10px;
	height: 100px;
	border: 1px solid #ccc;
	vertical-align: middle;
	font-size: 12px;
	vertical-align: top;
}
.cal td .txtlink {
	padding-left: 9px;
}
.cal td.blue {
	background: #EAF5FC;
}
.cal td.yellow {
	background: #FFFCE4;
}
.sheetGray {
	border: 1px solid #ccc;
	background: #f7f7f7;
}

.op:hover {
	opacity: 0.7;
}

#id_bivalves img {
  width: 0;
}