@charset "utf-8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css");

/*==================================================================
   Universal Reset
==================================================================*/
html,body{margin:0;padding:0;width:100%;height:100%;font-size:100%;}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,div,object,ul,ol,li,dl,dt,dd,tr,td,fieldset,form,legend,figure{margin:0;padding:0;font-size:100%;font-weight:normal;}
ul,ol{list-style:none;}
fieldset{margin:0;padding:0;border:0 none;}
legend{display:none;}
table,th,td{border:0;border-spacing:0;}
caption,th{text-align:left;}
em,strong,cite,abbr,caption,th,address{font-style:normal;font-weight:normal;}
img{max-width:100%;border:0 none;vertical-align:bottom;}
input,select,textarea{margin:0;padding:0;vertical-align:middle;/*-webkit-appearance:none;appearance:none;*/}
input[type="submit"]{border:none;border-radius:0;}
input[type="radio"]{-webkit-appearance:radio;appearance:radio;}
input[type="checkbox"]{-webkit-appearance:checkbox;appearance:checkbox;}
option{padding-right:5px;}
article,aside,dialog,details,figure,figcaption,footer,header,hgroup,menu,nav,section{display:block;}
mark{font-weight:normal;font-style:normal;}
blockquote,q{quotes:none;}
a{vertical-align:baseline;text-decoration:none;}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}

