﻿#notSupport {display: none; font-size: 18px; line-height: 160%;}
#head, #head *, #body {box-sizing: content-box;}
#body {border: none; background: none;}
#body .categorytitle {background-image: none; margin: 4em 0; text-align: center;}
#body .categorytitle .title {color: #002354; font-size: 48px; font-weight: 500;}
#body .contents {}
#body .sidebar {display: none;}

#sessionInfo {position: fixed; margin-bottom: 0; bottom: 10px; right: 10px; z-index: 2001;}
#mainContentsAnchor {margin-top: 5px; margin-bottom: 25px;}
#mainContentsAnchor .btn {margin: 0 5px;}
p.error {text-align: center; color: #c70000;}

#authContentWrap {display: flex; align-items: flex-start; gap: 0 20px;}
#authContentWrap > aside {width: 280px; position: sticky; top: 0; left: 0;}
#authContentWrap > aside .list-group-wrap {padding: 0;}
#authContentWrap > aside .list-group-wrap .list-group {margin-bottom: 0;}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item {position: relative; border-radius: 0; border: none; font-size: 16px; padding-top: 16px; padding-bottom: 16px; word-break: keep-all;}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item.active {background-color: #fbf8f8; color: #002354; font-weight: 700; z-index: unset;}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item.active:after {content: ''; position: absolute; top: 50%; right: -20px; transform: translateY(-50%); border: 5px solid transparent; border-left: 8px solid #002354;}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item + .list-group-item {border-top: 1px solid #ccc;}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item .codeWrapper {display: none;}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item .glyphicon {position: absolute; top: 50%; right: 5px; transform: translate(0, -50%);}
#authContentWrap > aside .list-group-wrap .list-group .list-group-item.active .glyphicon {display: none;}

#authContentWrap > aside #authList {margin-bottom: 10px; border-color: #002354;}
#authContentWrap > aside #authList .panel-heading {border-color: #002354; background-color: #002354; color: #fff;}
#authContentWrap > aside .savepass {text-align: left; margin-left: 10px;}
#authContentWrap > aside .savepass > span {display: block;}
#authContentWrap > aside .savepass > span.desc {font-size: 12px;}
#authContentWrap > aside #cdPassInput {max-width: 170px;}
#authContentWrap > aside .cdAuthWrap {margin-top: 20px;}

#authContentWrap > main {width: calc(100% - 300px);}
#authContentWrap > main #authItems {opacity: 1; transition: opacity 0.5s ease-in-out; background-color: #fbf8f8; border-radius: 30px; padding: 0 30px;}
#authContentWrap > main #authItems.opa0 {opacity: 0;}

/*
#authContentWrap > main #authItems #noAuthItemsMes {display: none; position: relative; background-color: #eee; width: 500px; font-size: 150%; margin: 0 0 0 25px; padding: 20px; border-radius: 10px;}
#authContentWrap > main #authItems #noAuthItemsMes:before {content: ''; position: absolute; background-color: #eee; top: 50%; transform: translateY(-50%); left: -45px; border: 15px solid #fff; border-right: 30px solid #EEE;}
*/

#authContentWrap > main #authItems #noAuthItemsMes {display: none; width: 500px; font-size: 150%; margin: 0 0 0 25px; padding: 40px 20px;}
#authContentWrap > main #authItems:not(:has(.media.show)) #noAuthItemsMes {display: block;}
#authContentWrap > main #authItems #noAuthItemsMes p {margin-bottom: 0;}
#authContentWrap > main #authItems #authItems-list {padding: 30px 0;}
#authContentWrap > main #authItems:not(:has(.media.show)) #authItems-list {display: none;}
#authContentWrap > main #authItems .media {display: none; margin-top: 0; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 5px dotted #ccc;}
#authContentWrap > main #authItems .media .media-object {width: 150px;}
#authContentWrap > main #authItems .media .media-heading {font-weight: 700; color: #002354;}
#authContentWrap > main #authItems .media .media-body {position: relative; text-align: left; padding-left: 2rem; padding-bottom: 50px;}
#authContentWrap > main #authItems .media .media-body .btn {position: absolute; right: 15px; bottom: 15px;}
#authContentWrap > main #authItems .media.show.last {border-bottom: none; margin-bottom: 0;}
#authContentWrap > main #authItems .media.cd .media-body .description::before { content:"Web限定"; display: inline-block; font-size: 12px; margin-right: 3px; background-color: red; color: #fff; border-radius: 15px; padding: 3px 6px;}

.cdpass .unAuthLoginWrap {margin-top: 5px;}
.cdpass .unAuthLoginWrap b {text-decoration: underline;}
.cdpass .cdAuthWrap label {font-size: 18px;}
.cdpass .annotList {margin-top: 20px;}
.cdpass .annotList li {line-height:1.2;margin-bottom:0.5em;}
.cdpass .exampleHead {font-size: 18px; padding-top: 0.5em; padding-bottom: 0.4em;}
.cdpass .exampleList {display: inline-block; list-style-type: square; font-size: 16px; font-weight: bold; margin-bottom: 0;}
.cdpass .exampleList li + li {margin-top: 0.5em;}
.cdpass .exampleList + hr {margin-top: 10px; margin-bottom: 15px; border-top-color: #ccc;}
.cdpass .exampleAnnotList {font-size: 12px; margin-left: 0;}
.cdpass .exampleAnnotList > li {padding-left: 3em; text-indent: -3em;}
.cdpass .exampleAnnotList > li + li {margin-top: 0.5em;}
.cdpass .exampleAnnotList > li > ul {list-style-type: disc; margin-top: 0.3em; margin-left: 1.5em; text-indent: 0;}
.cdpass .exampleAnnotList > li > ul li {font-weight: bold;}
.cdpass .codeWarner {padding: 1em; border: 4px double #ff0000; font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", "Noto Color Emoji", "Noto Emoji", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;}




.contentslogin a {padding-top: 10px; padding-bottom: 10px;}
.contentslogin > p {margin-bottom: 15px;}
.contentslogin > small {display: block; margin-top: 15px;}

.infoblock .panel-body {line-height: 180%;}
.alertmessage {color: #c70000;}

/* unAuthorized時の表示カスタム */
body.unAuthorized {border: 1px solid #000; background-image: linear-gradient( -45deg, #fff 25%, #89c2ff 25%, #89c2ff 50%, #fff 50%, #fff 75%, #89c2ff 75%, #89c2ff ); background-size: 50px 50px; }
body.unAuthorized #head .headerarea {border-bottom: none;}
body.unAuthorized #head .header_linkbtn_area {display: none;}
body.unAuthorized #globalnavi.gnav_area {display: none;}
body.unAuthorized .gakusan_sp_navigation #gnavSpHead {background: #fafdfc;}
body.unAuthorized #body {margin-top: 30px;}
body.unAuthorized #body .categorytitle {display: none;}
body.unAuthorized #body .bottom_recommend {display: none;}
body.unAuthorized #body .contents {width: 945px; float: none;}
body.unAuthorized #body #authPanel {border: none;}
body.unAuthorized #body #authPanel > .panel-heading {color: #002354; border: 1px solid #ccc; background-color: #fcf8e3; border: none; border-radius: 10px; margin-top: 15px; margin-bottom: 20px; padding-top: 25px; padding-bottom: 20px; 	font-family: 'メイリオ','Meiryo','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic',sans-serif;}
body.unAuthorized #body #authPanel > .panel-heading > .panel-title {font-size: 36px; line-height: 36px;}
body.unAuthorized #body #authPanel > .panel-heading > .panel-title em {color: #ff007b;}
body.unAuthorized #body #authPanel .cdpass > .lead {font-size: 20px; margin-bottom: 30px;}
body.unAuthorized #body #authPanel .unAuth {position: relative; padding-top: 25px; padding-left: 180px; height: 250px;margin-bottom: 25px;}
body.unAuthorized #body #authPanel .unAuth:before {display: block; position: absolute; content: ''; width: 180px; height: inherit; top: 0; left: 35px; background-image: url(/gakusan/common/img/icon/rom-dlp-noarrow.png); background-size: contain; background-repeat: no-repeat;}
body.unAuthorized #body #authPanel .unAuth:after {display: block; position: absolute; content: ''; width: 110px; height: inherit; top: 100px; left: 140px; background-image: url(/gakusan/common/img/icon/word-dlp-noarrow.png); background-size: contain; background-repeat: no-repeat;}
body.unAuthorized #body #authPanel .unAuth #cdPassInput {display: inline-block; font-size: 36px; width: 420px; height: 70px; vertical-align: middle;}
body.unAuthorized #body #authPanel .unAuth button[type=submit] {font-size: 36px;}
body.unAuthorized #body #authPanel .unAuth p.error {position: absolute; top: 0; left: 290px;}
body.unAuthorized #body #authPanel .unAuth .form-group {display: inline-block; margin-bottom: 0;}
body.unAuthorized #body #authPanel .cdRecommend {color: #000; border: 2px solid #ff007b; font-size: 24px; line-height: 160%; border-radius: 20px; padding-top: 0.8em; padding-bottom: 0.8em; margin-bottom: 20px;}
body.unAuthorized #body .cdpass .exampleHead {font-size: 30px; background-color: #007bff; color: #fff;}
body.unAuthorized #body .cdpass .exampleList {font-size: 24px; margin-top: 15px; margin-bottom: 15px;}
body.unAuthorized #foot {background-color: #fff; background-image: none; box-shadow: 1px -1px 1px #999; margin-top: 30px; }

