@charset "utf-8";

/* ======================================

	category.css
	Last Up Date 2013/03/11

 -----------------------------------------
	INDEX
 -----------------------------------------
	1. .product_name

	2. table

	3. .paper

	4. .review_recommend_contents_container

	5. #categoryNavi

========================================== */

/* .product_name
========================================== */
.product_name{
	color: rgb(0, 170, 255);
	font-weight: bold;
	font-size: 108%;
	margin-bottom: 5px;
	line-height: 2.5em;
}
.product_item_navi_wrapper{}
.product_icon{
	float: left;
	display: inline;
}
.product_icon img{}

#item-navi{
	float: left;
	display: inline;
	margin-left: 20px;
}
.item-navi_list{
	list-style: disc inside;
	margin-bottom: 5px;
}
.item-navi_list a{
	text-decoration: none;
}
.item-navi_list a:visited{
	text-decoration: none;
}
.item-navi_list a:hover{
	color: #024DA1;
	text-decoration: underline;
}
.item-navi_list img{}

.cont_subtitle{}

.item-section  {
}
.item-section a, .topic_path_container a {
    position: relative;
    z-index: 10;
}

/*-----------
20130328 追加 修正
-----------*/
div.f_left {
	float: left;
}
div.f_right {
	float: right;
}
span.red{
	color: #F00;
}
.clear {
	clear: both;
}
div.tsr {
	font-size: 108%;
}
div.tsm {
	font-size: 84%;
}
.fon_b {
	font-weight: bold;
}



/* table
========================================== */

/*
 * select
 */
table.select{
	width: 100%;
	margin: 3px 0 10px;
	border-collapse: collapse;
}
table.select th{
    border-bottom: 1px solid #FFF;
    padding: 3px 0;
}

/*-----------
20130328 追加 修正
-----------*/
th.cateTable_th {
	font-weight: bold;
	background: #CCC !important;
}
table.select th.left{
	width: 54%;
	text-align: left;
    padding-left: 10px;
}
table.select th.center{}
table.select th.right{
	border-left: none;
}

/*--  ３カラム(無線綴じ) --*/
table.select th.col3Left01{
    width: 60%;
    text-align: left;
    padding-left: 10px;
}
table.select th.col3Center01{
    width: 25%;
}
table.select th.col3Right01{
    width: 15%;
}

/*--  ３まとめ(ポスト) --*/
table.select td.col3{
	width: 33%;
    font-weight: bold;
	text-align: center;
    padding: 10px 0;
}
table.select td.wid_66p{
    width: 66%;
}

table.select tr.even{
	background-color: #F3F3F3;
}
table.select tr.odd{
	background-color: #E6E6E6;
}
table.select td{
    font-size: 93%;
    border-bottom: solid 1px #FFF;
	padding: 3px 10px;
}
table.select td.name{
	border-right: none;
}
table.select td.size{
	border-left: none;
}

table.tbor th, table.tbor td{
	text-align: center;
	border: 1px solid #000;
}
table.tbor td img{
    padding: 12px 3px;
}

table.tbor tr.tborf td{
    padding: 7px 0;
}




/*
 * sys_pricetable
 */
table.sys_pricetable{
	width: 100%;
	border-collapse: collapse;
}
table.sys_pricetable .sys_pricetable_header th{
	background-color: #B8CEF8;
}
table.sys_pricetable th,
table.sys_pricetable td{
	padding: 5px;
	border: 1px solid #ffffff;
	text-align: center;
	font-size: 88%;
}
table.sys_pricetable td{
	background-color: #F0F0F0;
}



/* .paper
========================================== */
.paper dt{
	border-bottom: 2px solid #FC0;
	padding: 2px 5px;
	color: #333;
	background-color: #FF9;
	margin: 10px 0;
	font-weight: bold;
}
.paper dt:before{
	content: "■";
}


/* .review_recommend_contents_container
========================================== */
.review_recommend_contents_container{
	padding: 0 10px 10px 10px;
	border: solid 1px #333;
	background: #fbf8cd;
	margin: 10px 0;
}
.review_recommend_contents h3.title{
	margin-top: 10px;
}
.review_li{
	width:309px;
	float: left;
	margin: 0 10px;
}
.review_title{
	margin: 10px 0 4px;
	border-bottom: dotted 1px #333;
}
.review_recommend_more_btn{
	text-align: center;
	margin: 1em 0;
}
.review_recommend_more_btn a{
	background-color: #024DA1;
	padding: 3px 1em;
	border-radius: 20px;
	color: #FFF;
	line-height: 20px;
	text-decoration: none;
}
.review_recommend_more_btn a:visited{
	text-decoration: none;
}
.review_recommend_more_btn a:hover{
	text-decoration: underline;
}

.my_favorite_li{
	float: left;
	display: inline;
	width: 139px;
	margin: 5px 0;
}
.my_favorite_text{
	font-size: 93%;
	line-height: 1.4em;
	margin-top: 0.4em;
}

/* #categoryNavi
========================================== */
#categoryNavi li{
	float: left;
}


