@charset "UTF-8";

/* CSS Document */

@media print, screen and (min-width:980px) {

/* ----------------------------------------------------------------------------------
contents
---------------------------------------------------------------------------------- */

#loginContainer {
position: relative;
width: 500px;
margin: 40px auto;
margin-bottom: 90px;
padding: 46px 50px 50px 50px;
box-shadow: 1px 1px 8px #ddd;
border-radius: 10px;
}

#loginInner {
text-align: left;
}

#mainContainer {
position: relative;
float: right;
width: 86%;
text-align: left;
text-align: justify;
padding: 40px 40px 120px 40px;
top: 66px;
}

.searchArea {
float: right;
width: 300px;
margin-left: 7px;
}

.searchAreaMain {
background: #FFE9E9;
width: 500px;
margin: 0 auto;
padding: 20px;
border-radius: 10px;
}

.refineSearch {
float: right;
position: relative;
margin-left: 7px;
top: -12px;
}

.refineSearchCe {
position: relative;
text-align: center;
margin: 0 auto;
margin-top: 10px;
}

.refineSearch button,
.refineSearchCe button{
width: 100px;
height: 34px;
line-height: 12px;
}

.itemTitle {
font-size: 16px;
font-weight: 600;
margin-bottom: 26px;
line-height: 1;
}

.itemSubTitle {
font-size: 14px;
font-weight: 600;
margin-bottom: 16px;
line-height: 1;
}

.itemSubTitle2 {
font-size: 14px;
font-weight: 600;
line-height: 1;
}

.itemTitle .fas,
.itemSubTitle .fas,
.itemSubTitle2 .fas {
color: #4caf93;
}

.infoTitle {
font-size: 14px;
font-weight: 600;
margin: 0 auto;
margin-top: 30px;
margin-bottom: 14px;
padding-bottom: 10px;
border-bottom: 1px solid #ddd;
}

.infoDate {
margin-bottom: 30px;
}

#mainContainer .notice {
float: right;
font-size: 11px;
text-align: right;
}

.alertArea {
background: #FFE9E9;
width: 100%;
color: #B83F41;
margin: 0 auto;
margin-bottom: 30px;
padding: 16px 20px;
border-radius: 10px;
}

.alertArea h2 {
position: relative;
display:block;
font-size: 14px;
font-weight: 600;
cursor: pointer;
}

.alertArea h2:after {
position: absolute;
font-family:'Font Awesome 5 Free';
top: -4px;
right: 0;
content: '\f0dd';
font-size: 12px;
}

.alertArea a {
color: #B83F41;
}

.toggleContents {
display: none;
margin-top: 10px;
}

.toggleContents {
display: none;
margin-bottom: 5px
}

.toggleContents dt {
clear: left;
float: left;
padding: 12px 0 12px 10px;
}

.toggleContents dd {
padding: 12px 0 12px 160px;
border-bottom: 1px dotted #ccc;
}

/*タブ切り替え全体のスタイル*/
.tabs {
background-color: #fff;
width: 100%;
margin: 0 auto;
padding: 0;
}

/*タブのスタイル*/
.tab_item {
position: relative;
width: 140px;
height: 46px;
background-color: #fff;
line-height: 42px;
text-align: center;
display: inline-block;
color: #4caf93;
font-weight: 600;
transition: all 0.2s ease;
cursor: pointer;
border: 1px solid #ddd;
top: 1px;
}
.tab_item:hover {
opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
display: none;
padding: 20px 0;
clear: both;
overflow: hidden;
border-top: 1px solid #ddd;
}

/*選択されているタブのコンテンツのみを表示*/
#a:checked ~ #a_content,
#b:checked ~ #b_content,
#c:checked ~ #c_content,
#d:checked ~ #d_content,
#e:checked ~ #e_content,
#f:checked ~ #f_content,
#g:checked ~ #g_content,
#h:checked ~ #h_content {
display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
position: relative;
background-color: #4caf93;
color: #fff;
border: 1px solid #4caf93;
top: 1px;
}

/*modal*/

.modal{
display: none;
height: 100vh;
position: fixed;
top: 0;
width: 100%;
z-index: 200;
}

.modal__bg{
background: rgba(0,0,0,0.8);
height: 100vh;
position: absolute;
width: 100%;
}

.modal__content{
background: #fff;
overflow-y: scroll;
max-height: 70%;
left: 50%;
padding: 40px;
position: absolute;
top: 50%;
transform: translate(-50%,-50%);
width: 60%;
}

.modal__content ul{
margin-top: 1em;
list-style-type: disc;
list-style-position: inside;
}

/**/

.signUp,
.buttonArea {
float: left;
width: 20%;
}

.commonLrArea {
clear: both;
overflow: hidden;
}

.checkboxArea {
float: left;
margin-top: 10px;
}

.numberArea {
overflow: hidden;
float: right;
width: 244px;
margin-bottom: 10px;
}

.numberArea2 {
position: absolute;
overflow: hidden;
float: right;
width: 244px;
top: 82px;
right: 40px;
}

.numberArea .number,
.numberArea2 .number {
float: left;
text-align: right;
line-height: 3;
}

.numberArea select,
.numberArea2 select {
float: right;
width: 100px;
height: 32px;
}

/*共通入力*/

.commonInput,
.commonInput2,
.commonInput3 {
border-bottom: 1px dotted #ccc;
}

.commonInput dt,
.commonInput2 dt,
.commonInput3 dt {
clear: left;
float: left;
width: 18%;
height: auto;
text-align: left;
padding: 21px 10px 21px 10px;
border-top: 1px dotted #ccc;
}

.forRepeater {
padding: 12px 0 12px 10px !important;
}

