﻿@charset "UTF-8";

/*-----------------------------------------------
 __Base Link Color Setting
-----------------------------------------------*/

a {
	color:#409BE3;
}

a:link {
}

a:visited {
}

a:hover {
}

a:active {
}


/*-----------------------------------------------
 __header
-----------------------------------------------*/

#header {
	width:1025px;
	height:123px;
	background:url(../images/header_bg.png) no-repeat top;
	margin:0 auto 0px;
}
#header-inner {
	width:950px;
	height:122px;
	margin:0 auto;
}

#header #logo {
	padding:0px 0 0 0px;
	margin:0;
	width:500px;
	float:left;
}
#header p.toplink {
	padding:59px 0 0 390px;
	margin:0;
}
#header p.toplink a{
	background:url(../images/toplink.png) no-repeat;
	width:65px;
	height:13px;
	display:block;
	text-indent:-9999px;
}
#header h1{
	width:370px;
	float:left;
}
#header h1 a{
	padding:0px 0 0 0;
	margin:0;
	width:370px;
	height:72px;
	background:url(../images/toplogo.png) no-repeat left;
	text-indent:-9999px;
	display:block;
}

#header p#siteDescription {
	padding:32px 0 5px 5px;
	margin:0 auto;
	font-size:11px;
	text-align:left;
}

#header div#navi{
	float:right;
	padding:0px 0px 0px 0;
	margin:0px 0 0;
	text-align:right;
}

#header div#navi ul{
	clear:both;
}

#header div#navi ul.navi01 li{
	padding:0px 7px 0px 0px;
	margin:0px 0 0;
}
#header div#navi ul.navi01 li.last{
	padding:0px 0px 0px 0px;
	margin:0px 0 0;
}

/*#header div#navi ul.navi01 li a{
	text-decoration:none;
}
#header div#navi ul.navi01 li a:hover{
	text-decoration:underline;
}*/
#header div#navi ul.navi01 li{
	float:left;
	margin:0 0 0 0px;
	/*padding:0px 15px 0px 10px;
	/*text-align:right;
	font-size:11px;
	background:url(../images/navi_icon.gif) top left no-repeat;*/
}

#header div#navi ul.navi02 li{
	float:left;
	width:163px;
	padding:0px 0px 0px 8px;
	margin:6px 0 0;
	text-align:right;
}



/*----- dl -----*/
dl {
	margin:2px 0;
}
dd {
	margin: 4px;
	margin-left: 2em;
}
button,
input {
	margin: 0;
	padding: 0;
}

/*----- h1 -----*/
/*h1 {
	text-align: center;
	font-size: 12pt;
	margin: 0;
	margin-bottom: 6px;
	background-color: #cfffcf;
	color: green;
	border: 1px #90ff90 solid;
	padding: 2px 4px;
}
div.h1 { width: 95%; margin: 0 auto; }
div.h1 p { text-indent: 1em; }*/

/*----- h2 -----*/
h2 {
	text-align: left;
	font-size: 14pt;
	margin: 7px 0 0 0;
	background:url(../images/h2_bg.gif) no-repeat top;
	padding: 10px 10px 0px 26px;
	height:50px;
}
div.h2 { width: 95%; margin: 0 auto; }
div.h2 p { text-indent: 1em; }

h2#h2_update,h2#h2_insert,h2#h2_edit,h2#h2_card,h2#h2_order,h2#h2_block{
margin-top:20px;
}

/*----- h3 -----*/
h3 {
	text-align: left;
	font-size: 12pt;
	margin: 10px auto;
	background-color:#5EB5EC;
	color:#FFFFFF;
	padding: 6px 7px 5px 10px;
/*
	color: purple;
	background-color: #ffcff0;
	border: 1px purple solid;
*/
}
div.h3 { width: 95%; margin: 0 auto; }
div.h3 p { text-indent: 1em; }

/*----- h4 -----*/
h4 {
	font-size: 12pt;
	margin: 5px auto;
}


h4.payment{
	font-size: 12pt;
	margin: 5px auto 7px;
	padding:5px 0;
	border-bottom:1px dotted #666;
}

body {
	font-size:74.5%;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
	color:#333;
	line-height:1.5;
	background: url(../images/bg.gif) repeat-x top;
}


