@charset "UTF-8"; 

.pc_only{
   display: block;
}

.sp_only{
   display: none;
}

@media screen and (max-width: 480px) {

.pc_only{
   display: none;
}

.sp_only{
   display: block;
}

}
/*TOPページ特集*/
h3.ttl-h3 {
    margin-bottom: 1em;
    text-align: left;
    background: #f6f7fa;
    padding: 0.5em 0 0.5em 0.5em;
    border-left: solid 7px #cdd3e5;
    font-weight: 700;
    font-size: 16px;
}
.thumbnails-area{
    position: relative;
}

.thumbnails-area.new::before {
    content: "NEW";
    position: absolute;
    background: #e43c00;
    left: 0;
    top:0;
    color: #ffffff;
    padding: 0.1em 0.5em;
    border-radius: 5px 0 5px 0;
    font-size: 0.8em;
    box-shadow: 2px 2px 7px #00000038;
}
/**/

/********** free_page **********/
/** guide_side **/

.side_ban_img{}

.side_ban_img a{
  display: block;
  margin-bottom: 10px;
  line-height: 0px;
}


/*sp*/
@media screen and (max-width: 480px) {
.side_ban_img img{
	width:100%;
}

}    



/********** topic **********/
.news-block{
	margin-bottom: 40px;
	padding:0 5px 10px 5px;
}

.news-title{
	margin-bottom: 20px;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.5em;
}

.supplement{
	border: 1px solid #999999;
	background-color: #f2f2f2;
	padding: 10px;
	font-size: 12px;
	line-height: 20px;
}

.ta_C{
	text-align: center;
}
.ta_L{
	text-align: left;
}

.style_dashed{
	border-top: 1px dotted #DDDDDD;
}

a.special-btn {
    display: inline-block;
    padding: 0.5em 4em;
    text-decoration: none;
    color: #ffffff;
    background-color: #18003b;
    border-radius: 3px;
    transition: .4s;
    font-weight: bold;
}

/*sp*/
@media screen and (max-width: 480px) {

.news-title{
	margin-bottom: 15px;
	font-weight: bold;
	font-size: 15px;
	line-height: 22px;
}

}


/********** 注文履歴 **********/
/*** bizhistory.aspx  history.aspx ***/
/*** bookmark.aspx  bookmarkgroup.aspx ***/


.mutual_btn{
    display: inline-block;
    vertical-align: text-bottom;
}


.mutual_btn a {
	color: #003780;
    text-decoration: none!important;
    font-weight: 700;
    padding-left: 12px;
    margin-left: 5px;
    background: url(/img/guide/icon_arrow.gif) no-repeat 0px 7px;
}


/********** カテゴリー **********/
/**** category.aspx ***/


