﻿@charset "UTF-8";

#container {
  margin-top:15px;
	margin-bottom: 40px;
}

/* ///////////////////////////////////////////////////////////////////

side_l

/////////////////////////////////////////////////////////////////// */
#side_l {
	float:left;
	width:183px;
	text-align:center;
}
#kakaku {
  font-size:70%;
}
#kakaku img,
#kakaku input {
  margin-top: 10px;
}
#benri img,
#kakaku input {
  margin-bottom: 3px;
}
#calendar {
	border-collapse: collapse;
	width:173px;
	margin:10px auto 20px auto;
	border:1px solid #ccc;
}
#calendar table {
	width:169px;
	margin:10px auto 0 auto;
	font-weight:bold;
}
#calendar .month {
	width:169px;
	margin:10px auto;
	height:30px;
}
#calendar .month p {
	float:left;
	line-height:28px;
}
#calendar .month p.c_date {
	width:105px;
	font-size:18px;
	font-weight:bold;
}
#calendar table th,
#calendar table td {
	border:1px solid #b1b1b1;
	width:23px;
}
#calendar table td {
	font-size:14px;
	line-height:24px;
}
#calendar table .sun {
	color:#db0e16;
}
#calendar table .sat {
	color:#0061b3;
}
#calendar table .today {
	background-color:#8fbc8f;
}
#calendar table .holiday {
	background-color:#f7b2b7;
}
p.holiday {
	text-align:right;;
	margin-bottom:10px;
}
p.holiday span {
	color:#f7b2b7;
}
#calendar dl {
	text-align:left;
	margin:0px 5px 5px 5px;
}
#calendar dl dt {
	font-weight:bold;
  text-align:left;
  margin-bottom:2px;
}
#door p {
	margin:10px auto;
}
/* ///////////////////////////////////////////////////////////////////

main

/////////////////////////////////////////////////////////////////// */

#main {
	float:left;
	width:827px;
}
#orders,
#request,
#news,
#pickup,
#tool {
	width:787px;
	margin:10px auto 30px auto;
}
#orders h2,
#request h2,
#news h2 {
	float:left;
	color:#333;
	font-size:24px;
	line-height:34px;
	border-left:solid 5px #ec6941;
  padding: 0 0 0 10px;
  margin: 0 0 10px 0;
}
#pickup h2,
#tool h2 {
  background:url("../img/common/tl_line.png") no-repeat left bottom;
	height:30px;
	line-height:30px;
	font-size:14px;
	padding-left:10px;
	margin-bottom:10px;
}

#orders p.tblcob,
#request p.tblcob,
#news p.tblcob {
	float:right;
	text-align:right;
	margin-top:5px;
	font-size:10px;
}
#orders p.tbllink,
#request p.tbllink,
#news p.tbllink {
	width:100%;
	text-align:right;
	margin-bottom:20px;
}
#orders table,
#request table,
#news table {
	clear:both;
	width:787px;
	font-size:12px;
	margin:8px auto 15px auto;
}
#orders .nodata {
  clear:left;
}

/* =========================================================
orders
========================================================= */
#orders table {
	text-align:center;
}

#orders table thead {
	background-color:#efefef;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	display:block;
}
#orders table thead th {
	height:27px;
	vertical-align:middle;
}


#orders table thead th,
#orders table tbodt td {
	table-layout:fixed;
}
#orders table tbody {
	display:block;
  overflow-y:scroll;
  max-height:175px;
}
#orders table tbody tr.line {
	border-bottom:1px solid #ccc;
}
#orders table td {
	height:27px;
	vertical-align:middle;
}
#orders table .ot_date {
	width:45px;
}
#orders table .ot_no {
	width:80px;
	text-align:center;
}
#orders table td.ot_no {
	font-family: 'Ricty Diminished', 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif;
	font-size:120%;
}
#orders table .ot_name {
	max-width:230px;
	width:230px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#orders table .ot_datqua {
	width:40px;
}
#orders table .ot_price {
	width:80px;
}
#orders table .ot_status {
	width:100px;
}
#orders table .ot_charge {
	width:70px;
}
#orders table .ot_matter {
	width:60px;
}
#orders table .ot_send {
	width:65px;

}

/* =========================================================
request
========================================================= */
#request table thead {
  background-color: #efefef;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  display: block;
  font-weight:bold;
}
#request table thead th {
  height: 27px;
  vertical-align: middle;
}
#request table tbody {
	border-top:1px solid #ccc;
	display:block;
  overflow-y:scroll;
  max-height:175px;
}
  #request table tbody tr.line {
    border-bottom: 1px solid #ccc;
  }