form { margin: 0; padding: 0; }
p { margin:0 0 1em; }
img.c,
button.c,
input.c { display: block; margin: 4px auto; }
div .c img{border:1px #ccc solid}
/*----- その他スタイル -----*/
.img { border: 1px lightgrey solid; }

ul li { list-style-type: none; list-style-position:inside; }
ol li { margin-left:2em; }
ul {  margin: 0; padding: 0; }
tr,th,td { margin: 0; }


.select-name{
font-size:13px;
font-weight:bold;
}

.center{
text-align:center;
}


/*-----------------------------------------------
 __font
-----------------------------------------------*/
.fs2124b{
font-size:21px;
line-height:24px;
font-weight: bold;
}
.fs1824b{
font-size:18px;
line-height:24px;
font-weight: bold;
}
.fs1621b{
font-size:16px;
line-height:21px;
font-weight: bold;
}
.fs1518b{
font-size:15px;
line-height:18px;
font-weight: bold;
}
.fs1314b{
font-size:13px;
line-height:14px;
font-weight: bold;
}
.fs1421{
font-size:14px;
line-height:21px;
}

/*-----------------------------------------------
 __color
-----------------------------------------------*/
.blue{
color:#0033CC;
}
.blue2{
color:#5eb5ec;
}
.orange{
color:#FF6633;
}




/*-----------------------------------------------
 __container
-----------------------------------------------*/

#wrapper {
	width:100%;
	margin:0 auto;
	text-align: center;  
}

#container {
	width:950px;
	margin:15px auto 0;
	text-align: left; 
}


/*-----------------------------------------------
 __topmenu
-----------------------------------------------*/
#topmenu {
	width:950px;
	height:60px;
	margin:0px 0 0px;
	border-right:none;
	clear:both;
	position:relative;
	top:5px;
}
#topmenu li{
	float:left;
}
#topmenu li a{
	text-indent:-9999px;
	display:block;
}
#topmenu li.menu01,#topmenu li.menu01 a{
	width:186px;
	height:60px;
	background:url(../images/topmenu01.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu01 a:hover{
	width:186px;
	height:60px;
	background:url(../images/topmenu01_over.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu02,#topmenu li.menu02 a{
	width:186px;
	height:60px;
	background:url(../images/topmenu02.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu02 a:hover{
	width:186px;
	height:60px;
	background:url(../images/topmenu02_over.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu03,#topmenu li.menu03 a{
	width:186px;
	height:60px;
	background:url(../images/topmenu03.gif) top left no-repeat;
	padding-right:4px;
}
#topmenu li.menu03 a:hover{
	width:186px;
	height:60px;
	background:url(../images/topmenu03_over.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu04,#topmenu li.menu04 a{
	width:186px;
	height:60px;
	background:url(../images/topmenu04.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu04 a:hover{
	width:186px;
	height:60px;
	background:url(../images/topmenu04_over.gif) top left no-repeat;
	padding-right:5px;
}
#topmenu li.menu05,#topmenu li.menu05 a{
	width:186px;
	height:60px;
	background:url(../images/topmenu05.gif) top left no-repeat;
}
#topmenu li.menu05 a:hover{
	width:186px;
	height:60px;
	background:url(../images/topmenu05_over.gif) top left no-repeat;
	padding-right:5px;
}


/*-----------------------------------------------
 __gotop
-----------------------------------------------*/
p.gotop{
margin:0 0 0 830px;
padding:0;
clear:both;
}
p.gotop a{
background:url(../images/gotop.gif) no-repeat right;
text-indent:-9999px;
width:120px;
height:26px;
display:block;
}

p.gotop2{
margin:5px 0 12px;
padding:0;
clear:both;
text-align:right;
}
p.gotop2 a{
text-decoration:underline;
}
p.gotop2 a:hover{
text-decoration:none;
}


/*======================================
 テーブルの装飾用（1パターンのみ）
--------------------------------------*/
table.deco {
	font-size: 9pt;
	border-collapse: collapse;
	margin: 4px auto;
	width:90%;
}
table.deco th {
	font-weight: normal;
	font-size: 9pt;
	padding: 8px 8px;
	background-color: #a6d2ff;
	border: 1px #999 solid;
}
table.deco td {
	text-align: left;
	padding: 8px 8px;
	/*background-color: #fffacd;*/
	border: 1px #999 solid;
}

table.deco2 {
	font-size: 9pt;
	border-collapse: collapse;
	margin: 4px auto;
	width:90%;
}
table.deco2 th {
	font-weight: normal;
	font-size: 9pt;
	padding:2px;
	background-color: #a6d2ff;
	border: 1px #999 solid;
	text-align:center;
}
table.deco2 td {
	text-align: left;
	padding:2px;
	border: 1px #999 solid;
	text-align:center;
}

table.l th,
table.l td {
	text-align: left;
}
table.outline2 {
width:720px;
}
table.outline,table.outline2 {
	margin: 4px auto;
	border-collapse: collapse;
}
table.outline img,table.outline2 img{
border:1px #ccc solid;
}
table.outline td {
	border:1px lightgrey dashed;
	padding:6px 16px;
	vertical-align:top;
	text-align:center;
}
table.outline2 td {
	border:1px lightgrey dashed;
	padding:6px 10px;
	vertical-align:top;
	text-align:center;
}
table.outline td:hover,table.outline2 td:hover {
	background-color: #f0fff0;/*lightgrey;*/
}


/*-----------------------------------------------
 __footer
-----------------------------------------------*/

#footer {
	clear:both;
	width:100%;
	margin:0 auto;
	text-align: center;
	padding:10px 0 15px;
	background-color:#5EB5EC;
	color:#FFFFFF;
}
#footer a{
	color:#FFFFFF;
}
#footer a:hover{
text-decoration:none;
}
#footer-inner{
	width:950px;
	margin:0 auto;
	text-align: left; 
}

#footer ul {
	margin:0 auto 10px;
	text-align:center;
}
#footer ul li {
	display:inline;
}