.cp_tab *, .cp_tab *:before, .cp_tab *:after {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cp_tab {
	margin: 1em auto;
	text-align: center;
}
.cp_tab > input[type='radio'] {
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	outline: none;
	background: none;
	-webkit-appearance: none;
	        appearance: none;
	display: none;
}
.cp_tab .cp_tabpanel {
	display: none;
}
.cp_tab > input:first-child:checked ~ .cp_tabpanels > .cp_tabpanel:first-child,
.cp_tab > input:nth-child(3):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(2),
.cp_tab > input:nth-child(5):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(3),
.cp_tab > input:nth-child(7):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(4),
.cp_tab > input:nth-child(9):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(5),
.cp_tab > input:nth-child(11):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(6) {
	display: flex;
    flex-wrap: wrap;
}
.cp_tab > label {
	display: inline-block;
    cursor: pointer;
	padding: 10px 10px;
    color: #666;
    background-color: #cdd3e5;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    text-decoration: none;
    font-weight: 700;
    z-index: 3;
	width: 195px;
	text-align: center;
	border-left: #f3f4f7 solid 1px;
    border-right: #f3f4f7 solid 1px;
}

.cp_tab.top > label {
	display: inline-block;
    cursor: pointer;
    padding: 10px 5px;
    color: #666;
    background-color: #cdd3e5;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    text-decoration: none;
    font-weight: 700;
    z-index: 3;
    width: 191px;
    text-align: center;
    border-left: #f3f4f7 solid 1px;
    border-right: #f3f4f7 solid 1px;
}

.cp_tab > label:hover,
.cp_tab > input:focus + label {
	color: #919292;
	background-color: #d9ddeb;
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.cp_tab > input:checked + label {
	display: inline-block;
    cursor: pointer;
    background-color: #fff;
    color: #e43c00;
    border-left: #f3f4f7 solid 1px;
    border-right: #f3f4f7 solid 1px;
    opacity: 1;
	text-align: center;
}

.cp_tab.top > input:checked + label {
	display: inline-block;
    cursor: pointer;
    background-color: #fff;
    color: #e43c00;
    border-left: #f3f4f7 solid 1px;
    border-right: #f3f4f7 solid 1px;
    opacity: 1;
	text-align: center;
	box-shadow: 0 -4px 7px 0 rgba(0, 0, 0, .08);
}

.cp_tab .cp_tabpanel {
	padding: 20px 15px 10px 15px;
    background: #fff;
    box-shadow: 0 0 1px #dbdbdb;
    z-index: 2;
    border-radius: 0px 0px 7px 7px;
}

.cp_tab.top .cp_tabpanel {
	padding: 20px 15px 10px 15px;
    background: #fff;
    box-shadow: 0 0 1px #dbdbdb;
    z-index: 2;
    border-radius: 0px 0px 7px 7px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
}
.cp_tab > input:checked + label.category_tab01::before {
  content: '';
    display: inline-block;
    width: 16px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_01_on.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

.cp_tab > label.category_tab01::before {
  content: '';
    display: inline-block;
    width: 16px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_01_off.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

.cp_tab > input:checked + label.category_tab02::before {
  content: '';
    display: inline-block;
    width: 12px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_02_on.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

.cp_tab > label.category_tab02::before {
  content: '';
    display: inline-block;
    width: 12px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_02_off.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

.cp_tab > input:checked + label.category_tab03::before {
  content: '';
    display: inline-block;
    width: 18.6px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_03_on.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

.cp_tab > label.category_tab03::before {
  content: '';
    display: inline-block;
    width: 18.6px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_03_off.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}


.cp_tab > input:checked + label.category_tab04::before {
  content: '';
    display: inline-block;
    width: 18px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_04_on.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

.cp_tab > label.category_tab04::before {
  content: '';
    display: inline-block;
    width: 18px;
    height: 14px;
    background-repeat: no-repeat;
    background-image: url(/img/category/category_04_off.png);
    background-size: contain;
    vertical-align: middle;
    margin-right: 3px;
}

@media (max-width: 480px) {
	.cp_tab {
		width: 100%;
		font-size: 0.8em;
	}
	.cp_tab label {
		padding: 0.5em;
	}
}

.cp_tab label{ margin: 0;}


.category-block{
	text-align: left;
}

.category-block a ul{
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
	
.category-block a:hover ul{
	background-color: #f6f7fa;
}	
	
.category-block a h3{
 font-size: 14px;
 font-weight: bold;
 color: #003780;
 line-height: 18px;
 display: table-cell;
 vertical-align: middle;
 height: 50px;
 -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}

.category-block a:hover h3{
	color: #4a93c9;
}

.category-block ul{
	display: flex;
    width: 243px;
    padding: 10px;
    margin: 0 5px 10px 5px;
    border: 2px solid #CDD3E5;
    border-radius: 5px;
}

.cp_tab.top .category-block ul {
    display: flex;
    width: 237px;
    padding: 10px;
    margin: 0 5px 10px 5px;
    border: 2px solid #CDD3E5;
    border-radius: 5px;
}

.category-block ul .li-img{
	float: left;
	list-style: none;
	display:table-cell;
	width:50px;
}
	
.category-block ul .li-img img{
width: 50px;
}

.category-block ul .li-txt{
	float: right;
	list-style: none;
	display:table-cell;
	padding: 0 0 0 10px;
    width: 158px;
}

/********** 見積履歴 **********/
p.chk_label_{
    margin: 0px 10px;
}

.flg_add_popup { 
	display:none;
	position: absolute; 
	top: -35px; 
	line-height: 1.8em; 
	left: -15px; 
	width: 224px; 
	height: 228px; 
	padding: 0px; 
	margin: 0px;
  }
.flg_del_popup { 
	display:none;
	position: absolute; 
	top: -35px; 
	line-height: 1.8em; 
	left: -15px; 
	width: 224px; 
	height: 228px; 
	padding: 0px; 
	margin: 0px;
	}

@media screen and (max-width: 480px) {
 .flg_add_popup { 
	display:none;
	position: absolute; 
	line-height: 1.8em; 
	left: 100px;
    width: 224px;
    height: 228px;
    padding: 0px;
    margin: 0px;
    top: -40px;
  }
.flg_del_popup { 
	display:none;
	position: absolute; 
	line-height: 1.8em; 
	left: 100px;
    width: 224px;
    height: 228px;
    padding: 0px;
    margin: 0px;
    top: -40px;
	}
}

.estimate_flg_add {
	/* width: 20px; */
	/* float: left; */
	position:relative;
}


.estimate_r_list_navisort_{
	display: flex;
    align-items: center;
    justify-content: space-between;
}

.estimate_r_list_navisort_ .navisort_.font-size13{
	margin: 0 2px;
    color: #222;
    padding: 0;
    width: auto;
    border: none;
}

.estimate_r_list_navisort_ .navisort_.font-size13 dt{
	float: left;
    text-align: right;
    font-weight: bold;
    width: auto;
}

.estimate_r_list_navisort_ .navisort_.font-size13 dd{
    margin-left: 7.8em;
}

.estimate_r_list_navisort_ .navisort_ a{
    margin: 0 2px;
    color: #222;
    text-decoration: underline;
}

/*** Edge のみ適用 ***/
@supports (-ms-ime-align: auto) {
.input_40{
	width: 320px;
}

.input_30{
	width: 240px;
}

.input_25{
	width: 200px;
}

.input_15{
	width: 120px;
}

.input_10{
	width: 40px;
}

.matter_details .input_10{
	width: 200px;
}

.formdetail_.estimate_r_ td input[type='text']
, .formdetail_.estimate_r_ td textarea{
	width: 80%;
	
}

td.estimate_list_ .datepicker_.hasDatepicker {
    width: 120px;
}

}



/**********カタログ***********/
.catalog-mt10{
	margin:10px auto 0 auto;
display:block;
}
	
	
@media screen and (min-width: 481px) { 
.catalog-group{
	width: 50%;
	margin-bottom: 30px;
	text-align: center;
	float: left;	
}
	
.main-container {
    margin: 10px auto 50px auto;
    padding: 0 10px;
}

.main-container h1 {
    font-weight: bold;
    font-size: 1.6rem;
    margin: 30px 0 40px;
    color: #18003B;
    padding-bottom: 16px;
    border-bottom: 1px solid #18003B;
}

.main-container h2 {
    font-weight: bold;
    font-size: 28px;
    margin: 0 0 5px;
}

.main-container h3 {
    font-size: 1rem;
    margin-left: 1rem;
    padding: 0 0 5px 5px;
    font-weight: bold;
}

.text_contents {
    margin: 0 0 3em 0;
    padding-left: 0px;
}

.text-second {
    padding: 20px;
}

.text_contents p {
    padding-left: 0px;
}

.datagrid table {
  border-collapse: collapse;
  text-align: left;
  width: 100%;
}

.datagrid {
  overflow: hidden;
  border: 1px solid #222222;
  margin: 10px 20px;
}

.datagrid table td, .datagrid table th {
  padding: 3px 0px;
}

.datagrid table thead th {
  background-color: #f6f7fa;
  font-weight: bold;
  border-bottom: 1px solid #222222;
  border-left: 1px solid #222222;
  padding: 4px;
}

.datagrid table thead th:first-child {
  border-left: none;
}

.datagrid table tbody td {
  color: #222222;
  border-left: 1px solid #222222;
  border-bottom: 1px solid #222222;
  padding: 4px;
}

.datagrid table tbody td:first-child {
  border-left: none;
}

.datagrid table tbody tr:last-child td {
  border-bottom: none;
}   
}
.main-container h2.catalog-tit:before {
    content: "";
    /* display: inline-block; */
    width: 1em;
    height: 1em;
    /* background: url(/img/top/catalog_search_icon.png) no-repeat; */
    background-size: contain;
    margin-left: -1em;
    vertical-align: middle;
}
	.catalog-tit {
    position: relative;
    /* display: inline-block; */
    padding: 9px 7px 8px 1em;
    margin-bottom: 25px;
    font-weight: 700;
    box-sizing: border-box;
}
a.catalog-btn {
    display: inline-block;
    padding: 0.5em 4em;
    text-decoration: none;
    color: #ffffff;
    background-color: #e43c00;
    border-radius: 3px;
    transition: .4s;
    font-weight: bold;
}
a.catalog-btn:hover{
  background: #e43c00cc;
  color: white;  
}
p.catalog-img {
    width: 340px;
    height: auto;
    margin: 10px auto 30px auto;
}
p.catalog-btn-area {
    text-align: center;
    margin: 2em 0;
}

#aside .aside-category{
padding-bottom:28px;
}


/*****1111追加******/
.free_tit {
    position: relative;
    display: inline-block;
    margin-bottom: 25px;
    font-weight: 700;
    box-sizing: border-box;
    margin-top: 9px;
    line-height: 1.5em;
}

@media screen and (max-width: 480px) {
.free_tit {
    position: relative;
    display: inline-block;
    margin-bottom: 25px;
    font-weight: 700;
    box-sizing: border-box;
    margin-bottom: 15px;
    font-size: 18px;
    color: #222;
    margin-top: 0px;
}
}


.online-call {
    margin: 15px auto 15px auto;
    text-align: center;
}













/*sp*/
@media screen and (max-width: 480px) {
.catalog-tit {
    position: relative;
    padding: 0 7px 0 1em;
    margin-bottom: 25px;
    font-weight: 700;
    box-sizing: border-box;
}


.catalog-group{
	width: 90%;
	margin: 0 auto 40px auto;
	text-align: center;
}
	
	
.main-container {
    margin: 0 0 30px;
}

.main-container h1 {
    font-weight: bold;
    font-size: 1.2rem;
    margin: 30px 0;
    color: #18003B;
    padding-bottom: 6px;
    border-bottom: 1px solid #18003B;
}

.main-container h2 {
    font-weight: bold;
    font-size: 121%;
    margin-bottom: 10px;
    text-align: left;
}

.main-container h3 {
}

.text_contents {
    margin: 0 10px 30px;
   text-align: left;
}

.text-second {
    padding: 20px;
}

.text_contents p {
}
    
.datagrid table {
  border-collapse: collapse;
  text-align: left;
  width: 100%;
}

.datagrid {
  overflow: hidden;
  margin: 10px;
}

.datagrid table td, .datagrid table th {
  padding: 3px 0px;
}

.datagrid table thead th {
  background-color: #f6f7fa;
  font-weight: bold;
  border: 1px solid #222222;
  padding: 4px;
}

.datagrid table thead th:first-child {
  /*border: none;*/
}

.datagrid table tbody td {
  color: #222222;
  border: 1px solid #222222;
  padding: 2px 4px;
}

.datagrid table tbody td:first-child {
  /*border-left: none;*/
}

.datagrid table tbody tr:last-child td {
  /*border-bottom: none;*/
}   
p.catalog-btn-area {
    text-align: center;
}
	a.catalog-btn {
    width: 100%;
    padding: 0.5em 0;
}
	p.catalog-img {
    width: 100%;
    height: auto;
    margin: 10px auto;
}
/*アウトレットセールバナー*/
 .campaign-bnr-area {
	  text-align: center;
	  margin: 1em 0;
	  display: flex;
	}
  .outlet_bnr img{
	  height: 80px;
	  margin-right: 1%;
	}
  .campaign_bnr01 img{
	  height: 80px;
	  margin-right: 1%;
	}
  .campaign_bnr02 img{
	  height: 80px;
	}
	.r-7{
		border-radius: 7px;
	}
	
	.outlet_bnr-area {
    display: flex;
    width: 572px;
    height: 80px;
    background: #dfdfdf;
    border-radius: 7px;
    margin-right: 1%;
    border: solid #f29002 2px;
    box-sizing: border-box;
}

.outlet_bnr-left-area {
    width: 30%;
    border-radius: 3px 0 0 3px;
    position: relative;
    background-image: linear-gradient(90deg, rgba(245, 88, 33, 1) 23%, rgba(242, 145, 2, 1));
    background: #f29002;
}
.outlet_bnr-left-area img{
    position: absolute;
    top: 2px;
}
.outlet_bnr-left-area .date-area {
    background: #ffffff;
    display: inline-block;
    margin-top:40px;
}
.outlet_bnr-left-area .date-area p{
    font-size: 16px;
    font-weight: 700;
    padding: 0.3em 1.5em;
}
.outlet_bnr-right-area {
    width: 70%;
    display: flex;
    text-align: left;
    
}
.outlet_bnr-right-area .img-area {
    width: 65%;
    padding-left: 1%;
}
.outlet_bnr-right-area .img-area img {
    width: 24%;
    margin: 2.5% 1%;
    vertical-align: middle;
}
.img-area span {
    font-weight: 700;
    color:#cccccc;
}
	.hinmoku-area {
    width: 35%;
    text-align: center;
}
.hinmoku-area p {
    font-weight: 700;
    font-size: 14px;
    margin-top: 3px;
    line-height: 1.3em;
    color: #18003b;
}

.hinmoku-area a {
    display: inline-block;
    color: #ffffff;
    background: #18003b;
    padding: 0.1em 1em;
    border-radius: 3px;
    margin-top: 6px;
    font-size: 0.8em;
}