#request table td {
	height:27px;
	vertical-align:middle;
}
#request table .rt_new {
  width: 50px;
  /*min-width: 50px;*/
  text-align: center;
}
#request table .rt_new span {
	background-color:#FF6600;
	color:#fff;
	font-size:8px;
	font-weight:bold;
	padding:1px 4px;
}
#request table .rt_date {
	width:50px;
  /*min-width:50px;*/
}
  #request table .rt_no {
    width: 80px;
    /*min-width: 80px;*/
  }
#request table .rt_type {
	width:100px;
}
#request table .rt_name {
  /*min-width:120px;*/
	max-width:217px;
	width:217px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
	text-align:left;
}
#request table .rt_su {
  width: 40px;
}
#request table .rt_memo {
  width: 90px;
}
#request table .rt_charge {
	width:120px;
}
/* =========================================================
news
========================================================= */
#news table tbody {
	border-top:1px solid #ccc;
}
#news table tbody tr {
	border-bottom:1px solid #ccc;
}
#news table td {
	height:27px;
	vertical-align:middle;
}
#news table .nt_new {
	width:50px;
	text-align:center;
}
#news table .nt_new span {
	background-color:#FF6600;
	color:#fff;
	font-size:8px;
	font-weight:bold;
	padding:1px 4px;
}
#news table .nt_date {
	width:50px;
}
#news table .nt_type {
	width:180px;
}
#news table .nt_name {
	max-width:387px;
	width:419px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
	text-align:left;
}
#news table .nt_charge {
	width:120px;
}

/* =========================================================
pickup
========================================================= */
/*
#pickup #pslider {
	width:744px;
	margin:20px auto 40px auto;
}
#pickup .pickupitem {
	width:186px;
	float:left;
	margin:5px 5px 0px 5px;

}
*/
#pickup .pickupitem {
    width: 186px;
    float: left;
    margin: 5px 5px 0px 5px;
}

.pickupitem ul{
	list-style:none;
	font-size:13px;
	color:#000;
	padding-left: 0;
}
.pickupitem a{
text-decoration: none;
}

.pickupitem_img{
	padding-left: 13px;
}

.pickupitem li{
	margin: 2px 0;
	text-align:left;
}

/* =========================================================
tool
========================================================= */
#tool .toolbox {
	margin:0 20px;	
}
#tool .toolbox p {
	float:left;
	border:2px solid #ccc;
	text-align:center;
	margin:5px 15px;
}
#tool .toolbox a {
	display:block;
	margin:auto;
	width:116px;
	height:116px;
	line-height:116px;
}


/* ///////////////////////////////////////////////////////////////////

login

/////////////////////////////////////////////////////////////////// */

#login {
 width:500px;
 margin:50px auto;
 border:2px solid #ccc;
}
#login dl {
  margin:40px 30px;
}
#login dt {
  margin-top:15px;
  margin-bottom:3px;
}
#login dd input {
  width:420px;
  border:0;
  padding:10px;
  font-size:1.3em;
  font-family:Arial, sans-serif;
  color:#666;
  border:solid 1px #ccc;
  margin:0 auto 5px 0 ;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
  -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
}
#login dd input:focus {
    border:solid 1px #2f6f00;
}
#login p {
 width:500px;
 margin:30px auto;
 text-align:center;
}
#login p input {
  padding:5px 10px;
}
/* ///////////////////////////////////////////////////////////////////

lostpass

/////////////////////////////////////////////////////////////////// */
#lostpass .lostpassbox {
 width:500px;
 margin:50px auto;
 border:2px solid #ccc;
}
#lostpass .lostpassbox dl {
  margin:40px 30px;
}
#lostpass .lostpassbox dt {
  margin-top:15px;
  margin-bottom:3px;
}
#lostpass .lostpassbox dd input {
  width:420px;
  border:0;
  padding:10px;
  font-size:1.3em;
  font-family:Arial, sans-serif;
  color:#666;
  border:solid 1px #ccc;
  margin:0 auto 5px 0 ;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
  -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
}
#lostpass .lostpassbox dd input:focus {
    border:solid 1px #2f6f00;
}
#lostpass .lostpassbox p {
 width:500px;
 margin:30px auto;
 text-align:center;
}
#lostpass .lostpassbox p input {
  padding:5px 10px;
}
.white-popup {
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 700px;
    margin: 20px auto;
}
dl.popnews dl {
  padding-bottom:30px;
}
dl.popnews dt {
  margin-top:15px;
  margin-bottom:5px;
  font-weight:bold;
  border-bottom:1px solid #ccf;
  padding-bottom:3px;
}
dl.popnews dd {
  margin-left:10px;
}