/*==================================================================
   Default Style
==================================================================*/
body{margin:0 auto;padding:10px;color:#333;font-size:14px;font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;line-height:1.6;height:auto;scrollbar-base-color:#fff;}
img,input[type="image"]{max-width:100%;}

/*========== color setting ==========*/
:root {
  --site-color :#152030;
  --accent-color:#d09c00;
/*  --title-bdr-color:#d09c00;*/
  --table-th-color :#d3dee3;
  --table-th-dark-color:#3b4656;
}

/*========== common ==========*/
a{color:#0000ee;}
a:hover, a:active{color:#d09c00;}

.container{padding-bottom:3em;}
.inline{display: inline-block;}
.left{text-align: left;}
.right{text-align: right;}
.center{text-align: center;}
.f_bold{font-weight:bold;}
.f_S{font-size: 0.8em;}
.f_L{font-size: 1.2em;}
.f_red{color:#FF0000;}
.f_blue{color:#0000ff;}
.f_gray{color:#ccc;}
.t_line{text-decoration: underline;}

.notes{color:#FF0000;}
.errormsg{color:#FF0000;font-weight:bold;}
.sitetitle{font-size:14px;font-weight:bold;margin-bottom:1em;}
.menutitle{font-size:14px;font-weight:bold;padding:0.5em 1em;margin-bottom:1em;border-bottom:3px solid var(--site-color);}
.logintitle{text-align: center;width:120px;margin:1em auto;}
.count{color: #d09c00;font-size: 1.5em;font-weight: bold;}

.mb_S{margin-bottom: 0.5em !important;}
.mb_M{margin-bottom: 1em !important;}
.mb_L{margin-bottom: 1.5em !important;}
.mtb_S{margin-top:0.5em !important;margin-bottom:0.5em !important;}
.mtb_M{margin-top:1em !important;margin-bottom:1em !important;}
.mtb_L{margin-top:1.5em !important;margin-bottom:1.5em !important;}

.wd_50{width:50% !important;margin-left:auto !important;margin-right:auto !important;}
.wd_80{width:80% !important;margin-left:auto !important;margin-right:auto !important;}
.wd_90{width:90% !important;margin-left:auto !important;margin-right:auto !important;}
.wd_100{width:100% !important;margin-left:auto !important;margin-right:auto !important;}
.wd_auto{width:auto !important;margin-left:auto !important;margin-right:auto !important;}

.miwd_50{min-width:50% !important;margin-left:auto !important;margin-right:auto !important;}
.miwd_80{min-width:80% !important;margin-left:auto !important;margin-right:auto !important;}
.miwd_90{min-width:90% !important;margin-left:auto !important;margin-right:auto !important;}

.inbox{height:600px;padding:10px;overflow-y:scroll;}
.inbox_chat{width:350px;padding:5px;background:#cceeff;}
.inbox span[class^="member_tag_"]{font-size:0.8em;font-weight:bold;margin:2px;padding: 0.3em 0.5em;border-radius: 5px;}
.inbox::-webkit-scrollbar {width: 8px;height: 10px;}
.inbox::-webkit-scrollbar-track {border-radius: 5px;background: #F0F0F0;}
.inbox::-webkit-scrollbar-thumb {border-radius: 5px;background: #CCC;}


/*========== form style ==========*/
input,select,textarea,button{font-size:12px;font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;}
input[type="text"],input[type="search"],input[type="tel"],input[type="url"],input[type="email"],input[type="password"],
input[type="number"],input[type="range"],input[type="color"],input[type="button"],
input[type="datetime"],input[type="date"],input[type="month"],input[type="week"],input[type="time"],input[type="datetime-local"],
select,textarea{padding: 0.5em;background:#FFF;border:solid 1px #999;border-radius:3px;}
input[type="submit"],input[type="button"],input[type="reset"],button{padding:0.2em 0.8em;border:solid 1px #777;border-radius:3px;
 background:#EEE;
 background: linear-gradient(to bottom, #f9F9F9, #EEE);}
input[type="submit"]:hover,input[type="button"]:hover,input[type="reset"]:hover,button:hover{background:#EEE;}
input[type="text"],input[type="number"]{margin-right:2px;}
input[type="radio"],input[type="checkbox"]{margin-right:2px;vertical-align:text-top;}
.checklist > label{margin-right:0.5em;}


/*============ table style ============*/
/* default */
table{max-width:1500px;margin:0 auto;border-collapse:collapse;}
table th,
table td{border:1px solid #999;font-size:12px;padding:5px;text-align: left;}
table th{font-weight:bold;background:var(--table-th-color);}
table td input[type="text"] {margin-right: 5px;}
table thead th{text-align: center;}

/*--- background style ---*/
table th.color,
table td.color{color:#333;background:var(--table-th-color);}
table th.white,
table td.white{color:#333;background:#FFF;}

table tr.disable{background: #DDD;}
table tr.gray{color:#333;background:#CCC !important;}
table tr.linests0{background:#FFABAB;}
table tr.linests1{background:#FFF;}
table tr.linests2{background:#C0C0C0;}
table tr.linests3{background:#E2F0D9;}
table tr.selectedcolor{	background:#FFFFBB;}
table tr.onmousecolor{ background:#f2faff;}

table th.headcolor{color:#FFF;background:var(--table-th-dark-color);}
table td.member{background: #AACCFF !important;}
table td.char{background: #FFCCCC !important;}
table td.disable{color:#333;background:#CCC;}
table td.disable2{background:#C0C0C0;}
table td.disable3{color:#CCC;}
table td.yudotrue{background:#FFABAB;}
table td.rate{background: #FFFFCC !important;}

table tr.total{	background:#FFEEFF;}
table td.total{	background:#FFFFCC;}

/*--- border style ---*/
table.noborder,
table.noborder tr,
table.noborder th,
table.noborder td{border:none;}

table th.none,
table td.none{border:none;}

/*--- tbl_trclr ---*/
table.tbl_trclr tr:hover td{background:#f2f7fb;}
table.tbl_trclr tr.select td{background:#fffee2;}

/*--- tbl_campaign ---*/
table.tbl_campaign td.yellow{color:#333;background:#ffffe9 !important;}
table.tbl_campaign td.gray{color:#333;background:#CCC !important;}
table.tbl_campaign td.red{color:#333;background:#ffbbbb !important;}
table.tbl_campaign td > button{word-break: keep-all;}

/*--- padding ---*/
table.pd_0 th,
table.pd_0 td{padding:0;}
table.pd_S th,
table.pd_S td{padding:2px;}
table.pd_L th,
table.pd_L td{padding:10px;}

/* cell valign */
table td.valign_top{vertical-align: top;}
table td.valign_btm{vertical-align: bottom;}

/* cell checkd*/
table th.chkcell.checked,
table td.chkcell.checked{background:#f2c990;}

/*-- 返信状況 --*/
table td.mihenshin{background:#F00;color:#FFF;font-weight: bold;letter-spacing: 10px;}
table td.henshin{background:#63728a;color:#FFF;font-weight: bold;letter-spacing: 10px;}

/*-- エラー --*/
table td.whiteerr{color:#F00;}


/*========== topfrm ==========*/
#topfrm iframe {display:block;border: none;height: 100%;width: 100%;}
#topfrm a{color:#FFF;}

/*---  #topfrm top  ---*/
#topfrm #top {position: absolute;top: 0;left: 0px;width: 100%;color: #FFF;text-align: center;background: #152030;}
#topfrm #top > form{display: flex;align-items:center;min-width:1200px;height: 65px;padding:5px 20px;border-bottom: 1px solid #000;}
#topfrm #top > form > .serviceLogo{width:150px;text-align: left;}
#topfrm #top > form > .serviceLogo > img{max-width:100%;vertical-align: bottom;}
#topfrm #top > form > .sitename{position: relative;font-size:16px;font-weight: bold;padding: 5px 10px;margin-left:20px;border: 2px solid #EEE;border-width: 0 0 2px;}
#topfrm #top > form > .sitename::after {position: absolute;content: " ";display: block;width: 30px;left: 0;bottom: -2px;border-bottom: solid 2px #d09c00;}
#topfrm #top > form > .sitechange{font-size: 13px;font-weight: bold;margin-left:20px;}
#topfrm #top > form > .sitechange > i{margin:0 5px;}
#topfrm #top > form > .sitechange > select[name="site_id"]{font-size:14px;padding: 5px;}
#topfrm #top > form > .sitechange > input[type="submit"]{font-size:14px;}
#topfrm #top > form > .operator{margin-left:auto;font-size: 14px;font-weight: bold;}
#topfrm #top > form > .operator > span{display:block;}
#topfrm #top > form > .operator > span:first-child{color: #FFF;font-size: 12px;margin-bottom: 2px;padding: 0 10px;background: #d09c00;border-radius: 30px;}
#topfrm #top > form > .operator > span:last-child{max-width: 10em;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
#topfrm #top > form > .opemenu{margin-left:15px;}
#topfrm #top > form > .opemenu > ul{display: flex;gap:5px;}
#topfrm #top > form > .opemenu > ul > li > a{position:relative;display:block;min-width:70px;padding:5px 10px;text-decoration: none;border-radius:5px;}
#topfrm #top > form > .opemenu > ul > li > a:hover{background:#0a101a;}
#topfrm #top > form > .opemenu > ul > li > a > i{display:block;font-size:1.5em;margin-bottom:3px;}
#topfrm #top > form > .opemenu > ul > li > a > span{display:block;font-size:10px;}
#topfrm #top > form > .opemenu .unread{position: absolute;right: 5px;top: 5px;font-weight: bold;text-align: center;line-height: 1.8;width: 18px;height: 18px;background: #ff3e3e;border-radius: 50%;overflow:hidden;}


/*---  #topfrm left  ---*/
#topfrm #left {position: absolute;top: 65px;left: 0px;width: 250px;height: calc(100% - 65px);text-align: center;transition: all 0.1s linear;background:var(--site-color);}

/*---  #topfrm right  ---*/
#topfrm #right{position: absolute;top: 65px;right: 0;left: 250px;height: calc(100% - 65px);border-left: 2px solid #ccc;transition: all 0.1s linear;}


/*========== sidemenu ==========*/
.sidemenu .sitename > h1{color:#FFF;font-size:1em;font-weight: bold;text-align:center;padding:0.5em;background:var(--site-color);border-bottom: 2px solid var(--accent-color);}

.sidemenu .menuCategory.active h2 > i{color: var(--accent-color);}

.sidemenu h2{position:relative;color:#FFF;font-size:1em;font-weight:bold;line-height:1;text-align:left;padding:0.8em;background:var(--site-color);border-bottom:1px solid #000;cursor: pointer;}
.sidemenu h2 > i{width:1em;text-align:center;margin-right: 0.5em;}
.sidemenu h2 > .unread{display: inline-block;width: 10px;height: 10px;border-radius: 50%;margin-left: 8px;background: #ff3e3e;vertical-align: top;}
.sidemenu h2::after{position:absolute;right:0.5em;top:50%;transform:translateY(-50%);color:var(--accent-color);content:"\f142";font-family:"Font Awesome 5 Free";font-weight:900;font-size:1.1em;transition:0.5s;}
.sidemenu h2.close::after{transform:translateY(-50%) rotate(90deg);}

.sidemenu ul.list_menu {background: #F0F0F0; padding: 0.5em 0;}
.sidemenu ul.list_menu > li{position:relative;width: 95%;margin:0 auto;font-size:0.9em;text-align:right;line-height: 2;}
.sidemenu ul.list_menu > li > a{position:relative;display: block;color:#333;width:100%;font-size:1em;line-height: 2;text-align:left;padding:0.2em 0.2em 0.2em 1.5em;background:#F0F0F0;border-radius: 3px;}
.sidemenu ul.list_menu > li > a:hover{background:#DDD;}
.sidemenu ul.list_menu > li > a > .unread{display: inline-block;color: #fff;width: 20px;height: 20px;line-height: 20px;font-size: 0.9em;font-weight:bold;text-align: center;margin-left: 5px;border-radius: 50%;background: #cc0e11;}
.sidemenu ul.list_menu > li.active > a{font-weight:bold;background:#DDD;}
.sidemenu ul.list_menu > li.active > a::after{position:absolute;right:0.5em;top:50%;transform:translateY(-50%);content:"\f105";font-family:"Font Awesome 5 Free";font-weight:900;color: #999;}


/*============ button ============*/
/*-- btn_01 サイトカラーボタン--*/
.btn_01 a,
.btn_01 input[type="submit"],
.btn_01 input[type="button"],
.btn_01 input[type="reset"],
.btn_01 button{display:block;width:100%;color:var(--site-color);font-weight:bold;text-align: center;text-decoration: none;margin:0 auto;padding:5px;border:2px solid var(--site-color);cursor: pointer;
 background:#FFF;
 background: -moz-linear-gradient(top, #FFF 50%, #F0F0F0);
 background: -webkit-linear-gradient(top, #FFF 50%, #F0F0F0);
 background: linear-gradient(to bottom, #FFF 50%, #F0F0F0);}
.btn_01 a:hover,
.btn_01 input[type="submit"]:hover,
.btn_01 input[type="button"]:hover,
.btn_01 input[type="reset"]:hover,
.btn_01 button:hover{color:#FFF;background: var(--site-color);}
.btn_01 a:focus,
.btn_01 input[type="submit"]:focus,
.btn_01 input[type="button"]:focus,
.btn_01 input[type="reset"]:focus,
.btn_01 button:focus{color:#FFF;outline:2px solid var(--site-color);border: 2px solid #FFF;background: var(--site-color);}

/*-- btn_02 灰ボタン--*/
.btn_02 a,
.btn_02 input[type="submit"],
.btn_02 input[type="button"],
.btn_02 input[type="reset"],
.btn_02 button{display:block;width:100%;color:#777;font-weight:bold;text-align: center;text-decoration: none;margin:0 auto;padding:5px;border:2px solid #777;cursor: pointer;
 background:#FFF;
 background: -moz-linear-gradient(top, #FFF 50%, #F0F0F0);
 background: -webkit-linear-gradient(top, #FFF 50%, #F0F0F0);
 background: linear-gradient(to bottom, #FFF 50%, #F0F0F0);}
.btn_02 a:hover,
.btn_02 input[type="submit"]:hover,
.btn_02 input[type="button"]:hover,
.btn_02 input[type="reset"]:hover,
.btn_02 button:hover{color:#FFF;background: #777;}
.btn_02 a:focus,
.btn_02 input[type="submit"]:focus,
.btn_02 input[type="button"]:focus,
.btn_02 input[type="reset"]:focus,
.btn_02 button:focus{color:#FFF;outline:2px solid #777;border: 2px solid #FFF;background: #777;}

/*-- btn_03 青ボタン--*/
.btn_03 a,
.btn_03 input[type="submit"],
.btn_03 input[type="button"],
.btn_03 input[type="reset"],
.btn_03 button{display:block;width:100%;color:#0066ad;font-weight:bold;text-align: center;text-decoration: none;margin:0 auto;padding:5px;border:2px solid #0066ad;cursor: pointer;
 background:#FFF;
 background: -moz-linear-gradient(top, #FFF 50%, #F0F0F0);
 background: -webkit-linear-gradient(top, #FFF 50%, #F0F0F0);
 background: linear-gradient(to bottom, #FFF 50%, #F0F0F0);}
.btn_03 a:hover,
.btn_03 input[type="submit"]:hover,
.btn_03 input[type="button"]:hover,
.btn_03 input[type="reset"]:hover,
.btn_03 button:hover{color:#FFF;background: #0066ad;}
.btn_03 a:focus,
.btn_03 input[type="submit"]:focus,
.btn_03 input[type="button"]:focus,
.btn_03 input[type="reset"]:focus,
.btn_03 button:focus{color:#FFF;outline:2px solid #0066ad;border: 2px solid #FFF;background: #0066ad;}

/*-- btn_04 赤ボタン--*/
.btn_04 a,
.btn_04 input[type="submit"],
.btn_04 input[type="button"],
.btn_04 input[type="reset"],
.btn_04 button{display:block;width:100%;color:#FFF;font-weight:bold;text-align: center;text-decoration: none;margin:0 auto;padding:5px;border:2px solid #9f3d00;cursor: pointer;
 background:#FFF;
 background: -moz-linear-gradient(top, #ff452d 50%, #FF0000);
 background: -webkit-linear-gradient(top, #ff452d 50%, #FF0000);
 background: linear-gradient(to bottom, #ff452d 50%, #FF0000);}
.btn_04 a:hover,
.btn_04 input[type="submit"]:hover,
.btn_04 input[type="button"]:hover,
.btn_04 input[type="reset"]:hover,
.btn_04 button:hover{background: #b70000;}
.btn_04 a:focus,
.btn_04 input[type="submit"]:focus,
.btn_04 input[type="button"]:focus,
.btn_04 input[type="reset"]:focus,
.btn_04 button:focus{outline:2px solid #FF0000;border: 2px solid #FFF;background: #b70000;}

/*縦大ボタン*/
.btn_large a,
.btn_large input[type="submit"],
.btn_large input[type="button"],
.btn_large input[type="reset"],
.btn_large button{padding:10px 5px;}

/*小ボタン*/
.btn_narrow a,
.btn_narrow input[type="submit"],
.btn_narrow input[type="button"],
.btn_narrow input[type="reset"],
.btn_narrow button{width:200px !important;}


/*============ other ============*/
/*-- clipBoadAlert --*/
.clipBoadAlert{position:absolute;left:-50%;top:-35px;width: 100px;padding: 3px 5px;color:#FFF;background:rgba(51, 51, 51, 0.9);border-radius:5px;z-index:1;}
.clipBoadAlert:before {position: absolute;content: "";left: 50%;bottom: -16px;margin-left: -8px;
 border: 8px solid transparent;
 border-top: 8px solid rgba(51, 51, 51, 0.9);
 z-index: 2;}

/*-- その他システム定義 --*/
span.enable{color:black;}
span.enable2{color:black; font-weight:bold;}
span.disable{color:gray;}
span.caution{color:#FF0000;}
span.male{color:#0000FF;}
span.female{color:#FF0000;}
span.menu{color:#6371FF;	font-size:9pt;}
span.failon {color:#f00; }
span.failoff{color:#000; }
span.expireson {color:red; }
span.expiresoff{color:black;}
span.expiresalert{color:orange;}

a.disable,
a.disabled {color: gray;text-decoration: line-through;pointer-events: none;}

div.replacewords{text-align:left; padding:2pt; margin:4pt; border:1px solid #008; overflow-y:scroll; height:200px;}

input.number {  width: 45px;}

/* chat */
button.find{color: #3b4656;font-weight:bold;border: 2px solid #3b4656;background: #FFF;}
button.find.active, .btn_finish{color: #FFF;background: #3b4656;}

.lineusername {white-space:pre-wrap;}