/* For Smartphone */

body{font-size: 16px; line-height: 1.61; min-width: 100%; -webkit-text-stroke-width: 0 !important; font-family: -apple-system,Segoe UI,/*'Urbanist',*/"Helvetica Neue",Helvetica,Arial,"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", "HanSerif Japanese", Meiryo, Osaka, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", ArialMT, sans-serif;}

.logo{ width: 300px;}
.logo img{width: 132px; margin-right: 15px; display: inline-block; vertical-align: middle;}
.logo span{font-size: 12px; display: inline-block; vertical-align: middle; margin-bottom: -7px;}
.logo a{ color: inherit ;text-decoration: none; transition: .3s;}
.logo a:hover{ opacity: .7;}
	
.wh_blocks{ background: #ffffff; border-radius: 10px; box-shadow: 0 0 15px rgba(0,0,0,0.05); box-sizing: border-box; padding: 6% 6% 7% 6%;}
	
.contents{}
.contents .contents_inn{ padding: 3% 3% 30px 3%; position: relative;}	
	

/*--- ログイン画面 -----------------------------------------------*/

#login{ width: 90%; margin-top: 25%;}
#login .logo{width: 100%; text-align: center; margin-bottom: 30px;}
	
	
#login h2{ background: transparent; font-size: 16px; font-weight: bold; color: #000000; margin: 0 0 8px 0; padding: 0;}
#login .box + .box{ margin-top: 20px; margin-bottom: 20px;}	
#login .box input[type="text"],#login .box input[type="password"],#login .box input[type="email"]{ width: 100%;}
	
#login .btn_area{ margin-top: 30px;}
#login .btn_area input[type="button"]{ width: 80%; height: 50px; border: 0; color: #ffffff; font-size: 18px; background: rgb(0,187,172); background: linear-gradient(90deg, rgba(0,187,172,1) 0%, rgba(0,155,134,1) 100%); text-align: center; cursor: pointer; box-shadow:0 3px 0 rgba(0,0,0,0.10); transition: .3s; border-radius: 30px; position: relative; box-sizing: border-box; letter-spacing: 0.03em; display: block; margin: 0 auto 10px auto;}
#login .btn_area input[type="button"]:hover { opacity: .7; transform: translateY(2px); box-shadow: 0 0 0 rgba(0,0,0,0.1); }


/*--- ヘッダー -----------------------------------------------*/
#header{position: relative;}
#header .inn{background: #ffffff; box-shadow: 0 0 20px rgba(0,0,0,0.05); height: 65px; box-sizing: border-box; padding:0 5% 0 5%; display: flex; justify-content: space-between; align-items: center;}

#header .logo{ padding-top: 5px;}
#header .logo span{display: inline-block;}

#header .license{display: none;}

#header .user span{display: none;}

#header .user label{ display: block; font-size: 16px; position: relative; cursor:pointer; transition: .3s;}
#header .user label img{ display: inline-block; vertical-align: middle;}
#header .user label:hover{ opacity: .7;}
	
#header #pop-up { display: none;}
#header .sub_menu{ display: none; background: #ffffff; color: #43c0b3; border-radius: 40px; box-shadow: 0 0 15px rgba(0,0,0,0.05); transition: .3s; text-align: center; border: 1px solid #43c0b3; overflow: hidden;}
#header .sub_menu a{ display:block;padding: 6px 50px 6px 50px; background: #ffffff; width: 100%; height: 100%; color: inherit; text-align: center; transition: .3s; box-sizing: border-box; line-height: normal; font-size: 14px;}
#header #pop-up:checked + label + .sub_menu { display: block; z-index: 9999; position: fixed; top: 60px; right:3%; transition: .3s; }
	
#header .sub_menu a:hover{ background: #43c0b3; color: #ffffff; text-decoration: none;}


	
/*--- メニュー -----------------------------------------------*/
#menu{ display: none;}

/*--- パンくず -----------------------------------------------*/
	
.breadcrumb{ background: #eeeeee; color: #767676; height: 26px; overflow: hidden; font-size: 10px;}
.breadcrumb ul{ height: 100%; display: flex; flex-wrap: nowrap;}
.breadcrumb li{display: flex; align-items: center; position: relative;}
.breadcrumb li + li:before{ display: block; content: ""; background: url("../images/icon/breadcrumb_indent.png") no-repeat; background-size: auto 100%; width: 57px; height: 23px; position: absolute; top:0; left:-51px; z-index: 0;}
.breadcrumb li span,.breadcrumb li a{ position: relative; z-index: 1; padding: 3px 12px 0 12px;}
.breadcrumb li a{ color: #ed4373; text-decoration: underline;}
.breadcrumb li a:hover{ text-decoration:none; opacity: .7;}	
	
	
	
	
/*--- 見出し -----------------------------------------------*/
	
.contents h2{  font-size: 20px; font-weight: bold; color: #000000; background: url("../images/icon/icon_document_bk.png") no-repeat top 6px left; background-size: 24px auto; min-height: 42px; box-sizing: border-box; padding: 5px 0 0 32px; margin:5px 0 20px 0; position: relative;}

.contents h2 span{ display:block;}

.contents .wh_blocks h2{ background: none; font-size: 16px; color: #00ac9a; padding: 0 0 10px 0; min-height: auto; margin: 0;}
.contents .wh_blocks h2:before{ display: block; content: ""; width: 100%; height: 2px; background: #dedede; position: absolute; bottom:0; left:0;}	
.contents .wh_blocks h2:after{ display: block; content: ""; width: 75px; height: 2px; background: #00ac9a; position: absolute; bottom:0; left:0;}	

.contents .wh_blocks h2.end{ padding: 0 10px 0 10px; margin-bottom: 0; color: #ed4373;}
.contents .wh_blocks h2.end:before,.contents .wh_blocks h2.end:after{ display: none;}
	
.contents h3.orange_tit{display: block; width: 260px; height: 64px; padding-top: 20px; font-size: 18px; text-align: center; font-weight: bold; margin:50px 0 26px 0; background: rgb(255,237,222); background: linear-gradient(90deg, rgba(255,237,222,1) 0%, rgba(255,228,205,1) 100%); color: #eb7a1b; transition: all 0.2s ease; border-radius: 50px; box-sizing: border-box; cursor: pointer; position: relative;}
	
.contents h3.orange_tit:before{ content: ""; position: absolute; bottom:-15px; left:50%; right:0; margin-left: -13px; width: 0; height: 0; border-style: solid; border-right: 13px solid transparent; border-left: 13px solid transparent; border-top: 15px solid #ffe8d4; border-bottom: 0;}
	
	
/*--- テーブル -----------------------------------------------*/
/*白枠内*/
.contents .gr_tb{width: 100%; margin: auto; font-size: 14px;}
.contents .gr_tb th,.contents .gr_tb td{ padding: 13px 10px 13px 10px; border-bottom: 1px dotted rgba(0,0,0,0.2); box-sizing: border-box;}
.contents .gr_tb th{ background:rgba(170,219,212,0.2); color: #009c87; font-weight: bold; text-align: left; width: 100px; vertical-align: middle; line-height: normal;}
.contents .gr_tb small{display: block; line-height: normal; font-size: 10px; font-weight: normal !important; opacity: .8;}
.contents .gr_tb select{ min-height: 46px; min-width: 254px; margin-bottom: 10px;}

.contents .gr_tb input#deadline_from,.contents .gr_tb input#deadline_to,.contents .gr_tb input#kitting_date_from,.contents .gr_tb input#kitting_date_to{width: 45%; max-width: 200px;}
	
.contents .gr_tb .btn_linegreen{ margin: 0;}
	
	
/*マニュアル管理トップ*/	
.contents .manual-list.kit,.contents .manual-list.kit *{display: block; /*width: 100% !important;*/ }
.contents .manual-list{width: 100%; margin: auto;}
.contents .manual-list tr{background: #ffffff; border-radius: 10px; box-shadow: 0 0 15px rgba(0,0,0,0.05); box-sizing: border-box; padding: 4% 6% 7% 6%;}
.contents .manual-list tr + tr{ margin-top: 15px;}

.contents .manual-list td{font-size: 15px;}

.contents .manual-list td:first-child strong{ font-size: 18px; color: #00ac9a; padding: 0 0 10px 0; min-height: auto; margin: 0 0 10px 0; position: relative;}
.contents .manual-list td:first-child strong:before{ display: block; content: ""; width: 100%; height: 2px; background: #dedede; position: absolute; bottom:0; left:0;}	
.contents .manual-list td:first-child strong:after{ display: block; content: ""; width: 75px; height: 2px; background: #00ac9a; position: absolute; bottom:0; left:0;}	


.contents .manual-list td:nth-child(2),.contents .manual-list td:nth-child(3){ display: inline-block; min-width: 50%; width: auto !important;}
.contents .manual-list td:nth-child(3){ min-width: 40%;}


.contents .manual-list .m_status{background: rgb(91,176,239); background: linear-gradient(90deg, rgba(91,176,239,1) 0%, rgba(62,139,231,1) 100%); width: 80px; height: 24px; box-sizing: border-box; text-align: center; font-size: 13px; font-weight: bold; color: #f9f9f9; margin-bottom: 8px;}
	
.contents .manual-list .m_status.orange{background: rgb(242,168,40); background: linear-gradient(90deg, rgba(242,168,40,1) 0%, rgba(233,108,23,1) 100%);}	
.contents .manual-list .m_status.gray{background: rgb(83,83,83); background: linear-gradient(90deg, rgba(83,83,83,1) 0%, rgba(62,62,62,1) 100%);}
	
	
	
.contents .manual-list .m_category{ font-size: 14px; color: #43c0b3; font-weight: bold;}
.contents .manual-list .m_category:before{ display:inline-block; content: ""; background: url("../images/icon/indent_category.png") no-repeat center; background-size: 100% auto; width: 14px; height: 14px; vertical-align: middle; margin: 0 6px 3px 0;}
.contents .manual-list .m_tit{ font-size: 15px; color: #1faa98; font-weight: bold; margin-bottom: 5px; margin-top: 4px;}
.contents .manual-list .m_tit a{ color: inherit; text-decoration: underline; position: relative; padding-right: 24px; 
line-height: 1.5em;}
.contents .manual-list .m_tit a:before{ display:block; content: ""; background: url("../images/icon/indent_circle.png") no-repeat center; background-size: 100% auto; width: 17px; height: 17px; position: absolute; bottom:0; right:0;}
.contents .manual-list .m_tit a:hover{ text-decoration: none; opacity: .7;}
.contents .manual-list .m_des{ font-size: 13px; color: #0f0f0f;}
.contents .manual-list .m_deadline{ font-size: 14px; font-weight: bold; color: #1e1e1e; margin-bottom: 4px;}
.contents .manual-list .m_deadline.red{ color: #ed4373;}
.contents .manual-list .m_create{ font-size: 12px; color: #aaa;}
	

	
	
	
	
/*--- ボタン -----------------------------------------------*/
.btn{ display: block; cursor: pointer; margin: auto; height: 50px; font-size: 17px; text-align: center; color: #ffffff !important; text-decoration: none !important; font-weight: bold; border-radius: 50px; padding: 16px 0 0 0; transition: .3s; box-shadow: 0 2px 0 rgba(0,0,0,0.1); position: relative; box-sizing: border-box; letter-spacing: 0.03em; -webkit-text-stroke-width: 0;}
.btn:hover { opacity: .7; transform: translateY(2px); box-shadow: 0 0 0 rgba(0,0,0,0.1); }
input.btn{ padding-top: 0 !important; padding-bottom: 0 !important;}
	
.btn.w450_h80{max-width: 450px; width: 100%; height: 70px; font-size: 20px; padding-top: 20px; margin-top: 30px;}	
	
.btn.w220_h60{width: 220px; height: 60px;}
	
.btn.w180_h50{width: 180px;}
.btn.w220_h50{width: 220px;}
.btn.w250_h50{width: 250px;}
	
.btn.w200_h40{width: 200px; height: 40px; font-size: 14px; padding-top: 8px;}
.btn.w180_h40{width: 180px; height: 40px; font-size: 14px; padding-top: 8px;}
.btn.w150_h40{width: 150px; height: 40px; font-size: 14px; padding-top: 11px;}
	
.btn.w210_h30{width: 210px; height: 45px; font-size: 14px; padding-top: 13.5px;}
	
.btn.w100_h24{width: 100px; height: 24px; font-size: 12px; padding-top: 5px;}
.btn.w140_h24{width: 140px; height: 24px; font-size: 12px; padding-top: 5px;}
.btn.w180_h24{width: 180px; height: 24px; font-size: 12px; padding-top: 5px;}	
	
.btn.btn_linegreen{ color: #43c0b3 !important; border: 1px solid #43c0b3; background: transparent; box-shadow: none;}
.btn.btn_green{background: rgb(0,187,172); background: linear-gradient(90deg, rgba(0,187,172,1) 0%, rgba(0,155,134,1) 100%);}
.btn.btn_blue{background: rgb(91,176,239); background: linear-gradient(90deg, rgba(91,176,239,1) 0%, rgba(62,139,231,1) 100%);}
.btn.btn_red{background: rgb(242,84,144); background: linear-gradient(90deg, rgba(242,84,144,1) 0%, rgba(232,49,84,1) 100%);}
.btn.btn_orange{background: rgb(242,168,40); background: linear-gradient(90deg, rgba(242,168,40,1) 0%, rgba(233,108,23,1) 100%);}	
.btn.btn_gray{background: rgb(71,71,71); background: linear-gradient(90deg, rgba(71,71,71,1) 0%, rgba(48,48,48,1) 100%);}
	
	
.btn.w450_h80.icon_kitting:before{ display:inline-block; content: ""; background: url("../images/icon/icon_kitting_wh.png") no-repeat; background-size: 100% auto; width: 38px; height: 31px; vertical-align: middle; margin: 0 20px 3px 0;}

.btn.w210_h30.icon_kitting:before{ display:inline-block; content: ""; background: url("../images/icon/icon_kitting_wh.png") no-repeat; background-size: 100% auto; width: 18px; height: 16px; vertical-align: middle; margin: 0 6px 2px 0;}
	
.btn.icon_search:before{ display:inline-block; content: ""; background: url("../images/icon/icon_search_wh.png") no-repeat center; background-size: 100% auto; width: 16px; height: 16px; vertical-align: middle; margin: 0 10px 4px 0;}
.btn.icon_close:before{ display:inline-block; content: ""; background: url("../images/icon/icon_close.png") no-repeat center; background-size: 100% auto; width: 16px; height: 16px; vertical-align: middle; margin: 0 10px 4px 0;}
.btn.icon_create:before{ display:inline-block; content: ""; background: url("../images/icon/icon_create_wh.png") no-repeat center; background-size: 100% auto; width: 16px; height: 16px; vertical-align: middle; margin: 0 10px 4px 0;}	
	
.btn.btn_linegreen.icon_indent:before{ display:inline-block; content: ""; background: url("../images/icon/indent_gr.png") no-repeat center; background-size: 100% auto; width: 6px; height: 10px; vertical-align: middle; margin: 0 6px 4px 0;}
	
.search_btn_area{ margin: 25px 0 -15px 0; display: flex;}
.search_btn_area .btn{margin: 0 8px 0 0;}

.manual_t_btn_bl{ position: absolute; top:50px; right:40px; display: flex;}
.manual_t_btn_bl .btn{margin: 0 0 0 8px;}
	
.manual_t_btn_bl .btn.icon_close{ display: none;}
.manual_t_btn_bl .btn.icon_close.active{ display: block;}	
.manual_t_btn_bl .btn.icon_search.active{ display:none;}
	
.btn_area{display: flex; margin-top: 40px;}
.btn_area .btn{margin: 0 8px 0 0;}
	
.btn_area_top{display: flex; margin-bottom: 20px;}
.btn_area_top .btn{margin: 0 8px 0 0;}
	
	
	
/*--- 検索画面 -----------------------------------------------*/
	
.wh_blocks.search_blocks{ display: none;}
.wh_blocks.search_blocks.active{ display: block; margin: 0 0 50px 0;}
	
	
/*--- ページャー＆並び替え -----------------------------------------------*/
.ind_block{ display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap; margin-bottom: 20px;}
.ind_block table.pager{ margin: 0;}
.ind_block table.pager td{ padding: 0;}
.ind_block table.pager em{color: #ed4373; font-size: 30px; font-weight: 600;}
.ind_block table.pager span{ font-size: 14px; display: inline-block; vertical-align: text-bottom; margin: 0 0 1px 5px;}

.ind_block table.pager td > span{margin: 0 0 -3px -5px; color: #4b4948;}

.ind_block .select_num{ margin-left: 10px;}
.ind_block .select_num select{ width: 80px;}
.ind_block .select_num span{  font-size: 13px; margin: 0 0 -2px 0 !important; color: #4b4948;}
	
.ind_block > .box + .box{ display: flex; align-items: center; flex-wrap: nowrap; justify-content: flex-end;}	
	
.ind_block > .box + .box > p{margin-right: 10px;}
	
.ind_block select{ border: 1px solid #e9e9e9; background:url("../images/icon/indent_b_bk.png") no-repeat right 10px center,#e9e9e9; background-size: 11px auto;}
	
	
/*--- タブ切り替え -----------------------------------------------*/
	
.m_d_tabs{ margin: 50px auto 0 auto;}

.m_d_tabs .tab_item { display: block; width: 260px; height: 64px; padding-top: 20px; font-size: 18px; text-align: center; font-weight: bold; float: left; margin:0 15px 26px 0; color: #333333; background: #e6e6e6; transition: all 0.2s ease; border-radius: 50px; box-sizing: border-box; cursor: pointer; position: relative;}
.m_d_tabs .tab_item:hover {opacity: 0.75;}
.m_d_tabs input[name="tab_item"] {display: none;}
.m_d_tabs .tab_content {  display: none; clear: both; overflow: hidden;}


.m_d_tabs #m_d_k:checked ~ #m_d_k_content,.m_d_tabs #m_d_t:checked ~ #m_d_t_content {display: block;}

.m_d_tabs input#m_d_k:checked + .tab_item { background: rgb(255,237,222); background: linear-gradient(90deg, rgba(255,237,222,1) 0%, rgba(255,228,205,1) 100%); color: #eb7a1b;}
.m_d_tabs input#m_d_t:checked + .tab_item { background: rgb(223,239,255); background: linear-gradient(90deg, rgba(223,239,255,1) 0%, rgba(205,230,255,1) 100%); color: #2c88e0;}	
	
.m_d_tabs input:checked + .tab_item:before{ content: ""; position: absolute; bottom:-15px; left:50%; right:0; margin-left: -13px; width: 0; height: 0; border-style: solid; border-right: 13px solid transparent; border-left: 13px solid transparent; border-top: 15px solid #ffe8d4; border-bottom: 0;}

.m_d_tabs input#m_d_t:checked + .tab_item:before{ border-top: 15px solid #d5eaff; }	
	

/*--- キッティング作業 -----------------------------------------------*/

.kit_work_bl{ margin: 20px 0 10px 0;}
.kit_work_bl > .box + .box{ margin-top: 28px;}

.kit_work_bl.detail{justify-content: space-between; align-items: center;}
	
.kit_work_bl.detail table{ font-weight: bold; font-size: 18px; margin-top: 13px;}

.kit_work_bl .box input[type="text"]{ margin-top: 10px; width: 100%;}