/* -----------------------------------------------------------
    CSS追加分
----------------------------------------------------------- */

/* -----------------------------------------------------------
    TOP
----------------------------------------------------------- */
#orders, #request, #news, #pickup, #tool {
    width: auto;
    margin: 10px 190px 30px 210px;
}

#orders table, #request table, #news table {
    width: 100%;
}

#pickup .pickupitem {
    width: 23%;
    text-align: center;
}

#pickup h2, #tool h2 {
    border-bottom: 1px solid #DDD;
}

#orders table tbody tr.line {
    display: block;
}

#request table tbody tr {
    display: block;
}

#pickup h2, #tool h2 {
    background: none;
    border-bottom: 4px solid #DDD;
    position: relative;
}

#pickup h2:after ,#tool h2:after {
    width: 200px;
    content: "";
    border-bottom: 4px solid #ec6941;
    position: absolute;
    bottom: -4px;
    left: 0;
}

@media screen and (min-width: 1600px) {

  #orders table .ot_date {
    width: 65px;
  }

  #orders table .ot_no {
    width: 120px;
  }

  #orders table .ot_name {
    max-width: 350px;
    width: 350px;
  }

  #orders table .ot_datqua {
    width: 60px;
  }

  #orders table .ot_price {
    width: 100px;
  }

  #orders table .ot_status {
    width: 120px;
  }

  #orders table .ot_charge {
    width: 100px;
  }

  #orders table .ot_matter {
    width: 300px;
  }

  #orders table .ot_send {
    width: 65px;
  }

  #request table .rt_new {
    width: 50px;
  }


  #request table .rt_date {
    width: 65px;
  }

  #request table .rt_no {
    width: 100px;
  }

  #request table .rt_type {
    width: 150px;
  }

  #request table .rt_name {
    max-width: 650px;
    width: 650px;
  }

  #request table .rt_charge {
    width: 200px;
  }
}



/* -----------------------------------------------------------
    TOKAI 
----------------------------------------------------------- */
#tokai_login #main,
#tokai_login #side_l,
#tokai_login #side_r { display: none;}
#tokai_main {font-family: 'Noto Sans JP', sans-serif; font-weight: 400; font-size: 16px;}
#tokai_main .cate_parent { margin: 2% 0;}
#tokai_main .cate_child { margin: 2% 1%; padding: 3% 0; border-radius: 10px;}
#tokai_main .cate_child { background: #f3f7fa;}
#tokai_main h3 { position: relative; margin: 0 1%; padding: 0 0 0 30px; color: #373e58; font-size: 20px; font-weight: 500;}
#tokai_main h3::before {
    display: block; clear: both; content:"";
    position: absolute; top:0; left: 0;
    width: 10px; height: 23px;
    background: #000;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
#tokai_main .cate_parent h3::before { background:#189e45;}
#tokai_main .cate_child h3::before { background:#009ce5;}
#tokai_main ul { clear: both; margin: 0; overflow: hidden; list-style: none;}
#tokai_main ul li { 
    float:left;
    margin: 1%;
    width:18%;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}
