@charset "utf-8";
/* explanation
	sim内のsite_style.cssをboootstrap向けに改良(18/12/16-)
	  ・バッティングしないところは放置
	  ・上部にNKCI向けの記述を追加
	  ・共通部分のみ(個別ページ向けcssは別に作成)
	  ・今後、sim,demoにも使用予定（その際、cssは別dirにする？）

*/
/*-- bootstrap ---------------------------------------------------------------------*/
/* $breadcrumb-divider: quote(">"); */

.bootstrap .breadcrumb {
	/* display: -ms-flexbox; */
	/* display: flex; */
    /* -ms-flex-wrap: wrap; */
    /* flex-wrap: wrap; */
    /* padding: .75rem 1rem; */
    /* margin-bottom: 1rem; */
    /* list-style: none; */
	background-color: #fff;
	padding: 0rem;
    /* border-radius: .25rem; */
}

.bootstrap .breadcrumb-item + .breadcrumb-item::before {
	content: ">";
  }

.bootstrap h1 {
	font-size: 1.5rem;
	padding-bottom: 0.25rem;
	color: #393;
	font-weight: normal;
	background-image: url(/images/official/common/t_h1_line.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

/* old ===============================================================================
filename: site_style.css
Auther:Create Office Zero Cap
Last update: 2013/04/30
----------------------------------------------------*/

/* CSS Document */
html{
	background-color:#efefef;
}

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/* font-size: 14px; 19/05/18 大木 全体に影響あるため、要確認 */
	text-align: left;
	padding: 0px;
	margin: 0px;
	background-color:#fff;
}

img{
	border: none;
}

a:hover img{
	opacity:0.7;
	filter: alpha(opacity=85);
	-ms-filter: "alpha( opacity=85 )";
	background: #fff;
}

#wrapper{
	/* width:740px; */
	margin-right: auto;
	margin-left: auto;
}

#contents{
	/* width:740px; */
	padding:0;
	margin-right: auto;
	margin-left: auto;
	margin-top:0;
}



/*-- header --------------------------------------------------------------------------*/
#header{
	width:100%;
	border-top: 2px solid #393;
	border-bottom: 1px solid #CCC;
}

#header2{
      display: table;
      /* width: 740px; */
	  margin:auto;
   }

#header2.logo {
      display: table-cell;
   }

#header2.login {
      display: table-cell;
      /* width: 30%; */ 
   }

#header2.logout{
      display: table-cell;
      /* width: 30%; */
   }


/*-- footer --------------------------------------------------------------------------*/

#footer{
	width:100%;
	margin-top: 15px;
	background-color: #efefef;
	border-top: 1px solid #CCC;
	margin: 70px  auto 0;
	font-size: 14px;
	padding-top:20px;
}

#footer2{
	width:740px;
	margin-bottom:15px;
	margin-right: auto;
	margin-left: auto;
}

#footer2 .section {
   float:left;
   width:230px;
   margin-right:25px;
   padding:0;
}
#footer2 .sectionEnd {
   float:left;
   width:230px;
   padding:0;
}

#footer2 h3 {
	font-size:16px;
	border-bottom:1px dotted #999;
	font-weight: normal;
	color: #393;
	margin: 0 0 2px 0;
	padding:5px 0 1px 0;
}

#footer2 ul {
	list-style:none;
	margin:0;
	padding:0 0 0 20px;
}
#footer2 li {
	position: relative;
	margin:10px 0 10px 0;
	padding:3px 0 3px 0;
}
#footer2 ul li::after,
#footer2 ul li::before {
	display: block;
	content: '';
	position: absolute;
}
#footer2 ul li::after {
	top: .4em;
	left: -1.4em;
	width: 14px;
	height: 14px;
	background-color: #393;
	border-radius: 100%;
}
#footer2 ul li::before {
	z-index: 2;
	top: .7em;
	left: -1.2em;
	width: 4px;
	height: 4px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.copyright {
	clear:both;
	font-style:normal;
	font-size:12px;
	text-align:center;
	padding-top: 40px;
	padding-right: 0;
	padding-bottom: 20px;
	padding-left: 0;
}