/*-----------
20130329 デザイン変更のため 追加
主な共通部分
-----------*/
table.youshi {
	width: 100%;
	border-top: 1px solid #000;
	margin: 3px 0 13px;
}
table.youshi td {
    font-size: 90%;
	border-bottom: 1px solid #000;
	padding: 2px;
}
table.youshi td.wid_14p {
    width: 14%;
}

div.op_tit {
    line-height: 26px;
	font-weight: bold;
	background: url("../img/category/opbg.gif");
	margin-bottom: 8px;
	padding-left: 10px;
}
div.prod {
    margin-bottom: 5px;
}
div.prod img{
    vertical-align: middle;
}

table.bro tr th {
    text-align: center;
    background: #BCBDC0;
    padding: 2px;
}
table.bro tr th.left {
    width: 20%;
}
table.bro tr th.cr {
    width: 40%;
    border-left: 6px solid #FFF;
}
table.bro tr td {
    text-align: center;
    padding: 8px 0;
}

div.att {
	color: #FFF200;
	font-weight: bold;
	background: #000;
	padding: 6px;
}
div.cl_bg {
    font-size: 90%;
    line-height: 1.5;
	background: #FBFACF;
	margin-bottom: 12px;
	padding: 6px;
}
div.pan_top {
    clear: both;
     margin: 12px 0;
}

/*-----------
料金|用紙ラインナップ width設定
-----------*/
/* ２分割(1/3バランス) */
.wid_450 {
	width: 450px;
}
.wid_260 {
	width: 260px;
}
.wid_360 {
    width: 360px;
}
.wid_350 {
    width: 350px;
}
/*-- ハガキ用 --*/
.wid_380 {
    width: 380px;
}
/*-----------
各ページ設定
-----------*/
/*-- 背景 --*/
#contents_main .contents .cont .item-section div.pos_re {
  position: relative;
}
#contents_main .contents .cont .item-section div.pos_re .bg_red {
	background: #EE1E3B;
}
#contents_main .contents .cont .item-section div.pos_re .bg_green {
	background: #0A3;
}
#contents_main .contents .cont .item-section div.pos_re .bg_purple {
	background: #949;
}
#contents_main .contents .cont .item-section div.pos_re .bg_pink {
	background: #F07192;
}
#contents_main .contents .cont .item-section div.pos_re .bg_gray {
    background: #818284;
}
#contents_main .contents .cont .item-section div.pos_re .bg_orange {
    background: #F79547;
}
#contents_main .contents .cont .item-section div.pos_re .bg_sky {
    background: #6DD0F6;
}
#contents_main .contents .cont .item-section div.pos_re .bg_blue {
    background: #6DD0F6;
}
#contents_main .contents .cont .item-section div.pos_re .bg_bp {
    background: #5C52A3;
}
#contents_main .contents .cont .item-section div.pos_re .bg_bg {
    background: #6DC7AF;
}
#contents_main .contents .cont .item-section div.pos_re .bg_pp {
    background: #B49671;
}

#contents_main .contents .cont .item-section div.pos_re div p.des {
	width: 405px;
	color: #FFF;
	font-size: 145%;
    line-height: 1.5;
    padding: 12px;
}
#contents_main .contents .cont .item-section div.pos_re div p.des_wide {
    color: #FFF;
    font-size: 145%;
    line-height: 1.5;
    padding: 12px;
}
#contents_main .contents .cont .item-section div.pos_re div p.desf {
    color: #FFF;
    font-size: 145%;
    line-height: 1.5;
    padding: 12px;
}
#contents_main .contents .cont .item-section p.destxt {
	width: 405px;
    min-height: 85px;
    line-height: 1.5;
    padding-top: 10px;
}
#contents_main .contents .cont .item-section p.destxt_long {
    width: 405px;
    min-height: 176px;
    line-height: 1.5;
    padding-top: 10px;
}
#contents_main .contents .cont .item-section p.destxt_wide {
    min-height: 85px;
    line-height: 1.5;
    padding-top: 10px;
}
#contents_main .contents .cont .item-section p.destxt2 {
    width: 375px;
    line-height: 1.5;
    padding-top: 10px;
}
#contents_main .contents .cont .item-section p.destxtf {
    line-height: 1.5;
    padding-top: 10px;
}
#contents_main .contents .cont .item-section div.ye_bg {
    width: 120px;
    text-align: center;
    background: #FFDD00;
    padding: 10px;
}
/*-- オススメ --*/
#contents_main .contents .cont .item-section div.ye_bg p {
    text-align: left;
}
#contents_main .contents .cont .item-section div.sop {
    width: 570px;
}
#contents_main .contents .cont .item-section div.sop p {
    font-size: 85%;
    line-height: 1.5;
}
#contents_main .contents .cont .item-section p.sub_tit{
    font-weight: bold;
    color: #00B5F0;
    font-size: 115% !important;
}
/*-- ハガキ最下部 --*/
#contents_main .contents .cont .item-section p.pc_link{
    margin: 15px 0;
}
/*-- ポスターオススメ --*/
#contents_main .contents .cont .item-section div.yeh_bg {
    width: 320px;
    background: #FFDD00;
    padding: 10px 0 0px 30px;
}
#contents_main .contents .cont .item-section div.yeh_bg p.sub_tit{
    color: #0075B0;
    line-height: 1.1;
    padding: 15px 0 0 90px;
}
/*-- 名刺４コマ --*/
#contents_main .contents .cont .item-section div.kakou4 {
    width: 350px;
    margin-bottom: 10px;
}
#contents_main .contents .cont .item-section div.kakou4 div.bla_bg {
    color: #FFF;
    text-align: center;
    font-weight: bold;
    background: #000;
    padding: 6px 0;
}
#contents_main .contents .cont .item-section div.kakou4 div.suji_frame{
    border: 1px solid #D2D3D5;
    padding: 5px;
}
#contents_main .contents .cont .item-section div.kakou4 p.red_tit{
    color: #ED1164;
    font-size: 120%;
    padding: 3px 0 7px 3px;
}
#contents_main .contents .cont .item-section div.kakou4 p.imgtxt{
    line-height: 1.5;
    padding-left: 117px;
}
#contents_main .contents .cont .item-section div.kakou4 p.kome{
    padding: 2px 0 0px 6px;
}
#contents_main .contents .cont .item-section p.k4komoji {
    font-size: 85%;
    padding: 0 5px 10px;
}
/*-- 封筒注意 --*/
#contents_main .contents .cont .item-section div.cl_bg img.eai1 {
    margin: 5px 25px 5px 40px;
}
#contents_main .contents .cont .item-section div.cl_bg img.eai2 {
    margin: 8px 5px 0 35px;
}