#footer ul.footermenu li {
	margin-right:5px;
	padding-left:10px;
	line-height:1.1;
	border-left:1px solid white;
}

#footer ul li.utilityHome {
	border-left:0;
}

#footer p#copyright {
	text-align:center;
	margin-bottom:0;
}


/*======================================
 ページトップ用<div>
--------------------------------------*/
#page_top {
	margin-bottom: 4px;
}

/*======================================
 左メニュー用<div>
--------------------------------------*/
#menu {
	width:200px;
	margin:15px 0 0;
}
#menu div {
	margin-bottom: 6px;
}
#menu dl {
	border: 1px #000 solid;
	margin: 0;
	margin-bottom: 7px;
}
#menu dl.mochu {
	border: 1px #0286cb solid;
	background-color:#ffffcc;
	margin: 0;
	margin-bottom: 7px;
}
#menu dt {
	text-align: center;
	background-color: #000;
	color: white;
	padding: 4px;
	font-size: 11pt;
	font-weight:bold;
}
#menu dt.mochu {
	text-align: center;
	background-color: #0286cb;
	color: white;
	padding: 4px;
	font-size: 11pt;
	font-weight:bold;
}
#menu dd {
	margin: 0;
	padding: 3px 0;
}

#menu ul {
	margin: 0;
	padding: 0;
}
#menu dl ul li {
	list-style: circle outside;
	padding:1px 0 1px 0px;
	margin: 0 0 0 20px;
	/*border-bottom:#E7E3E1 1px dotted;*/
}
#menu li {
	font-size: 10pt;
	line-height: 135%;
}
#menu li a {
color:#333333;
}
#menu li a:hover {
color:#333333;
text-decoration:none;
}
#menu .question {
	display: block;
	margin: 0;
	margin-right: 1em;
	font-size: 7pt;
	text-align: right;
}
#menu .image {
	margin: 0;
	margin-bottom: 2px;
	padding: 0;
}
#menu .image li {
	margin: 0;
	padding: 0;
}
#menu .image a {
	display:block;
}
/*======================================
 コンテンツ用
--------------------------------------*/
/*@media screen {*/
	#contents {
		width: 720px;
		margin:7px 0 0 ;
	}
	
	#main {
		float: right;
		width: 720px;
		margin:7px 0 0 ;
		font-size:14px;
		line-height:1.6;
	}
	


/*@media print {
	* {
		border-color: black !important;
		color: black !important;
		background-color: white !important;
	}
	#menu { display: none; }
	input,
	button {
		border: 1px gray solid;
	}
}*/

/*======================================
 ページ目録<ul>
--------------------------------------*/
#page_index {
	text-align: center;
	margin: 4px auto;
}
#page_index li {
	display: inline;
	margin: 0 0.2em;
}
/*----- 注意 -----*/
h2.caution,
h2.notice {
	color: red;
}
p.caution {
	margin: 0;
	text-align:left;
	color: red;
	text-indent: 0 !important;
}
span.caution {
	color: red;
}
/*----- カードの表示方法 -----*/
.card {
	position:relative;
	padding: 0 20px 20px 0;
}
.card .card0 {
	display: block;
	position:relative;
	z-index:10;
}
.card .card1 {
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index:5;
}
.card .card1:hover {
	z-index:15;
}
.card img{
border:1px #ccc solid;
}