/*-- crumbs_list ---------------------------------------------------------------------*/
#crumbs_list{
	font-size: 12px;
	padding:5px 0 5px 0;
}
#crumbs_list ul{
	list-style-type:none;
	padding:0;
}
#crumbs_list li{
	display:inline-block;
}
#crumbs_list li.home{
	background-image: url(../images/home_icon.gif);
	background-repeat: no-repeat;
	padding-left:20px;
}

/*-- loginpage -----------------------------------------------------------------------*/

#login{
	width:600px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #E6E4D9;
	border: 1px solid #666;
	margin-top: 50px;
}

#login table{
	width: 500px;
	margin-right: auto;
	margin-left: auto;
	padding: 10px;
}



/*-- index ---------------------------------------------------------------------------*/
#index{
	width:740px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 15px;
}

#index_select{
	width:700px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 100px;
	margin-bottom:150px;
}



/*-- zaisyoku_select -----------------------------------------------------------------*/
#select_z{
	width:740px;
	margin-right: auto;
	margin-left: auto;
}

#z_select{
	width:740px;
	margin-top:100px;
	margin-bottom:150px;
}



/*-- kuriage_select ------------------------------------------------------------------*/
#select_k{
	width:740px;
	margin-right: auto;
	margin-left: auto;
}



/*-- zaisyoku_input ------------------------------------------------------------------*/
#table_z{
	font-size:12px;
	width:740px;
	margin-right: auto;
	margin-left: auto;
}

#table_z table{
	background-color: #ffffff;
	border-top:#999 3px double;
	border-collapse: collapse;
	width:100%;
	color:#333;
	white-space:nowrap;
	margin-top: 30px;
	margin-bottom: 30px;
}

#table_z table th{
	background-color: #efefef;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	border: 1px solid #999;
	color: #000;
	font-size: 14px;
}

#table_z table td.right {
	background-color: #fff;
	width:300px;
	text-align: right;
	padding: 5px;
	vertical-align: top;
	border: 1px solid #999;
}

#table_z table td.left {
	background-color: #fff;
	width:500px;
	text-align: left;
	padding: 5px;
	vertical-align: top;
	border: 1px solid #999;
}



/*-- kuriage_input ------------------------------------------------------------------*/
#table_k{
	font-size:14px;
	width:740px;
	margin-right: auto;
	margin-left: auto;
}

#table_k table{
	background-color: #ffffff;
	border-top:#999 3px double;
	border-collapse: collapse;
	width:100%;
	color:#333;
	white-space:nowrap;
	margin-top: 30px;
	margin-bottom: 30px;
}

#table_k table th{
	background-color: #efefef;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	border: 1px solid #999;
	color: #000;
	width:100px;
}

#table_k table td.right {
	background-color: #fff;
	text-align: right;
	padding: 5px;
	vertical-align: top;
	border: 1px solid #999;
}

#table_k table td.right2 {
	background-color: #fff;
	text-align: right;
	padding: 5px;
	vertical-align: top;
	border: 1px solid #999;
	width:160px;
}

#table_k table td.left {
	background-color: #fff;
	text-align: left;
	padding: 5px;
	vertical-align: top;
	border: 1px solid #999;
	width:440px;
}


/*-- name&company&coment ---------------------------------------------------------*/
.name{
	width:100%;
	font-size: 14px;
	font-weight: normal;
	margin: 0px;
	padding-top: 0px;
	padding-bottom: 3px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	text-align: right;
}

.birthday{
	width:100%;
	font-size: 14px;
	padding: 10px 0 10px 0;
	border-bottom: 1px dotted #ccc;
	color: #666;
}

.company{
	width:100%;
	font-size: 14px;
	margin-bottom: 10px;
	text-align: right;
	border-bottom: 1px solid #CCC;
	padding:15px 0 15px 0;
}

#coment{
	font-size: 14px;
	text-align: left;
	width: 100%px;
	margin-top: 15px;
	padding-top: 5px;
	border-top: 1px dotted #CCC;
	margin-bottom: 5px;
}



/*-- table_output ------------------------------------------------------------------*/
#table_output{
	font-size:14px;
	font-weight:normal;
	width:100%;
	margin-bottom:40px;
	margin-right: auto;
	margin-left: auto;
}

#table_output table{
	background-color: #ffffff;
	border-top:#999 3px double;
	border-collapse: collapse;
	width:100%;
	color:#333;
	white-space:nowrap;
	margin-top: 10px;
	margin-bottom: 20px;
	border: 1px solid #999;
}