/*-- 封筒色画像 --*/
#contents_main .contents .cont .item-section div.envframe{
    width: 231px;
    border: 1px solid !important;
}
#contents_main .contents .cont .item-section div.gr_bg{
    background: #CCC;
    text-align: center;
    padding: 2px 0;
}

/*-- ポスター対応加工 --*/
#contents_main .contents .cont .item-section ul.tk5 li {
    float: left;
    width: 141px;
    line-height: 1.2;
}
#contents_main .contents .cont .item-section ul.tk5 li div.sub_blu_bg {
    height: 30px;
    color: #FFF;
    font-size: 85%;
    text-align: center;
    background: #0075B0;
    padding: 3px 0px;
}
#contents_main .contents .cont .item-section ul.tk5 li div.frame {
    height: 146px;
    border: 1px solid #CCC;
    padding: 3px;
}
#contents_main .contents .cont .item-section ul.tk5 li div.frame p {
    font-size: 80%;
}
/*-- 訂正シール --*/
div.noticeDescription01 {
    text-align: center;
    background: #FFF;
    padding-bottom: 16px;
}
div.descriptionTitle01 {
    width: 190px;
    font-size: 14px;
    text-align: left;
    font-weight: bold;
    background: #FFDE00;
    margin-bottom: 16px;
    padding: 6px 12px;
}
div.noticeDescription02 {
    text-align: center;
    padding-bottom: 28px;
}
div.descriptionTitle02 {
    border-bottom: 1px solid #000;
    margin-bottom: 16px;
}
div.descriptionTitle02 div {
    width: 190px;
    color: #FFF;
    font-size: 14px;
    text-align: left;
    font-weight: bold;
    background: #000;
    padding: 6px 12px;
}


/*-----------
説明画像位置
-----------*/
img.des_img {
  position: absolute;
  top: 10px;
  right: 10px;
}

div.redok{
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: #FFF;
    font-size: 85%;
    background: #EE1C25;
    padding: 2px 10px;
}
div.redok02 {
    position: absolute;
    bottom: 52px;
    right: 10px;
    color: #FFF;
    font-size: 85%;
    background: #EE1C25;
    padding: 2px 10px;
}

/*-----------
調整
-----------*/
/* font */
.komoji {
    font-size: 80%;
}
.bold {
    font-weight: bold;
}
.txt_red {
    color: #F00;
}
.txt_ylw {
    color: #FFDE00;
}
.txt_c{
    text-align: center;
}

.lh_15{
    line-height: 1.5;
}
.lh_14{
    line-height: 1.4;
}
.lh_28{
    line-height: 28px;
}
/* space */
.mgb_0 {
    margin-bottom: 0 !important;
}
.mgt_5 {
    margin-top: 5px;
}
.mgt_16 {
    margin-top: 16px;
}
.mgt_20 {
    margin-top: 20px;
}
.mgb_50 {
    margin-bottom: 50px;
}
.mgb_30 {
    margin-bottom: 30px;
}
.mgb_20 {
    margin-bottom: 20px;
}
.mgb_10 {
    margin-bottom: 10px;
}
.mgtb_20 {
    margin: 20px 0;
}
.mgb_75 {
    margin-bottom: 75px;
}
.mgtb_10{
    margin: 10px 0;
}
.mgrl_3{
    margin: 0 3px;
}
.mgrl_10 {
    margin: 0 10px;
}
.nmgl_10 {
    margin-left: -10px;
}
.pdtb_5{
    padding: 5px 0;
}
.pdrl_3 {
    padding: 0 3px;
}