.commonInput dd,
.commonInput2 dd {
position: relative;
width: 82%;
height: auto;
text-align: left;
margin-left: 18%;
padding: 12px 0;
border-top: 1px dotted #ccc;
}

.commonInput2 dt {
clear: left;
float: left;
padding: 12px 0 12px 10px;
}

.commonInput3 dd {
position: relative;
text-align: left;
padding: 12px 0 12px 130px;
border-bottom: 1px dotted #ccc;
}

/*ファイル新規登録*/

.fileUpArea {
width: 60%;
text-align: center;
margin: 0 auto;
}

.fileUpArea select {
width: 352px;
display: block;
margin: 0 auto;
margin-bottom: 5px;
}

.fileUpArea select:last-child {
margin-bottom: 30px;
}

.fileTitle {
position: relative;
background: #d3f0ff;
font-weight: 600;
margin: 0 auto;
margin-bottom: 26px;
padding: 5px 0;
}

.referenceArea {
overflow: hidden;
width: 352px;
}

.formReference {
float: left;
position: relative;
width: 300px !important;
margin-bottom: 10px;
border-right: 0 !important;
border-radius: 5px 0 0 5px !important;
pointer-events: none;
left: 1px;
}

.reference {
float: right;
position: relative;
height: 37px;
border-radius: 0 5px 5px 0 !important;
left: -1px;
}

/*配信日・お知らせ*/

.onair,
.spTable .active,
.commonInput .active {
background: #FAFFD2 !important;
}

.notUsing {
position: relative;
background: #FAFFD2;
display: inline-block;
width: 80px;
height: 14px;
margin: 0 5px;
border: 1px solid #ddd;
top: 3px;
}

.alert {
background: #FFE9E9 !important;
}

/*コンテンツアコーディオン*/

.accordionCo ul {
margin: 0 auto;
padding: 0;
box-sizing: border-box;
}
.accordionCo li {
position: relative;
list-style: none;
}

.accordionCo > ul > li > a {
display: block;
text-decoration: none;
cursor: pointer;
padding: 0;
position: relative;
}
.accordionCo > ul > li > a h5:hover {
}
.accordionCo > ul > li > dl {
display: none;
text-align: left;
padding: 0;
}

.accordionCo li .accordion_icon,
.accordionCo li .accordion_icon span,
.accordionPlus a .accordion_icon2,
.accordionPlus a .accordion_icon2 span {
display: inline-block;
transition: all .3s;
box-sizing: border-box;
}

.accordionCo li .accordion_icon {
position: absolute;
width: 14px;
height: 14px;
top: 7px;
right: 0;
margin: auto;
}

.accordionPlus a .accordion_icon2 {
position: absolute;
width: 14px;
height: 14px;
top: 28px;
left: 48%;
margin: auto;
cursor: pointer;
}

.accordionCo li .accordion_icon span,
.accordionPlus a .accordion_icon2 span {
position: absolute;
width: 100%;
height: 1px;
background-color: #666;
}

.accordionCo li .accordion_icon span:nth-of-type(1) {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
}

.accordionCo li .accordion_icon span:nth-of-type(2) {
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
}

.accordionCo li .accordion_icon.active span:nth-of-type(1) {
display: none;
}

.accordionCo li .accordion_icon.active span:nth-of-type(2) {
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
}

.accordionPlus a .accordion_icon2 span:nth-of-type(1) {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
}

.accordionPlus a .accordion_icon2 span:nth-of-type(2) {
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
}

.accordionPlus a .accordion_icon2.active span:nth-of-type(1){
display: none;
}

.accordionPlus a .accordion_icon2.active span:nth-of-type(2) {
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
}

.col3N .flexInputG {
margin-top: 5px;
}

.accordionNone {
display: none;
}

.accordionCo .open{
    display: block;
}

/**/

.buttonCsvPdf {
position: absolute;
left: 0;
top: 30px;
}

.modalL {
float: left;
width: 48%;
}

.modalR {
float: right;
width: 48%;
}

.commonOverflow {
overflow: hidden;
}

.commonInput .activeR {
background: #FFE3E4;
}

/*合計金額*/

.totalFee {
background: #FFE9E9;
color: #DC1316;
text-align: center;
margin-left: 10px;
padding: 9px 3px 0 0;
border-radius: 100px;
}

/* ----------------------------------------------------------------------------------
footer
---------------------------------------------------------------------------------- */

.footerLogin {
clear: both;
position: fixed;
background: #fff;
width: 100%;
font-size: 10px;
font-weight: 600;
text-align: center;
margin: 0 auto;
padding: 10px 20px;
box-shadow: -2px -2px 8px #eee;
bottom: 0;
z-index: 5;
}

footer {
clear: both;
position: fixed;
background: #fff;
width: 100%;
font-size: 10px;
font-weight: 600;
text-align: left;
margin: 0 auto;
padding: 10px 20px;
box-shadow: -2px -2px 8px #eee;
bottom: 0;
z-index: 5;
}

#pagetop {
position: fixed;
background: #4caf93;
width: 56px;
height: 56px;
bottom: -56px;
right: 30px;
z-index: 6;
display: block;
}

#pagetop a {
display: block;
cursor: pointer;
}

#pagetop a span {
display: block;
width: 56px;
height: 56px;
text-indent: -10000px;
font-size: 1px;
}

#pagetopArrow {
position: absolute;
width: 8px;
left: 5px;
right: 0;
bottom: 24px;
margin: auto;
z-index: 201;
}

#pagetopArrow::before{
position: absolute;
content: "";
display: block;
width: 1px;
height: 30px;
left: 2px;
right: 0;
top: -6px;
margin: auto;
background: #fff;
}

#pagetopArrow::after{
content: "";
display: block;
border-top: 1px solid #fff;
margin-left: -12px;
margin-bottom: 12px;
-moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}

}