@charset "UTF-8";
html {
height: 100%;
scroll-behavior: smooth;
}
body,
h1,h2,h3,h4,h5,h6,
dl,dt,dd,
p,blockquote,
form,fieldset,
table,th,td,ul,ol,
img {
margin: 0;
padding: 0;
font-size: 100%;
}
a {text-decoration: none;}
ul,ol {
margin: 0;
padding:0;
border: none;
overflow:hidden;
height:auto;
list-style-type: none;
}
body {
height:100%;
width:100%;
margin:0 auto;
font-size:12px;
color:#000;
line-height:30px;
 font-family: 'Meiryo',"ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Osaka", sans-serif;
}
nav{
background: #01275E;
text-align: center;
position: fixed;
bottom: 0;
z-index: 100;
width:100%;
}
nav a{
color:#fff;
font-size: 13px;
}
table{
width: 100%;
border-collapse: collapse;
}
td {
padding:4px 2px 2px 0;
border-right:1px solid #87A0C4;
border-bottom: 1px solid #87A0C4;
position:relative;
}
td:nth-child(2) {
width: 40%;
}
td:nth-child(3) {
border-right:none;
}
td::after{
font-weight:bold;
text-align:center;
content :"⌄";
color:#B3916C;
font-size:16px;
padding-right: 5px;
position: absolute;
right: 10px;
top:0;
}
img {width:100%;}
#comment span{color: #fff;}
#comment h2,
#about h2{
font-size:16px;
font-weight: bold;
color: #01275E;
text-align: center;
margin-bottom: 20px;
}
#comment{
margin:30px 15px 0 15px;
}
#contents_01{background:#1A77A3;}
#contents_02{background:#3F8FB5;}
#contents_03{background:#5FA0BE;}
#contents_04{background:#80B1C7;}
#contents_05{background:#A2C2D1;}
#contents_06{background:#B2CAD6;}
section{
padding: 40px 10px;
width: auto;
}
aside{
color: #fff;
font-size:12px;
line-height:21px;
text-align: center;
margin-bottom: 20px;
}
section h2{
font-size:20px;
letter-spacing:0.5em;
font-weight: bold;
color: #fff;
text-align: center;
margin:0 0 30px 10px;
}
#about_print{
visibility:hidden;
display:none;
height:0;
}
section ul{
clear: both;
list-style:none;
width:100%;
margin:0 auto;
}
section ul > li {
margin-bottom: 5px;
background:#fff;
text-align:left;
}
section ul li h3::before{
position:absolute;
top:33%;
left:15px;
font-weight:bold;
text-align:center;
content :"Q";
color:#B3916C;
font-size:16px;
}
section h3{
cursor:pointer;
position:relative;
padding:20px 36px 19px;
font-weight:bold;
line-height: 21px;
font-size:14px;
}
section div {
display:none;
background:#eff3f6;
border-bottom: 10px solid #fff;
margin:0 10px;
padding:20px 25px;
}
section h3 p {
position:absolute;
right:10px;
top:50%;
transform:translatey(-50%);
width:20px;
height:20px;
}
.icon {
position:relative;
display:inline-block;
width:100%;
height:100%;
}
.icon:before,
.icon:after {
position:absolute;
content:"";
display:block;
transition:all 0.4s;
background:#B3916C;
left:50%;
top:50%;
width:50%;
height:2px;
transform:translate(-50%, -50%);
}
.icon:before {transform:translate(-50%, -50%) rotate(90deg);}
.icon.open:before {transform:translate(-50%, -50%) rotate(0deg);}
section ul li ol{
margin: 10px 0;
}
section ul li ol li{
background: #dce7f1;
text-align: center;
padding:10px 20px 20px;
margin-bottom:2px;
line-height: 21px;
}
section ul li ol li h4{
text-align: center;
background: #1A77A3;
color: #fff;
font-size: 10px;
line-height:20px;
border-radius:20px;
display: inline-block;
padding:2px 14px 0;
margin-bottom: 10px;
}
section ul li ul{
margin-top: 20px;
}
section ul li ul li{
background:#eff3f6;
line-height: 21px;
margin-bottom: 10px;
}
section ul li ul li span {
font-size:8px;
color:#b3916c;
padding-right:5px;
}
/*section ul li ul li:before {
content:  "";
width:5px;
height: 5px;
display:  inline-block;
background-color:#b3916c;
border-radius:  50%;
position:  relative;
top: -1px;
margin-right: 5px;
}*/
#about{
margin:40px 40px 10px;
}
#about ul {
text-align: center;
background: #eee;
margin: 20px 0 0;
padding: 20px;
font-family: "Arial", "メイリオ";
}
#about ul li:nth-child(1) img{
width:200px;
height: 50px;
}
#about ul li:nth-child(2){
text-align: center;
background:#1A77A3;
color: #fff;
font-size: 10px;
line-height:20px;
display: inline-block;
padding:2px 20px 0;
border-radius:20px;
}
#about ul li:nth-child(3){
font-size:10px;
margin-top: 10px;
color: #3F8FB5;
font-weight: bold;
}
#about ul li:nth-child(4){
font-size:33px;
font-weight: bold;
padding:5px 0 10px;
}
#about ul li:nth-child(4) img{
width:20px;
height:31px;
margin-top:-3px;
}
#about ul li:nth-child(4) a{
color: #3F8FB5;
margin-left:10px;
}
#about ul li:nth-child(5) a{
color: #3F8FB5;
margin-left:15px;
}
#about ul li:nth-child(5) a{
padding:10px 15px 2px 0;
display:inline-block;
color:#fff;
position:relative;
overflow:hidden;
outline:none;
transition:ease .2s;
height:36px;
width:80%;
margin:20px 0 0;
border-radius:100px;
z-index:10;
font-weight: bold;
}
#about ul li:nth-child(5) a{
background:#A38866 url(../images/caremanager-qa/icon_mail.svg);
background-repeat:no-repeat;
background-position:right 5px center;
background-size:40px;
}
#about ul li:nth-child(5) a:before{
content:'';
position:absolute;
top:0;
left:0;
z-index:2;
background:#333;
width:100%;
height:100%;
color:#fff!important;
transition:transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
transform:scale(0, 1);
transform-origin:right top;
}
#about ul li:nth-child(5) a span{
position:relative;
color:#fff;
}
footer{
color:#A5B6C6;
text-align:center;
font-size: 10px;
padding-bottom:80px;
}

@media print {
nav,
h1,
.sp,
#about{
visibility:hidden;
display:none;
height:0;
}
#comment h2{
color:#000!important;
}
#comment span {
color:#000!important;
font-weight: bold;
}
section{
 break-inside: avoid!important;
}
section h2{
border: 1px solid #000;
padding: 5px 0;
}
section h3{
padding:10px 40px 0!important;
font-size: 16px;
}
section ul li ol li{
border: 1px solid #000;
}
section ul li ul li span {
color:#888!important;
}
section ul li h3::before{
color:#ccc!important;
}
section ul li div{display:block !important;}
#about_print {
visibility:visible!important;
display:inline-block!important;
margin-top:40px;
margin:40px 100px 0;
padding:40px 40px 30px;
text-align: center;
border: 1px solid #000;
height:480px!important;
}
#about_print h2 {
font-size:16px;
font-weight: bold;
}
#about_print p {
margin-bottom: 20px;
}
}