/*----- フォルダ -----*/
li.cart a {
	padding: 2px;
	padding-left: 20px;
	background :url('/image/icon/cart.png') no-repeat;
}
li.folder  a{
	padding: 2px;
	padding-left: 20px;
	background :url('/image/icon/folder.png') no-repeat;
}
#menu dl ul li.dustbox a {
	padding: 2px;
	padding-left: 20px;
	background :url('/image/icon/folder.png') no-repeat;
}
#menu dl ul li.box a {
	padding: 2px;
	padding-left: 10px;
	background :url('/images/box.png') no-repeat;
	margin:0;
}
#menu dl ul li.dustbox,#menu dl ul li.box {
	list-style:none;
}

/*----- フロートウィンドウ ------*/
#float_window {
	position: absolute;
	top: 15%;
	left: 15%;
	width: 70%;
	height: 70%;
	border: 2px gray solid;
	display: none;
	overflow: auto;
}
.window {
	background-color: white;
}

/*----- <dl class="list"> -----*/
dl.list    { display: block;  margin: 0; padding: 0; }
dl.list dt { display: inline; margin: 0; padding: 0; }
dl.list dd { display: inline; margin: 0; padding: 0; margin-left: 0.4em; }
dl.list ul { display: inline; margin: 0; padding: 0; }
dl.list li { list-style-type: none; display :inline; }
/*----- <ul class="list"> -----*/
ul.inline    { display: inline; margin: 0; padding: 0; }
ul.inline li { list-style-type: none; display :inline; }

/*----- 注文の手順<ul> -----*/
#order_progress {
	width: 100%;
	height: 2em;
	line-height: 2em;
	margin-bottom: 12px;
	border: 1px gray solid;
	background-color: #ffff90;
}
#order_progress li {
	width: 21%;
	float: left;
	text-align: center;
	padding: 0 2%;
	font-weight: bold;
}
#progress_now {
	background-color: white;
}

/*----- コンテンツメニュー<ul> -----*/
#menu_contents {
	margin:4px;
	text-align: center;
}
#menu_contents li {
	display :inline;
	margin: 0 6px;
}
/*----- 共有中アイコン -----*/
.side_thumbnail {
	position: relative;
}
.side_thumbnail img{
	border:1px solid #ccc;
}
img.side_share {
	position: absolute;
	bottom: 6px;
	right: 8px;
	z-index: 100;
}
.card1 img.side_share {
	right: 12px;
}


/*======================================
 cost.html
--------------------------------------*/
table.cost-t2{
width:720px;
margin:20px 0 0;
font-size:16px;
font-weight:bold;
padding:2px 0 0;
}
table.cost-t3{
width:720px;
border:#333333 1px solid;
margin-bottom:2px;
border-bottom:none;
border-right:none;
font-size:14px;
text-align:center;
}
table.cost-t{
width:720px;
border:#333333 1px solid;
margin-bottom:2px;
border-bottom:none;
border-right:none;
text-align:center;
}

table.cost-t td{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
width:115px;
}
table.cost-t3 td{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
}
table.cost-t th,table.cost-t3 th{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
background-color:#D6E3EB;
font-weight:bold;
}
table.cost-t td.price{
font-size:18px;
font-weight:bold;
color:#FF0000;
width:150px;
}
table.cost-t3 td.price{
font-size:18px;
font-weight:bold;
color:#FF0000;
width:120px;
}
table.cost-t td.cost-name{
font-size:14px;
font-weight:bold;
text-align:left;
width:200px;
background-color:#FFFFD0;
padding:2px 0 2px 7px;
}
table.cost-t3 td.cost-name{
font-size:14px;
font-weight:bold;
text-align:left;
width:240px;
background-color:#FFFFD0;
padding:2px 0 2px 7px;
}

/*======================================
 payment
--------------------------------------*/
table.payment-t{
width:400px;
border:#333333 1px solid;
margin-bottom:4px;
border-bottom:none;
border-right:none;
font-size:14px;
}
table.payment-t td{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
padding:7px;
}
table.payment-t th{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
background-color:#D6E3EB;
font-weight:bold;
padding:7px;
}

table.delivery-t{
width:720px;
border:#333333 1px solid;
margin-bottom:4px;
border-bottom:none;
border-right:none;
font-size:14px;
}
table.delivery-t td{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
padding:7px;
background-color:#FFFFCC;
width:550px;
}
table.delivery-t th{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
background-color:#D6E3EB;
font-weight:bold;
padding:7px;
width:90px;
text-align:center;
}
table.delivery-t td.price{
font-size:18px;
font-weight:bold;
background-color:#FFFFFF;
width:80px;
text-align:right;
}