#table_output table th{
	background-color: #efefef;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	color: #000;
	border: 1px solid #999;
}

#table_output table td {
	background-color: #fff;
	text-align: right;
	padding: 5px;
	vertical-align: top;
	font-weight:normal;
	border: 1px solid #999;
}

#table_output table td.bold{
	font-weight : bold;
}
/*-- table_output2 ------------------------------------------------------------------*/
#table_output2{
	font-size:13px;
	width:100%;
	margin-bottom:40px;
	margin-right: auto;
	margin-left: auto;
}

#table_output2 table{
	background-color: #ffffff;
	border-top:#999 3px double;
	border-collapse: collapse;
	width:100%;
	color:#333;
	white-space:nowrap;
	margin-top: 10px;
	margin-bottom: 30px;
	border: 1px solid #999;
}

#table_output2 table th{
	font-size:12px;
	background-color: #efefef;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	color: #000;
	border: 1px solid #999;
}

#table_output2 table td {
	background-color: #fff;
	text-align: right;
	padding: 5px;
	vertical-align: top;
	font-weight:normal;
	border: 1px solid #999;
}

/*-- arrow ------------------------------------------------------------------------------*/
#arrow{
	position:relative;
	width:80px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
#arrow:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
#arrow span.overlay{
	position:absolute;
	top: 100%;
	left: 11px;
	z-index:1;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}

/*B*/
#arrow_b{
	position:relative;
	width:100px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
#arrow_b:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
#arrow_b span.overlay{
	position:absolute;
	top: 100%;
	left: 11px
	; z-index:2;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}

/*C*/
#arrow_c{
	position:relative;
	width:150px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
#arrow_c:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
#arrow_c span.overlay{
	position:absolute;
	top: 100%;
	left: 11px
	; z-index:2;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}

/*-- arrow クラスタイプ-----------------------------------------------------------------------*/
.arrow{
	position:relative;
	width:80px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
.arrow:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
.arrow span.overlay{
	position:absolute;
	top: 100%;
	left: 11px;
	z-index:1;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}

/*B*/
.arrow_b{
	position:relative;
	width:100px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
.arrow_b:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
.arrow_b span.overlay{
	position:absolute;
	top: 100%;
	left: 11px
	; z-index:2;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}

/*c*/
.arrow_c{
	position:relative;
	width:150px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
.arrow_c:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
.arrow_c span.overlay{
	position:absolute;
	top: 100%;
	left: 11px
	; z-index:2;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}

/*D*/
.arrow_d{
	position:relative;
	width:250px;
	padding:0 5px;
	border:1px solid #999;
	border-radius:5px;
	text-align:center;
	font-size:14px;
	line-height:2em;
	z-index:0;
	float:left;
}

/* 吹き出し三角形部分 */
.arrow_d:after{
	content:" ";
	position: absolute;
	top: 100%;
	left: 10px;
	z-index:1;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: #999;
}

/* 三角形の上に乗せる。一回り小さくする。 */
.arrow_d span.overlay{
	position:absolute;
	top: 100%;
	left: 11px
	; z-index:2;
	width: 0;
	height: 0;
	border: 7px solid transparent;
	border-top-color: #fff;
}



/*-- pattern table_output ------------------------------------------------------------------*/
/*A*/
#pattern_a{
	/*text-align: left; /* oooが左寄せなので。他のページ影響あるかも */
	font-size:14px;
	width:740px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom:45px;
}

#pattern_a table{
	background-color: #ffffff;
/*	width:500px; */
	color:#333;
	white-space:nowrap;
	margin-left:auto;
	margin-top: 5px;
	margin-bottom: 0px;
}

#pattern_a table td {
	background-color: #fff;
	text-align: left;
	padding: 2px;
	vertical-align: top;
	border: 1px solid #999;
}

#pattern_a p{
	margin:0;
	padding:0;
}


/*B*/
#pattern_b{
	font-size:14px;
	width:740px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom:45px;
}

#pattern_b table{
	width:740px;
	background-color: #ffffff;
/*	width:551px; */
	color:#333;
	white-space:nowrap;
	margin-left:auto;
	margin-top: 5px;
	margin-bottom: 0px;
}

