/* 指針Web CSS */

*{ font-family: arial,sans-serif; box-sizing: border-box; }
body{ margin: 0; padding: 0; min-width: 1200px; width: 100%; min-height: 100%; positon: relative; background-color: #fff; }

.alignRight{ text-align: right; }
.hidden { display: none; }

header, article, footer{ /*border: 1px solid #eee;*/ }
header{ height: 160px; background-color: #232f3e; /*padding: 3px; color: #fff;*/ }
.headArea{ padding: 8px 16px; position: relative; width: 1200px; margin: auto; }


.LogoBox{ display: inline-block; width: 200pt; border: 1px solid #91703F; padding: 0; }
.InfoBox{ display: inline-block; width: 400px; position: absolute; right: 16px; border: 0px solid #fff; text-align: right; font-size: 9pt; color: #fff; }
.LogoTop{ padding: 0 1.5em 0 6pt; border-bottom: 1px solid #91703F; position: relative; }
.LogoH1{ margin : 0.5em 0; }
.LogoImg{ display: inline-block; width: 60pt; height: 60pt; background-color: #0f0; position:absolute; right: 0; }
.LogoH2{ display: inline-block; padding-left: 6pt; margin-bottom: -2pt; }
.LogoSubColor{ color: #F4A3C8; font-size: 20pt; font-weight: 1000; padding-left: 6pt; }
.LogoSubSmall{ color: #fff; font-size: 12pt; font-weight: 1000; padding-left: 6pt; }
header h1{ font-family: "Noto Sans Japanese"; font-size: 18pt; color: #fff; line-height: 1.2em; display: inline-block; margin: 0; }
header h2{ font-size: 14pt; color: #fff; margin: 0; }

.mainArea{ border: 0px solid #000; padding: 8px 16px; margin: auto; margin-top: -160px; padding-top: 176px; padding-bottom: 60px; position: relative; width: 1200px; min-height: 100%; }

footer{ height: 60px; margin-top: -60px; width: 100%; background-color: #232f3e; }
.footArea{ display: table; /*border: 1px solid #fff;*/ padding: 8px 16px; position: relative; width: 1200px; margin: auto; }

.usrID{ font-size: 11pt; font-weight: 600; color: #fff; text-align: right; margin-right: 0.5em; }
.BookCol{ display: inline-block; position: relative; width: 280px; border: 1px solid #eee; padding: 6px;　margin-right: 10px; }
.BookCol1{ display: inline-block; position: relative; width: 379px; border: 1px solid #eee; padding: 6px;　margin-right: 16px; height: 134px; }
.BookCol2{ display: inline-block; position: absolute; top: 16px; right: 16px; width: 370px; border: 0px solid #eee; padding: 0;　margin-right: 10px; height: 134px; }
.BookColh{ display: inline-block; position: relative; width: 370px; border: 1px solid #eee; padding: 6px; height: 65px; margin-bottom: 4px;}
.BookImg{ display: inline-block; width: 90px; height: 120px; border: 1px solid #ccc; }
.BookInf{ display: inline-block; position: absolute; right: 0; width: 160px; height: 120px; font-size: 10pt; font-weight: 800; }
.BookInf1{ display: inline-block; position: absolute; right: 0; width: 260px; height: 120px; font-size: 10pt; font-weight: 800; }
.BookInfh{ display: inline-block; position: relative; width: 358px; height: 120px; font-size: 10pt; font-weight: 800; }
.viewBtn{ border: 1px solid #ccc; position: absolute; right: 6px; bottom: 6px; width: 154px; padding: 6px; text-align: center; font-size: 10pt; cursor: pointer; }
.viewBtn1{ border: 1px solid #ccc; position: absolute; right: 6px; bottom: 6px; width: 260px; padding: 6px; text-align: center; font-size: 10pt; cursor: pointer; }
.artTitle{ border: 1px solid #ddd; padding: 4px 16px; font-size: 14px; background-color: #e7e7e7; }
#SWFrm{ font-size: 10pt; }
.optBtn{ display: inline-block; border: 1px solid #aaa; background-color: #fff; padding: 6px 2em; font-size: 10pt; border-radius: 4px; min-width: 5em; margin-right: 1em; cursor: pointer; color: #000; }
.optSelected{ color: #fff; background-color: #4db0f2; }
.optBtn > input{ display: none; }
.frmBtn { display: inline-block; border: 1px solid #aaa; background-color: #fff; padding: 16px 2em; font-size: 13pt; border-radius: 4px; min-width: 5em; margin-right: 1em; cursor: pointer; color: #000; width: 10em; text-align:center; }
.lblB{ display: block; }
#searchKey{ display: table-cell; width: 100%; padding: 5px; border: 1px solid #ccc; border-radius: 4px; }
.btnTC{ display: none; width: 6em; text-align: right; vertical-align: middle; }
.btnAdd{ display: inline-block; width: 5em; border: 1px solid #ccc; text-align: center; padding: 3px; border-radius: 4px; cursor:pointer; }
#swList{ margin: 0; padding: 0; margin-top: 0.5em; line-height: 3em; }
.swItem{ margin-right: 1.5em; padding: 0.5em; border: 1px dotted #ccc; border-radius: 4px; }
.copyright{ display: table-cell; width: 50%; color: #fff; margin: 0; padding: 0; font-size: 10pt; }
.logoFoot{ display: table-cell; width: 50%; /*border: 1px solid #fff;*/ text-align: right; vertical-align: bottom; }
.resBoxOuter{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding: 20px; background-color: rgba(0,0,0,0.8); display: none; }
.resBoxInner{ width: 1200px; height: 100%; margin: auto; opacity: 1.0; background-color: #fff; }
#resBox{ width: 100%; height: 90vh; border: 0px; overflow: scroll; }
#swMulti{ display: none; }
SEARCHRES{ width: 100%; height: 100%; display: table; }
span.highlight{ background-color: #ADE422; margin: 0 0.25em; border-radius: 4px; padding: 4px; }
span.delBtn{ margin-left: 0.25em; padding: 0.2em; cursor: pointer;}
span.delBtn > img{ width: 0.8em; height: 0.8em; }

#fromLogin{ margin: 0px; }

/* TopPage */
@font-face {
	src:url('ionicicons/ionicons.woff') format('woff');
}

#TopPage .headArea{ width: 960px; margin: auto; }

#TopPage .LogoBox{ display: inline-block; width: 250pt; border: 0px solid #91703F; padding: 0; }
#TopPage header{ height: 170px; background-color: #0f0d28; border-bottom: 1px solid #F4A3C8; }
#TopPage header h1{ color: #000; }
#TopPage header h2{ color: #000; }
#TopPage .LogoSubSmall{ color: #000; }
#TopPage header img { width: 430px; }

#TopPage footer{ background-color: #fff; border-top: 1px solid #F4A3C8; }
#TopPage .copyright{ color: #000; }
#TopPage .logoFoot{ color: #000; }

#TopPage .mainArea{ display: table; width: 962px; padding-bottom: 170px; margin-bottom: -140px; }

#mainLeft		{ display: table-cell; width: 445px; padding: 0; padding-right: 20px; }
#mainRight	{ display: table-cell; width: 445px; padding: 0; padding-left:  20px; }

#formLogin { padding: 0 0.5em; }
#formLogin p { margin: 0.25em 0; }
#formLogin input[type=text]{ padding: 0.35em; color: #000; font-size: 12pt; width: 100%; outline: 0px solid #fff; }
#formLogin input[type=password]{ padding: 0.35em; color: #000; font-size: 12pt; width: 100%; outline: 0px solid #fff; }
#formLogin input[type=submit]{ padding: 0.35em; margin-top: 1em; color: #000; font-size: 12pt; width: 100%; outline: 0px solid #fff; }
#formLogin label{ font-family: "Noto Sans Japanese"; font-size: 12pt; }
#formLogin .BtnLogin{ border: 3px solid #F4A3C8; background-color: #fff; padding: 0.35em; margin-top: 1em; color: #000; font-size: 12pt; width: 100%; outline: 0px solid #fff; color: #F4A3C8; font-family: "Noto Sans Japanese"; text-align: center; cursor: pointer; }
#formLogin .BtnLogin:hover{ background-color: #F4A3C8; color: #fff; }

.mdsLogin{ position: relative; background-color: #333; color: #fff; font-family: "Noto Sans Japanese"; font-size: 14pt; padding: 0.25em 0.5em; height: 40px; margin-bottom: 20px; }
.mdsSignin{ position: relative; background-color: #333; color: #fff; font-family: "Noto Sans Japanese"; font-size: 14pt; padding: 0.25em 0.5em; height: 40px; margin-bottom: 20px; }
.DownArrow::after{ display: block; position: absolute; top: 40px; left: 210; width: 0; border: 12px solid transparent; border-top: 12px solid #333; content:''; margin: auto; }
.forgetPass{ margin: 16px; text-align: right; font-size: 9pt; }
.forgetPass a{ display: inline-block; padding: 0.1em 0.5em; color: #444; text-decoration: none; border-bottom: 1px solid #aaa; }

.info { padding: 0em; font-size: 12pt; }
.info li{ list-style-type: none; padding: 0.25em 0.5em; border-bottom: 1px solid #ddd; vertical-align: top; }
.infodate{ display: inline-block; width: 7em; vertical-align: top; }
.infomsg{ display: inline-block; width: 310px; vertical-align: top; }


.mdsSignInSub{ margin: 0 0.5em;padding: 0.25em 1em; font-size: 12pt; background-color: #666; color: #fff; font-family: "Noto Sans Japanese"; }
.SiDescription{  margin: 0 0.5em; padding: 0.5em 1em; border-bottom: 1px solid #aaa; margin-bottom: 10px; font-size: 10pt; }
.SiDescription p { margin: 0.25em;line-height: 1.5em; }

.SiGo{ text-align: right; margin: 0.5em; margin-bottom: 24px; }
.BtnGo{ display: inline-block; width: 19em; background-color: #F4A3C8; color: #fff; padding: 0.5em 1em; text-align: left; position: relative; cursor: pointer; }
.BtnGo:hover{ background-color: #F4A3C899; }
.BtnGoN{ display: inline-block; width: 18em; background-color: #F4A3C8; color: #fff; padding: 0.5em 1em; text-align: left; position: relative; }
.BtnGo i{ position: absolute; right: 14px; }

#TopPage .footArea{ width: 960px; background-color: #fff; padding-top: 10px; }
#TopPage .LinkList{ dispay: block; width: 100%; height: 160px; border-top: 1px solid #aaa; }
#TopPage .LinkInner{ dispay: block; text-align: center; margin: auto; padding: 0 16px; position: relative; }
#TopPage .LinkInner p{ margin: 0.5em; font-size: 10pt; }
.LinkList ul{ margin: 0; margin-left: -30px; margin-top: 10px; padding: 0; }
.LinkList li{ display: inline-block; list-style-type: none; margin-left: 15px; }
.LinkList li img { vertical-align: top; }
.mdsLink{ position: absolute; top: -26px; font-size: 12pt; font-family: "Noto Sans Japanese"; background-color: #aaa; color: #fff; padding: 0.25em 2em; }

/* Modal */
#ModalDispBack{ display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.9); padding: 40px 0; }
.ModalDispInner{ height: 100%; width: 800px; min-height: 200px; margin: auto; background-color: #fff; padding: 1px; }
.DispTitle{ height: 46px;padding: 0.5em 1em; position: relative; background-color: #337; font-size: 14pt; font-weight: bold; color: #fff; }
.ModalTitle{ font-family: "Noto Sans Japanese"; }
.CloseBtn{ position: absolute; top: 0; right: 6px; cursor: pointer;  font-size: 14pt; padding: 0.5em; }
.CloseBtn:hover{ color: #F4A3C8; }
#Menseki{ height: 100%; }

.ModalDispInner h1{ font-size: 12pt; margin: 0.5em; margin-bottom: 1em; background-color: #669; color: #fff; padding: 0.25em 0.5em; }
.ModalContent{ height: 100%; overflow-y: scroll; margin-top: -46px; padding-top: 46px; border: 1px solid #ddd; }
.ModalContentPara { margin: 0 2em; font-size: 10pt; }
.ModalContentPara *{ font-size: 10pt; }
table.Licence{ width: 740px; margin: auto; border-collapse: collapse; }
table.Licence td{ font-size: 12pt; border: 1px solid #447; padding: 0.5em; font-weight: bold; color: #447; }
table.LowInfo{ width: 740px; margin: auto; border-collapse: collapse; }
table.LowInfo td{ font-size: 10pt; border: 1px solid #447; padding: 0.25em 0.5em; }
table.LowInfo p{ margin: 0; }

#KiyakuInfo{ width: 740px; height: 26em; border: 1px solid #ccc; overflow-y: scroll; margin: auto; padding: 1em; }
#KiyakuInfo p{ font-size: 10pt; margin: 0.25em 0; }
.bold{ font-weight: bold; }
.kiyakujou{ margin-top: 1em!important; }

.RegFwdPart{ position: relative; margin-top: 0.5em; padding: 0 2em; font-size: 10pt; height: 70px; }
.ReFwdBtn { display: inline-block; width: 8em; padding: 0.5em; font-family: "Noto Sans Japanese"; font-size: 14pt; position: absolute; top: 0; right: 2em; background-color: #ccc; color: #fff; text-align: center; }
.AgrChecked .ReFwdBtn{ background-color: #F4A3C8; cursor: pointer; }

#Menseki { display: none!important; }
.Menseki #Menseki { display: block!important; }

#UserReg { display: none!important; }
.UserReg { height: 22em!important; }
.UserReg #UserReg { display: block!important; }

#UserReg .DispTitle{ background-color: #F4A3C8; }
#UserReg h1{ font-size: 12pt; margin: 0.5em; margin-bottom: 1em; border-bottom: 2px solid #F4A3C8; background-color: #fff; color: #000; padding: 0.25em 0.5em; }
#UserReg .info{ font-size: 10pt; margin: 0.5em 1.5em;  }

#MailSend { width: 34em; margin: auto!important; }
#UserReg form{ margin: 1em 3em; }
#UserReg form p{ margin: 0.75em 0; }
#UserReg form label{ display: block; font-size: 10pt; font-family: "Noto Sans Japanese"; }
#UserReg form input[type=email]{ width: 40em; padding: 0.25em; margin-top: 0.25em; }
#UserReg form input[type=submit]{ border: 1px solid #F4A3C8; background-color: #F4A3C8; padding: 0.5em 2em; color: #fff; font-weight: bold; cursor: pointer; margin-left: 14em; margin-top: 1em; }
#SendResultFrm{ height: 100%; }

#MailSendResult { display: none!important; }
.MailSendResult #MailSendResult { display: block!important; }

#sessionMsg { width: 960px; margin: auto; }
.ses_msg { margin: 0.5em; 3em; background-color: #fce6c2; padding: 0.5em 1em; font-size: 10pt; }

#sysInfo{ min-height: 152px; }
.broinf{ padding: 0 2em; text-indent: -1.5em; }

.MCWrap{ width: 100%; padding: 24px; border-top: 1px solid #ccc; margin-top: 1.5em; }
.MCLeft{ width: 560px; display: inline-block; padding: 0.5em; }
.MCRight{ width: 320px; display: inline-block; padding: 0.5em; vertical-align: top; }

.MCLeft img{ width: 100%; border: 1px solid #ddd; }

.BtnTrial{ border: 3px solid #F4A3C8; background-color: #fff; padding: 0.35em; margin-top: .5em; color: #000; font-size: 12pt; width: 100%; outline: 0px solid #fff; color: #F4A3C8; font-family: "Noto Sans Japanese"; text-align: center; cursor: pointer; }
.BtnTrial:hover{ background-color: #F4A3C8; color: #fff; }
.SiTrial{  margin: 0 0.5em;  border-top: 1px solid #aaa; font-size: 10pt; }
.SiTrial p { margin: 0.25em;line-height: 1.5em; }