@charset "utf-8";

/*++++++++++++++
共通
++++++++++++++*/
.manualbox dt svg, .manualbox dt i {
font-size: 3em;
}
.manual .inner {
max-width: 1200px;
}
.container {
padding: 40px;
}

.container h1 {
margin: 0 0 50px;
padding: 0 0 20px;
}
.manualbox dd p i {
}

.manualbox dl{
border: 1px solid var(--main-opa-001);
border-radius: 5px;
margin: 0 0 20px;
overflow: hidden;
position: relative;
counter-reset: number 0;
}
.manualbox {
counter-reset: number 0;

}
.manualbox dt {
background: var(--main-opa-001);
text-align: center;
padding: 23px 90px 25px 20px;
box-sizing: border-box;
align-items: center;
justify-content: left;
position: relative;
cursor: pointer;
}
.manualbox dt > div {
display: flex;
align-items: center;
}
.manualbox dt p {
position: relative;
padding: 0 0 0 30px;
}
.manualbox dl dt div p:after {
content: counter(number) ". ";
counter-increment: number;
position: absolute;
left: 0;
line-height: 1.6;
top: 0;
bottom: -2px;
margin: auto;
display: flex;
align-items: center;
}
.manualbox dt > div svg  {
width: 30px !important;
height: auto;
margin: 0 20px 0 0;
}
.manualbox dt > div i{
font-size: 26px;
width: 30px !important;
height: auto;
margin: 0 20px 0 0;
}

.manualbox dt h2 {
font-weight: 500;
margin: 0;
line-height: 1.6;
padding: 0 0 0 40px;
border: none;
color: #111;
font-size: 1.3em;
letter-spacing: 1px;
background: none;
}

/*タブが開いたとき*/
.manualbox dt.active h2,
.manualbox dt.active h2 .gakunai{
color: #fff;
}



.manualbox dd {
width: auto;
box-sizing: border-box;
padding: 30px 40px 40px;
display: none;
}

.manualbox p > i,.manualbox p > svg {
color:var(--main-001);
font-size: 15px;
margin: 0 5px 0 0;
}

.manualbox dt:after {
content: "開く ＋";
position: absolute;
color: #005bac;
right: 2%;
top: 0;
border: 1px solid #005bac;
bottom: 0;
margin: auto;
display: flex;
align-items: center;
justify-content: center;
width: auto;
height: 20px;
font-size: 0.7em;
font-weight: normal;
letter-spacing: -1px;
padding: 1px 5px;
border-radius: 4px;
}
.manualbox dt.active {
background: var(--main-001);
}
.manualbox dt.active i,.manualbox dt.active svg,.manualbox dt.active p {
color: #fff !important;
}
.manualbox dt.active:after {
content: "閉じる －";
color: #fff;
border: 1px solid #fff;
}

.manualbox dt.active + dd {
display: block;
}

/*+++++++++++++++++++++++++++++++++++
各マニュアル・申請書に連番付与 list p
++++++++++++++++++++++++++++++++++++*/
.manual ol.type li p a {
margin: 0;
}
.manual dl.mcs ol.type li p a:before {
content: counter(number) ". ";
counter-increment: number 1;
}

/*連番不要の場合はnoneを追加*/
.manual dl.mcs ol.type li p a.none:before {
display: none;
}

/*+++++++++++++++++++++++++++++++++++
レスポンシブスマホ版
++++++++++++++++++++++++++++++++++++*/
@media screen and (max-width: 767px) {
/*++++++++++++++
共通
++++++++++++++*/
.manual .inner {
max-width: 100%;
}
.container {
padding: 0;
}
.container h1 {
padding: 20px;
margin: 0;
}

.manualbox ol.type li {margin: 0;display: block;}

.manualbox dl{
display: block;
margin: 0 0 20px;
border-left: none;
border-right: none;border: none;
}

.manualbox dt {
width: 100%;
text-align: center;
padding: 15px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: left;
}

.manualbox dt svg,.manualbox dt i {
font-size: 1.5em;
}
.manualbox dt p {
font-weight: 600;
font-size: 1em;
margin: 5px 0 0 10px;
line-height: 1.6;
}

.manualbox dd {width: 100%;padding: 8px 0 0;}	

.manualbox dd p {
font-size: 0.8em;
}

.manualbox dt > div svg  {
width: 19px !important;
margin: 0 10px 0 0;
}
.manualbox dt > div i{
font-size: inherit;
width: 20px !important;
margin: 0 10px 0 0;
}

.manualbox dt h2 {
padding: 0 0 0 30px;
font-size: 0.8em;
font-weight: 600;
letter-spacing: 0;
text-align: left;
}
.manualbox h3,.manualbox h6 {
font-size: 0.8em;
}    
}