#pattern_b table td {
	background-color: #fff;
	text-align: left;
	padding: 2px;
	vertical-align: top;
	border: 1px solid #999;
}

#pattern_b p{
	margin:0;
	padding:0;
}




/*-- text_size ---------------------------------------------------------------------*/

.txtl{
	font-size: 18px;
}

.txtm{
	font-size: 14px;
}


/*-- elements ----------------------------------------------------------------------*/
#table_z h1{
	font-size: 18px;
	color: #393;
	font-weight: normal;
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 25px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	background-image: url(../../images/t_h1_line.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

#table_k h1{
	font-size: 18px;
	color: #393;
	font-weight: normal;
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 25px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	background-image: url(../../images/t_h1_line.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

#contents h1{
	font-size: 18px;
	color: #393;
	font-weight: normal;
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 25px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	background-image: url(../../images/t_h1_line.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

#header_t h1{
	font-size: 16px;
	color: #000;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding-top: 0 0 3px 0;
	border-bottom: 3px solid #000;
}

#table_output h2{
	font-size: 16px;
	margin-top: 45px;
	margin-bottom: 15px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #CCC;
}

#table_output h2 .normal_text{
	font-weight:normal;
	font-size: 12px;
    vertical-align: text-bottom;
}

#table_output .attention{
	color: #F00;
	font-weight: bold;
	font-size: 11px;
}


#h_line{
	width:100%;
	height:2px;
	background-color:#393;
}

.required{
	font-size:10px;
	color:#fff;
	background-color:#F00;
	padding:4px;
	margin-left:5px;
	vertical-align:middle;
}

.point{
	font-weight: bold;
	color: #F00;
}

.error{
	padding-left:15px;
	color:#F00;
}

.clear{
	clear: both;
}

/*------- form ---------------------------------------------------------------------*/
input[type="button"],
input[type="submit"] {
	padding:10px;
	font-size:14px;
	border: 1px solid #ccc;
	cursor: pointer;
	margin:10px 0 0 0;
}

input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover{
	padding:10px;
	font-size:14px;
	background-color:#999;
	color:#fff;
	border: 1px solid #ccc;
	cursor: pointer;
	margin:10px 0 0 0;
}

/*---*/
#top_caption {
  width: 740px;
  margin: auto;
  padding:0 0 5px 0;
  margin-bottom: 20px;
  border-bottom:1px dashed #ccc;
  font-size:14px;
}
div #output_name {
  font-size: 24px;
  text-align: left;
}
div #output_birthday {
  text-align: left;
}
div #output_date {
  /* height: 100%; 11/27 大木：画面にて確認　*/
}
div #output_company{
  font-size: 16px;
}
div #company_name{
  text-align: right;
  font-size: 16px;
}

/**/
@media print {
 a[href]:after {
 content: "" !important;
 }
 
 abbr[title]:after {
 content: "" !important;
 }
}


/*2016.12.02追加*/
#caption_box{
width: 740px;
 margin: auto;
 display:table;
 padding:0 0 5px 0;
 margin:0 0 5px 0;
border-bottom:1px dashed #ccc;
}

#caption_box .box1 {
	width:370px;
	display:table-cell;
}
#caption_box .box2 {
	width:370px;
	text-align:right;
	display:table-cell;
}
/*-- カンマ組み込み数値 --*/
/*-- 2017/04/09 大木 --*/
input.price{
	text-align: right;
}


/*-- demopage ---------------------------------------------------------------------*/
/* q_balloon CSS部分 */
.q_balloon{
  cursor: help;
  text-decoration: underline;
}

/*-- print-page ---------------------------------------------------------------------*/

.print-page .no-print{
	text-align:right;
}
.print-page .red{
	color:rgba(255,0,0,1.00);
}
.print-page .gray{
	color:rgba(100,100,100,1.00);
}
.print-page #table_output2{
    display: table-header-group;
}
.print-page #title_h1 { overflow: hidden; }
.print-page #title_h1:after { clear: both; }
.print-page #title_h1 div{ float: left;}
.print-page #title_text{ width:80%; }
.print-page #title_icon{ width:20%; text-align: right;}

.print-page #icon-print { cursor: pointer; } 
.print-page #icon-window-close { cursor: pointer; } 