#tokai_main ul li a { display: block; color: #373e58; text-decoration: none; box-sizing: border-box;}
#tokai_main ul li a:hover,
#tokai_main ul li a.active { color: #fff !important;}
#tokai_main .cate_parent ul li a { 
    padding: 30px 10px 30px 80px;
    height: 80px; 
    background-repeat: no-repeat; background-position: 15px center; background-size:50px auto;
}
#tokai_main ul li.cate_p01 a { background-image: url("../img/TOP/tokai_cate01.svg"); }
#tokai_main ul li.cate_p02 a { background-image: url("../img/TOP/tokai_cate02.svg"); }
#tokai_main ul li.cate_p03 a { background-image: url("../img/TOP/tokai_cate03.svg"); }
#tokai_main ul li.cate_p04 a { background-image: url("../img/TOP/tokai_cate04.svg"); }
#tokai_main ul li.cate_p05 a { background-image: url("../img/TOP/tokai_cate05.svg"); }
#tokai_main ul li.cate_p06 a { background-image: url("../img/TOP/tokai_cate06.svg"); }
#tokai_main ul li.cate_p07 a { background-image: url("../img/TOP/tokai_cate07.svg"); }
#tokai_main ul li.cate_p08 a { background-image: url("../img/TOP/tokai_cate08.svg"); }
#tokai_main ul li.cate_p09 a { background-image: url("../img/TOP/tokai_cate09.svg"); padding: 15px 10px 25px 80px;}
#tokai_main ul li.cate_p10 a { background-image: url("../img/TOP/tokai_cate10.svg"); }
#tokai_main ul li.cate_p11 a { background-image: url("../img/TOP/tokai_cate11.svg"); }
#tokai_main ul li.cate_p12 a { background-image: url("../img/TOP/tokai_cate12.svg"); }
#tokai_main ul li.cate_p13 a { background-image: url("../img/TOP/tokai_cate13.svg"); }
#tokai_main ul li.cate_p01 a:hover,
#tokai_main ul li.cate_p01 a.active { background-color: #00b1c3;}
#tokai_main ul li.cate_p02 a:hover,
#tokai_main ul li.cate_p02 a.active { background-color:#6c9bd2;}
#tokai_main ul li.cate_p03 a:hover,
#tokai_main ul li.cate_p03 a.active { background-color:#8e81bb;}
#tokai_main ul li.cate_p04 a:hover,
#tokai_main ul li.cate_p04 a.active { background-color:#57b66f;}
#tokai_main ul li.cate_p05 a:hover,
#tokai_main ul li.cate_p05 a.active { background-color:#f2983a;}
#tokai_main ul li.cate_p06 a:hover,
#tokai_main ul li.cate_p06 a.active { background-color:#cf853f;}
#tokai_main ul li.cate_p07 a:hover,
#tokai_main ul li.cate_p07 a.active { background-color:#ed85a0;}
#tokai_main ul li.cate_p08 a:hover,
#tokai_main ul li.cate_p08 a.active { background-color:#dc76aa;}
#tokai_main ul li.cate_p09 a:hover,
#tokai_main ul li.cate_p09 a.active { background-color:#54c2f0;}
#tokai_main ul li.cate_p10 a:hover,
#tokai_main ul li.cate_p10 a.active { background-color:#3e8b7a;}
#tokai_main ul li.cate_p11 a:hover,
#tokai_main ul li.cate_p11 a.active { background-color:#c16c6c;}
#tokai_main ul li.cate_p12 a:hover,
#tokai_main ul li.cate_p12 a.active { background-color:#9a959f;}
#tokai_main ul li.cate_p13 a:hover,
#tokai_main ul li.cate_p13 a.active { background-color:#c4c462;}
#tokai_main ul.C01,
#tokai_main ul.C02,
#tokai_main ul.C03,
#tokai_main ul.C04,
#tokai_main ul.C05,
#tokai_main ul.C06,
#tokai_main ul.C07,
#tokai_main ul.C08,
#tokai_main ul.C09,
#tokai_main ul.C10,
#tokai_main ul.C11,
#tokai_main ul.C12,
#tokai_main ul.C13 {display: none;}
#tokai_main ul.C01-active,
#tokai_main ul.C02-active,
#tokai_main ul.C03-active,
#tokai_main ul.C04-active,
#tokai_main ul.C05-active,
#tokai_main ul.C06-active,
#tokai_main ul.C07-active,
#tokai_main ul.C08-active,
#tokai_main ul.C09-active,
#tokai_main ul.C10-active,
#tokai_main ul.C11-active,
#tokai_main ul.C12-active,
#tokai_main ul.C13-active {
    display: block;
  }

#tokai_main .cate_child h3 {
  margin: 0;
}
#tokai_main .cate_child ul { padding: 0 2%;}
#tokai_main .cate_child ul li a { padding:15px; height: 55px; text-align: center;}
#tokai_main .cate_child ul li a:hover { background-color:#009ce5;}
@media screen and (max-width: 500px) {
    #tokai_main ul li { 
        width:48%;
        min-width:inherit;
    }
    #tokai_main .cate_parent ul li a { 
        padding: 25px 10px 25px 60px;
        background-position: 10px center; background-size:40px auto;
    }
    #tokai_main ul li.cate_p09 a { padding: 15px 10px 25px 60px;}
}