@charset "utf-8";

/*	Reset	*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, backquote, th, td, caption, button
{ margin: 0; padding: 0; }
html { overflow-y: scroll; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
ol, ul { list-style: none; }
fieldset, img { border: 0; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th { text-align: left; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }

html { width: 100%; height: 100%; background: #f5f7f0 url("../img/img_userback1.png"); }
html.manager { background: #CDD4DF url("../img/img_managerback1.png"); }
body { width: 100%; height: 100%; }
body { font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 14px; line-height: 1.7em; color: #000; }
body, div, button, p { box-sizing: border-box; -moz-box-sizing: border-box; }
html, body, div, p, a, input, button, table, tr, caption, td, th, img, svg, object, ul, ol, li { touch-action: manipulation; }
a { color: #FF145D; }
a:hover { text-decoration: underline; color: #E04B79; }
a.a_linkothwin_p::after { content: url("../img/icn_othwin_p.png"); margin-left: 5px; }
a.a_linkothwin_w::after { content: url("../img/icn_othwin_w.png"); margin-left: 5px; }
a.a_linktopdf_p::after { content: url("../img/icn_topdf_p.png"); margin-left: 3px; }
a.a_linktopdf_w::after { content: url("../img/icn_topdf_w.png"); margin-left: 3px; }

/*	Flex 	*/
.flexcase { display: -moz-box; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.flexcase_justify { justify-content: space-between; -ms-flex-pack: justify; -moz-box-pack: justify; -webkit-box-pack: justify; -webkit-justify-content: space-between; }
.flexcase_center { justify-content: center; -ms-flex-pack: center; -moz-box-pack: center; -webkit-box-pack: center; -webkit-justify-content: center; }
.flexcase_left { justify-content: flex-start; -ms-flex-pack: start; -moz-box-pack: start; -webkit-box-pack: start; -webkit-justify-content: flex-start; }
.flexcase_right { justify-content: flex-end; -ms-flex-pack: end; -moz-box-pack: end; -webkit-box-pack: end; -webkit-justify-content: flex-end; }
.flexcase_middle { -webkit-align-items: center; align-items: center; }

/*	Common	*/
button { border: 0; opacity: 1; outline: none; }
button:active { opacity: 0.9; }
button:disabled { opacity: 0.2; }
button.l_pink { background: #FF145D; color: #fff; padding: 8px 26px; border-radius: 5px; }
button.l_blue { background: #008BE4; color: #fff; padding: 8px 26px; border-radius: 5px; }
button.l_gray { background: #6E6E6E; color: #fff; padding: 8px 26px; border-radius: 5px; }
button.l_green { background: #00BD5F; color: #fff; padding: 8px 26px; border-radius: 5px; }
button.l_orange { background: #FF5500; color: #fff; padding: 8px 26px; border-radius: 5px; }
button.l_small { font-size: 0.9em; padding: 4px 16px; }
button.l_plus{ background-image: url("../img/icn_btplus.png"); background-repeat: no-repeat; background-position: 10px center; padding-left: 50px; }
button.l_print{ background-image: url("../img/icn_btprint.png"); background-repeat: no-repeat; background-position: 10px center; padding-left: 50px; }
button.l_next::after { display: inline-block; margin-left: 10px; margin-right: -10px; transform: rotate(90deg); content: "▲"; }
h2.h2_normal1 { font-size: 1.8em; margin: 20px 0; }
table.tbl_normal1 { width: 100%; font-size: 1.2em; line-height: 1.8em; }
table.tbl_normal1 th, table.tbl_normal1 td { padding: 10px 10px; border-bottom: 1px solid #666; vertical-align: top; }
table.tbl_normal1 th { color: #666; width: 28%; }


.bold { font-weight: bold; }
.posab { position: absolute; }
.al-center { text-align: center; }
.al-right { text-align: right; }
.border-box { box-sizing: border-box; -moz-box-sizing: border-box; }
.nousersel { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.nohilite { -webkit-tap-highlight-color: rgba(0,0,0,0); tap-highlight-color: rgba(0,0,0,0); }
.alphazero { opacity: 0; }
a.a_clearinput img { display: inline-block; width: 40px; margin-left: -45px; }
a.nocolor { color: #000; }
a.nocolor:hover { text-decoration: underline; color: #E04B79; }
.color_pink { color: #FF145D; }
.color_blue { color: #008BE4; }
.color_green { color: #00BD5F; }
.color_red { color: #FF0000; }


.div_wrapper { display: flex; flex-direction: column; min-height: 100vh; }

/*	Header / Footer	*/
.div_headerfootercase { width: 100%; background: #222; color: #fff; }
.div_headerfootercontent { width: 100%; max-width: 1280px; margin: 0 auto; }
.div_headercase { height: 50px; }
.div_headercase img.img_headlogo { display: block; margin: 0; height: 50px; }
.div_headercase .bt_admin { width: 50px; height: 50px; background: url("../img/icn_toadmin.png") no-repeat center center; border: none; }
.div_headercase .bt_exit { width: 50px; height: 50px; background: url("../img/icn_exit.png") no-repeat center center; border: none; margin-left: 10px; }
.div_headercase .div_drp_admin { background: rgba(34,34,34,0.9); padding: 10px; }
.div_headercase .div_drp_admin ul li a { color: #fff; }
.div_headercase .div_drp_admin ul li a:hover { color: #FF145D; }
.div_headercase .sp_gray { color: #666; }
.div_footercase { height: 100px; margin-top: auto; }
.div_footercase img.img_btspmenu { display: block; margin: 0; }
.div_footercontent ul li { display: inline-block; margin: 0 10px; }
.div_footercontent ul li a { color: #fff; }

/*	HreadCrumb	*/
.l-breadcrumb li { font-size: 0.5em; }

/*	Maintenance	*/
.div_maintenance { width: 100%; padding-top: 60px; color:#F10000; text-align: center; font-size: 1.2em; }

/*	Content	*/
.div_contentcase { width: 100%; max-width: 1280px; margin: 0 auto; padding: 20px 10px; }
.div_contentcase:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.div_contentcase.single { max-width: 800px; }
.div_contentcase.single_l { max-width: 960px; }
.div_contentcase.staticcontent { padding-bottom: 50px; }
.div_leftmenucase { width: 29%; float: left; }
.div_rightcontentcase { width: 69%; float: right; }
.div_content { width: 100%; background: #fff; margin-bottom: 20px; border-radius: 8px; box-shadow: 0 0 4px 0 rgba(0,0,0,0.3); overflow: hidden; }
.div_content h2 { font-size: 1.2em; padding: 6px 10px; font-weight: bold; color: #fff; margin-bottom: 16px; background: #aaa; text-align: center; }
.div_content h3 { font-size: 1.2em; border-bottom: 1px solid #ddd; padding-bottom: 2px; color: #777; margin: 0 16px 12px; font-weight: bold; }
.div_content h4 { font-size: 1.1em; color: #777; margin: 0 16px 12px; font-weight: bold; }
.div_content h4.first { margin: 16px 16px 12px; }
.div_content p { padding: 0 16px 16px; }
.div_content p.first { padding: 16px; }
.div_content ul.normal { padding: 0 10px 16px 26px; list-style-type: disc; }
.div_content ul.normal li { margin-left: 16px; }
.div_content div.padding { padding: 20px; }
.div_content.white h2 { color: #666; border-bottom: 1px solid #ddd; background: #f3f3f3; }
.div_content.black h2 { color: #fff; background: #222; }
.div_content.green h2 { color: #fff; background: #2AAB29; }
.div_content.blue h2 { color: #fff; background: #2294FF; }
.div_leftmenucase .div_content h2 { font-size: 1.1em; font-weight: normal; }
.div_funcbuttoncase { padding-bottom: 10px; }
.div_funcbuttoncase button { margin: 0 5px; font-size: 1.1em; }
.tbl_userlist td { line-height: 1.2em; vertical-align: middle; }
.tbl_userlist span.grpname { font-size: 0.75em; font-weight: bold; }
button.bt_more_intable { width: 30px; height: 30px; background-color: rgba(0,0,0,0); background-image: url("../img/icn_more.png"); }
button.bt_edit_intable { width: 24px; height: 24px; background-color: rgba(0,0,0,0); background-image: url("../img/icn_edit.png"); background-size: contain; }

ul.nav li { display: block; width: 100%; padding-left: 60px; line-height: 40px; border-bottom: 1px solid #ddd; background-size: contain; background-repeat: no-repeat; background-position: 10px 0;font-size: 1.1em; cursor: pointer; }
ul.nav li:hover { background-color: #DFF7FF; }
ul.nav li.selected { background-color: #333; color: #fff; cursor: default; }
ul.nav li.home { background-image: url("../img/icn_home0.png"); }
ul.nav li.user { background-image: url("../img/icn_user0.png"); }
ul.nav li.asess { background-image: url("../img/icn_asess0.png"); }
ul.nav li.suggest { background-image: url("../img/icn_asess0.png"); }
ul.nav li.record { background-image: url("../img/icn_rec0.png"); }
ul.nav li.account { background-image: url("../img/icn_account0.png"); }
ul.nav li.setting { background-image: url("../img/icn_setting0.png"); }
ul.nav li.receipt { background-image: url("../img/icn_receipt0.png"); }
ul.nav li.contract { background-image: url("../img/icn_handshake0.png"); }
ul.nav li.mail { background-image: url("../img/icn_mail0.png"); }
ul.nav li.ticket { background-image: url("../img/icn_ticket0.png"); }
ul.nav li.selected.home { background-image: url("../img/icn_home1.png"); }
ul.nav li.selected.user { background-image: url("../img/icn_user1.png"); }
ul.nav li.selected.asess { background-image: url("../img/icn_asess1.png"); }
ul.nav li.selected.suggest { background-image: url("../img/icn_asess1.png"); }
ul.nav li.selected.record { background-image: url("../img/icn_rec1.png"); }
ul.nav li.selected.account { background-image: url("../img/icn_account1.png"); }
ul.nav li.selected.setting { background-image: url("../img/icn_setting1.png"); }
ul.nav li.selected.receipt { background-image: url("../img/icn_receipt1.png"); }
ul.nav li.selected.contract { background-image: url("../img/icn_handshake1.png"); }
ul.nav li.selected.mail { background-image: url("../img/icn_mail1.png"); }
ul.nav li.selected.ticket { background-image: url("../img/icn_ticket1.png"); }

.div_userselector_case { margin-bottom: 20px; }
.frm_userselector_case select#sel_u_id { font-size: 1.3em; color: #000; }
.frm_userselector_case label { font-size: 1.2em; text-align: right; font-weight: bold; }

.div_normaltextblock { margin-bottom: 30px; }
.div_normaltextblock h3 { font-size: 1.14em; font-weight: bold; margin-bottom: 5px; }
.div_normaltextblock p { margin-bottom: 5px; }
ol.ol_dotnum, ol.ol_kana { margin-left: 2em; padding-left: 2em; }
ol.ol_dotnum li { margin-left: -2em; list-style-type: decimal; }
ol.ol_kana li { margin-left: -2em; list-style-type: lower-latin; }
ol.ol_rbracket { margin-left: 2em; }
ol.ol_rbracket li { list-style-type: none; counter-increment: cnt; position: relative; }
ol.ol_rbracket li::before { display: marker; content: "(" counter(cnt) ")"; margin-left: -2em; width: 2em; position: absolute; top: 0; left: 0; }
ol.ol_tabbed { padding-left: 2em; }


/*	Common Floating Edit	*/
.div_floating_case { width: 100%; height: 100%; background: rgba(0,0,0,0.80); position: absolute; }
.div_floating_case_fixed { width: 100%; height: 100%; background: rgba(0,0,0,0.80); position: fixed; }
.div_floating_case.clear { background: none; }
.div_floatingbox div.div_content { padding-bottom: 20px; box-shadow: 1px 4px 16px 4px rgba(0,0,0,0.3); }
.div_floatingbox { width: 98%; max-width: 500px; margin-top: 5%; }
.div_floatingbox div.div_floatingrow { padding: 16px 16px 0; }
.div_floatingbox button { font-size: 1.2em; margin: 20px 10px 0; }
.div_floatingbox button.small { font-size: 0.9em; margin: 0 10px; }
.div_floating_fixedback { width: 100%; height: 100%; background: rgba(0,0,0,0.80); position: fixed; }


/*	Loginbox	*/
.div_floatingbox .div_loginforgotmsg { padding: 50px 16px 0; color: #666; font-size: 0.9em; }
.div_floatingbox p.p_afterMsg { margin: 10px 16px 0; padding: 10px; background: #EFFFE5; border: 1px solid #5BA62D; }
.p_outofBox { width: 98%; max-width: 500px; line-height: 2em; }


/*	Index: */
table.tbl_home td, table.tbl_home th { vertical-align: top; }
button.bt_indexbt { width: 160px; height: 60px; color: #333; border: 2px solid #FF145D; border-radius: 8px; padding-left: 40px; 
	background-repeat: no-repeat; background-size: 40px; background-position: left center; background-color: #fff5f5; }
button.bt_indexbt.manager { background-image: url("../img/icn_handshake1.png"); }
button.bt_indexbt.suggest { background-image: url("../img/icn_asess1.png"); }
button.bt_indexbt.user { background-image: url("../img/icn_user1.png"); }
a.arrow:after { display: inline-block; margin-left: 5px; transform: rotate(90deg); content: "▲"; z-index: 0; }
ul.ul_news { list-style-type: disc; padding-left: 20px; }
ul.ul_news li { padding-bottom: 5px; }
ul.ul_news a { color: #3F63B4; }
@media screen and (max-width: 767px){
	.hide_in_sp { display: none; }
}
@media screen and (min-width: 768px){
	.hide_in_pc { display: none; }
}


/*	User 	*/
.div_toppagecase img { display: block; margin: 10px auto 50px; }
.div_toppagecase button { display: block; margin: 0 auto 30px; font-size: 1.25em; height: 70px; width: 80%; max-width: 400px; }
.div_toppagecase button span { font-weight: bold; font-size: 1.1em; padding: 0 5px; }
.div_toppagecase button.l_small { font-size: 0.98em; height: 40px; }


/*	Single Form	*/
div.div_singleformcase { padding-bottom: 40px; }
div.div_singleform { padding: 0px 20px 26px; }
div.div_singleform.submitbutton { padding: 30px 20px; }
div.div_singleform.submitbutton button { font-size: 1.1em; margin: 0 30px; }
div.div_singleform label { font-weight: bold; }
div.div_singleform label span { padding-left: 5px; font-weight: normal; font-size: 0.9em; color: #1D77CB; }
div.div_singleform label span.flg_must { color: #ee0000; }
div.div_singleform label.lb_forradio { font-weight: normal; padding-right: 20px; line-height: 2em; }
span.sp_error, span.sp_alert, span.sp_progress { display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; font-size: 0.96em; width: 100%; padding: 3px 6px; border-width: 1px; border-style: solid; }
span.sp_error { background: #FFE5E5; color: #d00; border-color: #f00; }
span.sp_alert { background: #FFF6AC; color: #8A5F18; border-color: #FF8600; }
span.sp_progress { background: #CFF6FF; color: #0077E7; border-color: #0077E7; }
p.p_formconsent { margin-top: 20px; border: 1px solid #67CBFF; padding: 10px; border-radius: 4px; }

.on_confirm div.div_singleform input { border: none; font-size: 1.2em; color: #575788; padding-left: 0; }
.on_confirm div.div_singleform select { border: none; font-size: 1.2em; color: #575788; padding-left: 0; }
.on_confirm div.div_singleform label span { display: none; }


/*	User Selector	*/
.div_groupselector select { width: 50%; min-width: 300px; font-size: 1.2em; color: #333; margin-right: 10px; }
.div_groupselector input[type=text] { width: 25%; min-width: 160px; padding-right: 45px; }
.div_groupselector button { background: #fff; }
.div_usernamecase { width: 100%; margin-top: 20px; text-align: center; }
.div_userplate { width: 294px; height: 90px; border-radius: 10px; display: inline-block; margin: 6px 8px; box-shadow: 0 0 6px 0 rgba(0,0,0,0.3); position: relative; overflow: hidden; cursor: pointer; }
.div_userplate { border-width: 4px; border-style: solid; border-color: #666; background: #fff; }
.div_userplate.pushed { box-shadow: 0 0 0 0 rgba(0,0,0,0.3); }
.div_userplate.unselected { opacity: 0.5; }
.div_userplate img.face { display: block; position: absolute; width: 40px; top: 8px; left: 8px; border-radius: 4px; }
.div_userplate p.username { position: absolute; left: 56px; top: 8px; font-size: 1.1em; font-weight: bold; white-space: nowrap; }
.div_userplate p.groupname { position: absolute; left: 56px; top: 28px; font-size: 0.96em; color: #777; }
.div_userplate p.info { position: absolute; width: 100%; left: 0; top: 54px; height: 36px; padding-left: 8px; font-size: 0.94em; color: #444; background: #f3f3f3; border-top: 1px solid #ddd; }
.div_content .div_groupselector { padding-left: 16px; }
.bt_userlogin { width: 50px; height: 50px; border: 3px solid #008BE4; background: #f0f0f0; color: #333; border-radius: 25px; font-size: 1.4em !important; font-weight: bold; margin: 8px !important; }
.bt_clear { width: 116px; height: 40px; border-radius: 20px; border: 2px solid #777; color: #333; margin-top: 14px !important; font-size: 1em !important; }
.p_pleaseinput { font-size: 1.2em; }
.div_loginkeyimg { width: 31px; height: 40px; margin-left: 16px; margin-top: 5px; background-image: url("../img/img_loginkey.png"); background-repeat: no-repeat; background-size: cover; }
.div_loginkeyimg.open { background-position: -31px 0; }
.txt_userlogin.open { background-color: #00A9DA; color: #fff; font-size: 1.5em; font-weight: bold; }


/*	Help	*/
p.p_helpguide { margin-top: 30px; }
p.p_helpinfo { margin-top: 20px; margin-bottom: 30px; line-height: 2em; font-size: 0.9em; }
div.div_helpcase { padding: 20px; }
ul.ul_helpcategories { width: 100%; }
ul.ul_helpcategories>li { font-size: 1.1em; color: #000; display: inline-block; width: 100%; padding: 5px; background: #f5f5f5; border: 1px solid #bbb; margin-bottom: 5px; cursor: pointer; }
ul.ul_helpcategories>li.open { color: #FF145D; background: #fff; }
ul.ul_helpcategories>li::after { content: "▼"; display: inline-block; margin-left: 10px; color: #999999; }
ul.ul_helpcategories>li.open::after { content: "▲"; display: inline-block; margin-left: 10px; color: #FF145D; }
ul.ul_helptitles { padding-left: 2.2em; list-style-type: disc; font-size: 1em; }
ul.ul_helptitles>li { line-height: 1.3em; margin: 0.5em 0; }
ul.ul_helptitles a { color: #222; }
ul.ul_helptitles a:hover { color: #FF145D; }
div.div_helpdetail_back { position: fixed; left: 0; top: 0; background: rgba(255,255,255,0.70); width: 100%; height: 100%; }
div.div_helpdetail_case { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
div.div_helpdetail { background: #fff; border: 4px solid #ABABAB; width: 86%; max-width: 800px; margin: 30px auto; padding: 20px 30px 30px; box-shadow: 0 2px 16px 0 rgba(0,0,0,0.3); border-radius: 6px; }
div.div_helpdetail h3 { font-size: 1.2em; border-bottom: 2px solid #008BE4; margin-bottom: 10px; color: #008BE4; }
div.div_helpdetail p { font-size: 1.1em; line-height: 1.8em; }
button.bt_close_on_white { width: 36px; height: 36px; background: url("../img/icn_bt_close.png") no-repeat; background-size: contain; }


/*	Loading & Alert	*/
div.div_loading { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.70); }
div.div_loading img { position: absolute; top: 50%; left: 50%; margin-top: -32px; margin-left: -32px; }
div.div_alertback { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.60); }
div.div_alertcase { position: absolute; top: 20%; width: 90%; max-width: 400px; background: #fff; border-radius: 10px; box-shadow: 1px 4px 16px 4px rgba(0,0,0,0.3); overflow: hidden; }
div.div_alertcase h3 { font-size: 1.2em; padding: 6px 10px; font-weight: bold; color: #fff; background: #008BE4; text-align: center; }
div.div_alertcase.alert h3 { background: #902; }
div.div_alertcase p { padding: 20px; }
div.div_alertcase p.buttoncase { text-align: center; }
div.div_alertcase p.buttoncase button { margin: 10px; }


/*	Drop Down	*/
div.div_l_dropdown { display: inline-block; position: absolute; padding: 5px 0; background: #fafafa; box-shadow: 0 2px 16px 1px rgba(0,0,0,0.2); font-size: 0.9em; }
div.div_l_dropdown li { padding: 2px 20px; }
div.div_l_dropdown li.border { border-bottom: 1px solid #ddd; margin-bottom: 4px; }
div.div_l_dropdown li a { color: #333; }
div.div_l_dropdown li a:hover { color: #FF145D; text-decoration: underline; }

img.img_minihelp { margin-left: 10px; }
div.div_l_minihelp_case { position: fixed; left: 0; top: 0; height: 100%; width: 100%; background: rgba(255,255,255,0.1); }
p.p_l_minihelp { display: inline-block; position: absolute; padding: 10px; font-size: 0.86em; line-height: 1.5em; max-width: 200px; background: #fafafa;
	border: 2px solid #999; border-radius: 4px; box-shadow: 1px 4px 8px 0 rgba(0,0,0,0.3); pointer-events: none; }


@media screen and (max-width: 1023px){
	.div_headercase .bt_exit { margin-left: 0; }
	.sp_nameonheader { font-size: 0.9em; }
}

@media screen and (max-width: 767px){
	.div_leftmenucase { width: 100%; float: none; height: 100%; position: fixed; left: 0; top: 50px; background-color: rgba(0,0,0,0.6); padding: 5px; z-index: 1000; }
	.div_rightcontentcase { width: 100%; float: none; }
	.div_headercase img.img_headlogo { margin: 10px 0; height: 30px; }
	table.tbl_normal1 { font-size: 0.9em; }
	table.tbl_normal1 th { width: 36%; }
	.sp_nameonheader { display: none; }
	.frm_userselector_case label { text-align: left; }
    div.div_singleform.submitbutton { padding: 10px; }
    div.div_singleform.submitbutton button { font-size: 1em; margin: 0 10px; }
    div.div_alertcase p { padding: 8px; }
	div.div_alertcase p.buttoncase button { margin: 5px; }
}