table.delivery-t2{
width:600px;
border:#333333 1px solid;
margin-bottom:4px;
border-bottom:none;
border-right:none;
font-size:14px;
}
table.delivery-t2 td{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
padding:7px;
}
table.delivery-t2 td.bgy{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
padding:7px;
background-color:#FFFFCC;
}
table.delivery-t2 th{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
background-color:#D6E3EB;
font-weight:bold;
padding:7px;
text-align:center;
}

/*======================================
 paper.html
--------------------------------------*/
table.paper-t{
width:720px;
margin:5px 0 7px;
font-size:12px;
border-top:#333333 1px solid;
border-left:#333333 1px solid;
}
table.paper-t2{
width:350px;
margin:5px 0 7px;
font-size:12px;
border-top:#333333 1px solid;
border-left:#333333 1px solid;
}
table.paper-t th,table.paper-t2 th{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
background-color:#666666;
color:#FFFFFF;
padding:7px;
text-align:center;
font-size:13px;
line-height:18px;
width:335px;
font-weight:normal;
}
table.paper-t td,table.paper-t2 td{
border-bottom:#333333 1px solid;
border-right:#333333 1px solid;
padding:8px;
vertical-align:top;
}

td.tdbg-g{
background-color:#eeeeee;
font-weight:bold;
text-align:center;
width:70px;
}


/*======================================
 order.html
--------------------------------------*/
table.order-t{
width:720px;
}
table.order-t td{
vertical-align:top;
text-align:left;
width:400px;
}
table.order-t th{
width:320px;
}
table.order-t th img{
border:1px #CCCCCC solid;
margin-right:10px;
margin-bottom:10px;
}
table.order-t td img{
border:1px #CCCCCC solid;
margin:7px 0 5px;
}
table.order-t td p{
margin:0 0 7px;
padding:0;
}


/*======================================
 guide.html
--------------------------------------*/
div#guide{
font-size:14px;
border:#CEE9F9 2px solid;
padding:7px;
}

div#guide p{
margin:0 0 10px 0px;
}
div#guide p.ml10{
margin-left:10px;
}

table.guide-t{
width:700px;
vertical-align:top;
}
table.guide-t td{
vertical-align:top;
text-align:left;
width:320px;
}
table.guide-t th{
width:375px;
}

#guide_head_menu{
padding:10px 0 7px;
}


/*======================================
 faq.html
--------------------------------------*/
div#faq h4{
font-size:18px;
border-bottom:#ccc 2px dotted;
padding:5px 0 4px 29px;
margin-bottom:9px;
color:#5EB5EC;
background:url(../images/faq_q_icon.gif) bottom left no-repeat;
}


/*======================================
 create
--------------------------------------*/
h4.create{
	font-size: 12pt;
	margin: 5px auto 0;
	padding:12px 0 0 38px
}
.create-name{
font-weight:bold;
background-color:#FFFFCC;
font-size: 10pt;
}

/*======================================
 data
--------------------------------------*/
table.deco3 {
	font-size: 9pt;
	border-collapse: collapse;
	margin: 5px auto;
	width:100%;
}
table.deco3 th {
	font-size:11pt;
	padding:5px;
	background-color: #e1f0ff;
	border: 1px #999 solid;
}
table.deco3 td {
	text-align: left;
	padding:6px;
	border: 1px #999 solid;
}

table.deco3 ul li{
list-style-position:outside;
list-style-type:disc;
margin:0 0 0 17px;
}

.right{
float:right;
}

.left{
float:left;
}

.kakomi{
border:1px solid #ccc;
margin:7px;
padding:7px;
width:360px;
}

/*======================================
 stamp
--------------------------------------*/
.stamp1-bg{
background:url(../images/stamp1_bg.jpg) right no-repeat;
}
.stamp12-bg{
background:url(../images/stamp12_bg.jpg) right no-repeat;
}
.stamp3-bg{
background:url(../images/stamp3_bg.jpg) right no-repeat;
}


.stamp-select{
	text-align: left;
	font-size: 13pt;
	font-weight: bold;
	margin: 15px auto 10px;
	background-color:#5EB5EC;
	color:#FFFFFF;
	padding: 5px 7px 5px 10px;
}
.stamp-select a{
color:#FFFFFF;
}
.stamp-select a:hover{
color:#FFFFFF;
text-decoration:none;
}
.stamp-other{
margin:0 0 10px;
padding:0;
color:#FF0000;
}
