@charset "utf-8";


h1, h2, h3, h4, h5, h6, p, form {
margin: 0px;
padding: 0px;
}
dl, dt, dd {
margin: 0px;
padding: 0px;
}
li, ul, ol {
margin: 0px;
padding: 0px;
list-style-type: none;
}
table {
border-collapse:collapse;
}
img {
max-width: 100%;
margin:0;
padding:0;
vertical-align:bottom;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
a {
color: #005aff;
}
a:hover {
color: #ff9f00;
}
/* +++++ Style for float clear +++++ */
.clearfix:after {
content: ".";
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
font-size: 0.1em;
line-height:0;
}
.clearfix {
display: inline-table;
min-height: 1%;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* +++++ Style for float clear +++++ */
.clear {
clear: both;
margin: 0px;
padding: 0px;
}
.px10 {
font-size: 10px;
}
.px11 {
font-size: 11px;
}
.px12 {
font-size: 12px;
}
.px14 {
font-size: 14px;
}
.px16 {
font-size: 16px;
}
.px18 {
font-size: 18px;
}
.px20 {
font-size: 20px;
}
.px22 {
font-size: 22px;
}
.px24 {
font-size: 24px;
}
.px30 {
font-size: 30px;
}
.px36 {
font-size: 36px;
}
.b {
font-weight: bold;
}
.black {
color: #000;
}
.gray01 {
color: #666;
}
.gray02 {
color: #999;
}
.red {
color: #F00;
}
.dark_red {
color: #C00;
}
.blue {
color: #00F;
}
.light_blue {
color: #09F;
}
.green {
color: #090;
}
.dark_green {
color: #030;
}
.orenge01 {
color: #F90;
}
.orange02 {
color: #F60;
}
.brown {
color: #502601;
}
.purple {
color: #639;
}


/*SP版の画像幅制御*/
.max100 {
max-width:100%;
}
.max90 {
max-width:90%;
}
.max80 {
max-width:80%;
}
.max70 {
max-width:70%;
}
.max60 {
max-width:60%;
}
.max50 {
max-width:50%;
}
.max40 {
max-width:40%;
}
.max30 {
max-width:30%;
}
.max20 {
max-width:20%;
}
.max10 {
max-width:10%;
}
.w100 {
width:100%;
}
.w90 {
width:90%;
}
.w80 {
width:80%;
}
.w70 {
width:70%;
}
.w60 {
width:60%;
}
.w50 {
width:50%;
}
.w40 {
width:40%;
}
.w30 {
width:30%;
}
.w20 {
width:20%;
}
.w10 {
width:10%;
}

@media screen and (max-width: 979px) {/*SP*/
.pc {
display: none;
}
header p.alc_bnr {
display: none;
}
img {
max-width: 100%;
}
div.t_scroll{
	width:100%;
	padding:0;
	margin:0 auto 0 auto;
	overflow-x: scroll;
}
div.t_scroll::before{
content: '左右にスクロール可能です';
color: #f00;
}
body {
font:15px/1.231 'YuGothic', '游ゴシック', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', sans-serif;
line-height: 180%;
color: #000;
text-align: center;
margin: 0px;
padding: 0px;
}
div#wrapper {
text-align: left;
width: 100%;
}
div#container {
}

h2 {
font-size: 20px;
color: #fff;
font-weight: bold;
background: #59c2e1;
text-align: center;
padding: 20px 10px;
margin: 0 0 15px 0;
line-height: 1.2;
}

h3 {
text-align: center;
margin:0 0 10px 0;
padding:4px 0 4px 5px;
font-size:18px;
line-height:150%;
color:#47a6c2;
font-weight:bold;
}
h3 + p {
text-align: center;
margin:0 0 15px 0;
padding:4px 0 4px 5px;
font-size:16px;
line-height:130%;
color:#000;
font-weight:bold;
}

/*メニューバー*/
.g_menu {
display : block;
position: fixed;
z-index : 130;
right : 13px;
top : 12px;
width : 42px;
height: 42px;
cursor: pointer;
text-align: center;
background: #000096;
border-radius: 5px;
}
.g_menu span {
display : block;
position: absolute;
width : 30px;
height: 2px ;
left: 6px;
background : #fff;
-webkit-transition: 0.3s ease-in-out;
-moz-transition : 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.g_menu span:nth-child(1) {
top: 10px;
}
.g_menu span:nth-child(2) {
top: 20px;
}
.g_menu span:nth-child(3) {
top: 30px;
}

/* ナビ開いてる時のボタン */
.g_menu.active span:nth-child(1) {
top : 20px;
left: 6px;
-webkit-transform: rotate(-45deg);
-moz-transform : rotate(-45deg);
transform: rotate(-45deg);
background: #fff;
}

.g_menu.active span:nth-child(2),
.g_menu.active span:nth-child(3) {
top: 20px;
-webkit-transform: rotate(45deg);
-moz-transform : rotate(45deg);
transform: rotate(45deg);
background: #fff;
}

nav.sp_navi {
position: fixed;
z-index : 110;
top: 0;
right : 0;
bottom: 0;
color: #000;
text-align: left;
transform: translateX(100%);
transition: all 0.6s;
width: 280px;
padding: 0 10px;
overflow-y: auto;
background: #000096;
opacity: 0.95;
}
nav.sp_navi ul {
margin: 80px auto 0 auto;
padding: 0;
width: 100%;
}
nav.sp_navi ul li {
border-bottom: 1px solid #fff;
text-decoration :none;
}
nav.sp_navi ul li a {
position: relative;
display: block;
text-decoration: none;
color: #fff;
padding: 12px 0 8px 20px;
}
nav.sp_navi ul li a::before {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: '\f0da';
font-size: 15px;
color: #fff;
position: absolute;
width: 15px;
height: 15px;
top: 12px;
left: 8px;
margin: auto;
}
nav.sp_navi ul ul {
margin: 0 auto;
}
nav.sp_navi ul ul li {
padding-left: 15px;
}
nav.sp_navi ul ul li:last-child {
border-bottom: none;
}
nav.sp_navi ul ul li a {
padding: 8px 0 6px 20px;
}
nav.sp_navi ul ul li a::before {
color: #fff100;
top: 8px;
left: 6px;
}




/* このクラスを、jQueryで付与・削除する */
nav.sp_navi.active {
transform: translateY(0%);
}

.pc_navi {
display : none;
}

header {
width: 100%;
margin: 0 auto;
padding: 10px 0;
border-bottom: #000096 5px solid;
background: linear-gradient(0deg, #eee, #fff);
}
header h1.logo {
max-width: 50%;
margin: 0 0 0 10px;
}
header h1.logo img {
width: 100%;
}
header p.btn {
display: none;
}

div#other_service {
width: 96%;
margin:25px auto;
padding:0;
}
div#other_service h2 {
font-size: 18px;
color: #000;
font-weight: bold;
border: #333 1px solid;
background: #eee;
text-align: center;
padding: 6px 5px 4px 5px;
margin: 0 0 25px 0;
}
div#other_service ul {
margin:0;
padding:0;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
div#other_service li {
width:49%;
margin:0 2% 10px 0;
padding:0;
}
div#other_service li:nth-child(2n) {
margin:0;
}
div#other_service li img {
width:100%;
}

div#footer {
width: 100%;
margin: 0 auto;
padding: 15px 0;
background: #000096;
}
div#footer p {
text-align: center;
color: #fff;
}

div.main-visual {
width: 100%;
margin: 0 auto 30px auto;
}
div.catch {
position: relative;
width: 100%;
padding-top: 47.92%;
margin: 0 auto;
}
div.catch .main_image {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
background: url("../images/bg_maincatch.png") no-repeat;
background-size: contain;
}
div.main-visual p.notice {
margin: 10px 0 0 0;
font-size: 90%;
font-weight: bold;
line-height: 1.5;
}

section {
width: 96%;
margin: 0 auto 50px auto;
}
section div.inner {
margin: 0 auto 40px auto;
}
section.para01 ul {
margin: 0 auto 45px auto;
padding: 0;
width: 100%;
}
section.para01 ul li {
display: flex;
flex-wrap: wrap;
width: 100%;
margin: 0 0 30px 0;
padding: 0 0 30px 0;
border-bottom: #999 1px dotted;
}
section.para01 ul li div.pic {
width: 40%;
margin: 0 10px 0 0;
}
section.para01 .needs {
width: calc(60% - 10px);
font-size: 105%;
font-weight: bold;
background: url("../images/arrow.png") no-repeat bottom  left;
background-size: auto 100px;
padding: 0 0 120px 0;
margin: 0 0 30px 0;
}
section.para01 .solution {
width: calc(100% - 16px);
font-size: 110%;
font-weight: bold;
border: #666 3px solid;
border-radius: 15px;
padding: 15px 8px;
box-shadow: 0 0 5px #59c2e1;
text-align: center;
margin: 0;
}

section.para02 div.inner {
margin: 0 auto 50px auto;
padding-bottom: 20px;
border-bottom: #666 1px dashed;
}

section.para02 ul.point-nav {
margin: 30px auto 80px auto;
}
section.para02 ul.point-nav li {
margin: 0 0 25px 0;
padding: 0 0 0 85px;
min-height: 90px;
}
section.para02 ul.point-nav li:nth-child(1) {
background: url("../images/alc-check-point-01.png") no-repeat;
background-position: left 0 top 0;
background-size: 70px auto;
}
section.para02 ul.point-nav li:nth-child(2) {
background: url("../images/alc-check-point-02.png") no-repeat;
background-position: left 0 top 0;
background-size: 70px auto;
}
section.para02 ul.point-nav li:nth-child(3) {
background: url("../images/alc-check-point-03.png") no-repeat;
background-position: left 0 top 0;
background-size: 70px auto;
}

section.para02 ul.point-nav li p.catch {
font-size: 18px;
font-weight: bold;
color: #346A9B;
margin: 0 0 5px 0;
}
section.para02 ul.point-nav li a {
position: relative;
display: flex;
justify-content: space-around;
align-items: center;
margin: 0;
max-width: 200px;
padding: 10px 0px 10px 0;
color: #313131;
transition: 0.3s ease-in-out;
font-weight: 500;
text-decoration: none;
}

section.para02 ul.point-nav li a:before, section.para02 ul.point-nav li a:after {
content: "";
position: absolute;
display: block;
top: 50%;
}
section.para02 ul.point-nav li a:before {
width: 0.5rem;
height: 0.5rem;
left: 1.1rem;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
z-index: 2;
transform: translateY(-50%) rotate(45deg);
transition: all 0.3s;
}
section.para02 ul.point-nav li a:after {
left: 0;
background: #59c2e1;
z-index: 1;
width: 3rem;
height: 3rem;
border-radius: 4rem;
transform: translateY(-50%);
transition: all 0.5s;
}
section.para02 ul.point-nav li a span {
position: relative;
transition: all 0.3s;
z-index: 3;
}

section.para02 ul.point-nav li a:hover span {
color: #fff;
}
section.para02 ul.point-nav li a:hover:before {
left: 2rem;
}
section.para02 ul.point-nav li a:hover:after {
right: 0;
width: 100%;
}

section.para02 div.point-ttl {
position: relative;
margin: 0 auto 60px auto;
padding: 25px 20px 20px 15px;
background: #acdce9;
border-radius: 20px;
}
section.para02 div.point-ttl::after {
position: absolute;
top: -35px;
right: 10px;
content: '';
display: inline-block;
background: url("../images/alc_check_focus_icon.png") no-repeat;
display: inline-block;
background-size: contain;
width: 60px;
height: 56px;
}
section.para02 div.point-ttl h3 {
font-size: 22px;
font-weight: 900;
color: #1abb5d;
-webkit-text-stroke: 5px #fff;
paint-order: stroke;
padding: 0 0 0 45px;
}
section.para02 div.point-ttl.point01::before {
position: absolute;
top: 15px;
left: 7px;
content: '';
display: inline-block;
background: url("../images/alc-check-point-01.png") no-repeat;
display: inline-block;
background-size: contain;
width: 60px;
height:60px;
}
section.para02 div.point-ttl.point02::before {
position: absolute;
top: 15px;
left: 7px;
content: '';
display: inline-block;
background: url("../images/alc-check-point-02.png") no-repeat;
display: inline-block;
background-size: contain;
width: 60px;
height:60px;
}
section.para02 div.point-ttl.point03::before {
position: absolute;
top: 15px;
left: 7px;;
content: '';
display: inline-block;
background: url("../images/alc-check-point-03.png") no-repeat;
display: inline-block;
background-size: contain;
width: 60px;
height:60px;
}

section.para02 div.prepare {
position: relative;
border: #bbb 3px solid;
border-radius: 15px;
margin: 70px auto 45px auto;
padding: 25px 30px 15px 5px;
}
section.para02 div.prepare .title {
position: absolute;
left: -10px;
top: -20px;
display: inline-block;
background: #346a9b;
color: #fff;
font-size: 20px;
font-weight: bold;
padding: 10px 100px 8px 10px;
box-shadow: 15px -10px 0 8px #a0c6e8;
border-radius: 0 15px 0 0;
}

section.para02 ul.stuff {
margin: 0 auto 45px auto;
padding: 0;
width: 100%;
}
section.para02 ul.stuff li {
display: flex;
flex-wrap: wrap;
width: 100%;
margin: 0;
}
section.para02 .pic {
width: 40%;
padding: 0;
margin: 0 10px 0 0;
}
section.para02 .pic + p {
width: calc(60% - 10px);
font-size: 105%;
font-weight: bold;
padding: 0;
text-align: left;
margin: 30px 0 0 0;
}
section.para02 p.nav-back {
text-align: right;
margin: 15px 0;
}
section.para02 h4.admin {
display: inline-block;
position: relative;
left: 50%;
transform: translateX(-50%);
margin:0 auto 10px auto;
padding:8px 25px 6px 25px;
font-size:22px;
line-height:130%;
background:#215F9A;
border-radius: 8px;
color:#fff;
font-weight:bold;
}
section.para02 div.admin_page div.img-pc {
width: 100%;
margin: 30px 0 45px 0;
}
section.para02 div.admin_page div[class^="msg"] p:first-child {
color: #002e73;
font-weight: bold;
font-size: 18px;
}
section.para02 div.admin_page div.msg01-1 {
width: 94%;
padding: 10px;
background: #eee;
margin: 15px auto;
}
section.para02 div.admin_page div.msg01-2 {
width: 94%;
padding: 10px;
background: #eee;
margin: 15px auto;
}

section.para02 div.admin_page div.msg02 {
width: 94%;
padding: 10px;
background: #eee;
margin: 15px auto;
}

section.para02 div.admin_page div.msg03 {
width: 94%;
padding: 10px;
background: #eee;
margin: 15px auto;
}

section.para02 h4.fare {
color: #215F9A;
font-weight: bold;
width: 100%;
text-align: center;
margin:0 auto 40px auto;
padding:8px 0 6px 0;
font-size:22px;
line-height:130%;
border-bottom: #215F9A 3px solid;
}
section.para02 h4.items {
color: #215F9A;
font-weight: bold;
width: 100%;
text-align: center;
margin:0 auto 40px auto;
padding:8px 0 6px 0;
font-size:22px;
line-height:130%;
border-bottom: #215F9A 3px solid;
}
section.para02 h4.items + p {
font-weight: bold;
text-align: center;
margin:0 auto 40px auto;
font-size:20px;
line-height:130%;
}
section.para02 h4.items + p span {
font-size:24px;
color: #f00;
}

section.para02 div.price-list {
background: #FBFBFB;
border: #D9D9D9 1px solid;
border-radius: 30px;
padding: 15px;
}
section.para02 div.price-list p.notice {
color: #215F9A;
font-weight: bold;
font-size: 14px;
}
section.para02 div.price-list p.ttl {
color: #215F9A;
font-weight: bold;
text-align: center;
margin:0 auto 40px auto;
padding:8px 25px 6px 25px;
font-size:22px;
line-height:130%;
border-bottom: #215F9A 3px solid;
}
section.para02 div.price-list table {
border: #666 1px solid;
margin: 0 0 25px 0;
width: 650px;
}
section.para02 div.price-list table th {
background: #eee;
border: #666 1px solid;
padding: 10px 8px;
text-align: left;
}
section.para02 div.price-list table tr th:nth-child(1) {
width: 14%;
}
section.para02 div.price-list table tr th:nth-child(n + 2) {
width: 24%;
}
section.para02 div.price-list table td {
border: #666 1px solid;
padding: 10px 8px;
}
section.para02 div.price-list table td span {
font-size: 16px;
font-weight: bold;
}
section.para02 div.price-list table td span span {
color: #f00;
}

section.para02 ul.items {
margin:0;
padding:0;
}
section.para02 ul.items li {
display: flex;
flex-wrap: wrap;
margin:0 0 50px 0;
padding:0;
}
section.para02 ul.items li p.pic {
width: 45%;
margin: 0 10px 0 0;
}
section.para02 ul.items li div.block {
width: calc(55% - 10px);
margin:0;
padding:0;
}
section.para02 ul.items li p.item-name {
text-align: left;
margin: 0 0 10px 0;
min-height: 3.5em;
}
section.para02 ul.items li p.item-name a {
color: #00479d;
font-size: 110%;
font-weight: bold;
text-decoration: underline;
font-feature-settings: "palt";
}
section.para02 ul.items li p.item-price {
font-size: 16px;
font-weight: bold;
margin: 0 0 10px 0;
}
section.para02 ul.items li p.item-price span.ex-tax {
font-size: 19px;
color: #f00;
}
section.para02 ul.items li p.item-price span.br:before{

content:'\A';
white-space: pre ;
}
section.para02 ul.items dl {
width: calc(55% - 10px);
display: flex;
flex-wrap: wrap;
}
section.para02 ul.items dt {
width: 3.5em;
padding: 0 10px 0 0;
margin: 0;
}
section.para02 ul.items dd {
width: calc(100% - 3.5em - 10px);
padding: 0;
margin: 0;
}

section.para03 dl {
background: url("../images/img_flow.png") no-repeat bottom center;
margin: 25px 0;
padding: 0 0 10px 0;
font-size: 20px;
line-height: 1.6;
}
section.para03 dl:last-child {
background: none;
margin: 25px 0 40px 0;
}
section.para03 dt {
background: #eee;
border-radius: 15px 15px 0 0;
padding: 15px 15px 10px 15px;
margin: 20px 0 0 0;
font-size: 18px;
font-weight: bold;
}
section.para03 dd {
background: #eee;
border-radius: 0 0 15px 15px;
padding: 0 15px 15px 15px;
margin: 0 0 25px 0;
}
section.para03 dl span.step {
display: inline-block;
background: #002E73;
padding: 5px 15px 3px 15px;
border: #fff 1px solid;
border-radius: 10px;
color: #fff;
font-weight: bold;
margin: 0 10px 0 0;
}
section.para03 dl span.step-ico {
color: #000;
font-size: 16px;
font-weight: bold;
}
section.para03 dl span.step-ico span {
display: inline-block;
background: #002E73;
padding: 3px 10px 2px 10px;
border: #fff 1px solid;
border-radius: 10px;
color: #fff;
font-weight: bold;
margin: 0 5px 0 0;
}

section.para03 div.free {
margin: 0 auto 30px auto;
display: flex;
}
section.para03 div.free + p {
margin: 30px 0;
font-weight: bold;
font-size: 110%;
line-height: 1.4;
}
section.para03 div.prc {
display: flex;
justify-content: center;
align-items: center;
width: 100px;
height: 100px;
background: #01559C;
color: #fff;
border: #fff 8px solid;
box-shadow: 0 0 6px #999;
border-radius: 66px;
font-size: 60px;
font-weight: bold;
}
section.para03 div.prc p {
line-height: 1.0;
}
section.para03 div.prc p::first-letter {
font-size:70%;
vertical-align: 2px;
}
section.para03 div.prc p {
letter-spacing: -15px;
margin: 0 0 0 -15px;
}
section.para03 div.free-msg {
padding: 60px 0 0 0;
margin: 0 0 0 15px;
}
section.para03 p.free {
font-size: 2.0rem;
font-weight: bold;
color: #01559C;
}
section.para04 div.inner > p {
font-size: 110%;
font-weight: bold;
padding: 0;
text-align: center;
}

section.para05 table.compare {
margin: 30px auto;
border-collapse: collapse;
border: #fff 1px solid;
border-radius: 17px;
overflow: hidden;
line-height: 1.3;
}
section.para05 table.compare th {
border: #125aa8 1px solid;
background: #125aa8;
color: #fff;
padding: 10px 0;
text-align: center;
vertical-align: middle;
width: 30%;
}
section.para05 table.compare th:first-child {
width: 40%;
}
section.para05 table.compare td {
border: #999 1px solid;
padding: 10px 20px;
vertical-align: middle;
font-weight: bold;
}
section.para05 table.compare tr td:nth-child(n + 2) {
text-align: center;
}


section.para05 p.tel_contact {
font-size: 110%;
text-align: center;
margin: 20px 0 40px 0;
}
section.para05 p.tel_contact span {
font-size: 130%;
font-weight: bold;
}

section.para06 div.app {
display: flex;
flex-wrap: wrap;
width: 90%;
margin: 0 5% 30px 5%;
}
section.para06 p.ttl {
width: 100%;
background: #000;
color: #fff;
text-align: center;
font-size: 20px;
padding: 8px 0;
margin: 0 0 15px 0;
border-radius: 5px;
}
section.para06 p.qr {
width: calc(100% - 160px);
margin: 0 0 0 10px;
}
section.para06 p.qr img {
box-shadow: 0 0 5px #999;
}

p.btn_blue {
width: 80%;
max-width: 420px;
position: relative;
margin:30px auto;
padding:0;
}
p.btn_blue a {
width:100%;
height: 45px;
display:flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 23px;
text-decoration: none;
text-align: center;
font-size: 110%;
background: #01559C;
font-weight: bold;
color: #fff;
border: #fff 2px solid;
box-shadow: 0 0 2px #999;
}
p.btn_blue a:hover {
background: #005aff;
}

p.btn_orange {
width: 80%;
max-width: 420px;
position: relative;
margin:30px auto;
padding:0;
}
p.btn_orange a {
width:100%;
height: 45px;
display:flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 23px;
text-decoration: none;
text-align: center;
font-size: 110%;
background: #ff6900;
font-weight: bold;
color: #fff;
border: #fff 2px solid;
box-shadow: 0 0 2px #999;
}
p.btn_orange a:hover {
background: #ffd800;
}

p.btn_white {
width: 80%;
max-width: 420px;
position: relative;
margin:30px auto;
padding:0;
}
p.btn_white a {
width:100%;
height: 45px;
display:flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 23px;
text-decoration: none;
text-align: center;
font-size: 110%;
background: #fff;
font-weight: bold;
color: #004ea2;
border: #004ea2 2px solid;
box-shadow: 0 0 2px #999;
}
p.btn_white a:hover {
background: #fffde1;
}

p.btn_bottom + p {
text-align: center;
margin: -20px 0 0 0;
}


span.logo_common::before {
content: "";
display: inline-block;
background: url("../images/logo_common_s.png") no-repeat;
background-size: auto 20px;
background-position: left 0 top 4px;
width: 71px;
height: 24px;
margin: 0 3px 0 3px;
}
span.logo_l::before {
content: "";
display: inline-block;
background: url("../images/logo_doconan.png") no-repeat;
background-size: 200px 46px;
background-position: left 0 top 0;
width: 200px;
height: 46px;
margin: 0 3px 0 3px;
}
span.logo_s::before {
content: "";
display: inline-block;
background: url("../images/logo_doconan_s.png") no-repeat;
background-size: 163px 30px;
background-position: left 0 top 0;
width: 168px;
height: 30px;
margin: 0 3px 0 3px;
}
span.logo_alc::before {
content: "";
display: inline-block;
background: url("../images/logo_s_alc.png") no-repeat;
background-size: auto 20px;
background-position: left 0 top 4px;
width: 156px;
height: 24px;
margin: 0 3px 0 3px;
}
span.logo_alc_l::before {
content: "";
display: inline-block;
background: url("../images/logo_l_alc.png") no-repeat;
background-size: auto 30px;
background-position: left 0 top 0;
width: 233px;
height: 30px;
margin: 0 3px 0 3px;
}

p.page_back {
text-align: right;
padding:0;
margin: 0 0 60px 0;
}
p.page_back a {
text-decoration: underline!important;
color: #CC0000 !important;
}
p.page_back a:hover {
text-decoration: none!important;
color: #ff8400 !important;
}

p.blead_crumb {
margin: 10px auto 25px 5px;
}

div.faq {
width: 96%;
margin: 0 auto 50px auto;
}
@scope (div.faq) {
.msg {
width: 100%;
margin:0 auto 60px auto;
line-height: 1.5;
}
h3 {
font-size: 1.05rem;
background: #01559C;
color: #fff;
font-weight: bold;
padding: 5px 10px;
margin: 0 0 30px 0;
}
dl {
margin:0 0 45px 0;
}
dt {
position: relative;
padding: 10px 35px 15px 60px;
margin:0 0 0 0;
font-size:1.0rem;
font-weight:bold;
color:#000;
cursor: pointer;
border-top: #ccc 1px solid;
min-height: 35px;
}
dt::before {
position: absolute;
font-family: 'Font Awesome 5 Free';
font-weight: 600;
content: '\51';
font-size: 30px;
color: #01559C;
line-height: 1.0;
border: #01559C 1px solid;
padding: 8px;
margin: 5px 0;
top: 2px;
left: 0;
}
dt::after {
position: absolute;
font-family: 'Font Awesome 5 Free';
font-weight: 600;
content: '\f078';
font-size: 20px;
color: #01559C;
line-height: 1.0;
top: 15px;
right: 15px;
}
dt.open::after {
content: '\f077';
}
dd {
position: relative;
color:#000;
overflow: hidden;
}
dd div.answer {
border-top: #ccc 1px solid;
padding: 10px 15px 30px 80px;
}
dd::before {
position: absolute;
font-family: 'Font Awesome 5 Free';
font-weight: 600;
content: '\41';
font-size: 30px;
color: #fff;
line-height: 1.0;
background: #01559C;
padding: 8px;
top: 12px;
left: 30px;
}

dd ol li {
text-indent: -1em;
padding-left: 1em;
margin: 0 0 5px 0;
}
dd ul li {
list-style: disc;
margin: 0 0 5px 20px;
}
section.para06 p.ttl {
font-size: 16px;
}
}
}


@media screen and (min-width: 980px) {/*PC*/
.sp {
display: none;
}
div.flex {
display: flex;
flex-wrap: wrap;
}
/* --- SPの横スクロールヒントをPCで無効化 --- */
.scroll-hint-icon,
.scroll-hint-text {
display: none !important;
}

body {
font-family: 'YuGothic', '游ゴシック', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', sans-serif;/*PC*/
font-size: 100%;
line-height: 180%;
color: #000;
text-align: center;
margin: 0px;
padding: 0px;
}
div#wrapper {
text-align: left;
width: 100%;
}
div#container {

}

h2 {
font-size: 30px;
color: #fff;
font-weight: bold;
background: #59c2e1;
text-align: center;
padding: 20px 0;
margin: 0 0 15px 0;
line-height: 1.2;
}

h3 {
text-align: center;
margin:0 0 10px 0;
padding:4px 0 4px 5px;
font-size:26px;
line-height:150%;
color:#47a6c2;
font-weight:bold;
}
h3 + p {
text-align: center;
margin:0 0 15px 0;
padding:4px 0 4px 5px;
font-size:22px;
line-height:130%;
color:#000;
font-weight:bold;
}

.g_menu {
display : none;
}
nav.sp_navi {
display : none;
}
header {
position: relative;
width: 980px;
margin: 0 auto 15px auto;
min-height: 100px;
}
header h1.logo {
float: left;
margin: 20px 0 0 0;
}

header p.btn {
position: absolute;
top: 40px;
right: 0;
}
header p.btn a {
display: block;
width: 230px;
padding: 5px 5px;
background: linear-gradient(180deg, #3333dc, #000096);
color: #fff;
text-decoration: none;
text-align: center;
}
header p.btn a:hover {
background: linear-gradient(0deg, #3333dc, #000096);
}
nav.pc_navi {
width: 100%;
height: 45px;
margin: 0 auto;
background: #000096;
}
nav.pc_navi ul {
width: 978px;
height: 45px;
border-right: #fff 1px solid;
border-left: #fff 1px solid;
margin:0 auto;
padding:0;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
nav.pc_navi li {
width:25%;
margin:0;
line-height: 1.0;
}
nav.pc_navi li a {
height: 30px;
padding: 15px 0 0 0;
background: #000096;
border-right: #fff 1px solid;
color: #fff;
text-align: center;
text-decoration: none;
display: block;
}
nav.pc_navi li:last-child a {
border-right: none;
}

nav.pc_navi li a:hover {
background: #0000d1;
color: #fff100;
}

div#other_service {
width: 980px;
margin:45px auto;
padding:0;
}
div#other_service h2 {
font-size: 22px;
color: #000;
font-weight: bold;
border: #333 1px solid;
background: #eee;
text-align: center;
padding: 8px 5px 5px 5px;
margin: 0 0 35px 0;
}
div#other_service ul {
margin:0 0 0 10px;
padding:0;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
div#other_service li {
width:23%;
margin:0 2% 8px 0;
padding:0;
}
div#other_service li img {
width:100%;
}

div#footer {
width: 100%;
margin: 0 auto;
padding: 30px 0;
background: #000096;
}
div#footer p {
text-align: center;
color: #fff;
}

div.main-visual {
max-width: 1400px;
margin: 0 auto 30px auto;
}
div.catch {
position: relative;
width: 100%;
padding-top: 47.92%;
margin: 0 auto;
}
div.catch .main_image {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
background: url("../images/bg_maincatch.png") no-repeat;
background-size: contain;
}
div.main-visual p.notice {
margin: 10px 0 0 0;
font-size: 150%;
font-weight: bold;
line-height: 1.5;
}

section {
max-width: 900px;
width: 100%;
margin: 0 auto 70px auto;
}
section div.inner {
margin: 0 auto 60px auto;
}
section.para01 ul {
display: flex;
flex-wrap: wrap;
margin: 0 auto 45px auto;
padding: 0;
width: 100%;
}
section.para01 ul li {
width: 30%;
margin: 0 5% 0 0;
}
section.para01 ul li:last-child {
margin: 0;
}
section.para01 .needs {
font-size: 115%;
font-weight: bold;
background: url("../images/arrow.png") no-repeat bottom center;
background-size: auto 100px;
padding: 0 0 120px 0;
margin: 0 0 30px 0;
min-height: 5.0em;
}
section.para01 .solution {
font-size: 120%;
font-weight: bold;
border: #666 3px solid;
border-radius: 15px;
padding: 20px 10px;
box-shadow: 0 0 5px #59c2e1;
text-align: center;
}

section.para02 div.inner {
margin: 0 auto 100px auto;
padding-bottom: 60px;
border-bottom: #666 1px dashed;
}

section.para02 ul.point-nav {
width: 900px;
margin: 30px auto 120px auto;
}
section.para02 ul.point-nav li {
margin: 0 0 25px 0;
padding: 0 0 0 105px;
min-height: 90px;
}
section.para02 ul.point-nav li:nth-child(1) {
background: url("../images/alc-check-point-01.png") no-repeat;
background-position: left 0 top 0;
background-size: 90px auto;
}
section.para02 ul.point-nav li:nth-child(2) {
background: url("../images/alc-check-point-02.png") no-repeat;
background-position: left 0 top 0;
background-size: 90px auto;
}
section.para02 ul.point-nav li:nth-child(3) {
background: url("../images/alc-check-point-03.png") no-repeat;
background-position: left 0 top 0;
background-size: 90px auto;
}

section.para02 ul.point-nav li p.catch {
font-size: 22px;
font-weight: bold;
color: #346A9B;
margin: 0 0 5px 0;
}
section.para02 ul.point-nav li a {
position: relative;
display: flex;
justify-content: space-around;
align-items: center;
margin: 0;
max-width: 200px;
padding: 10px 0px 10px 0;
color: #313131;
transition: 0.3s ease-in-out;
font-weight: 500;
text-decoration: none;
}

section.para02 ul.point-nav li a:before, section.para02 ul.point-nav li a:after {
content: "";
position: absolute;
display: block;
top: 50%;
}
section.para02 ul.point-nav li a:before {
width: 0.5rem;
height: 0.5rem;
left: 1.1rem;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
z-index: 2;
transform: translateY(-50%) rotate(45deg);
transition: all 0.3s;
}
section.para02 ul.point-nav li a:after {
left: 0;
background: #59c2e1;
z-index: 1;
width: 3rem;
height: 3rem;
border-radius: 4rem;
transform: translateY(-50%);
transition: all 0.5s;
}
section.para02 ul.point-nav li a span {
position: relative;
transition: all 0.3s;
z-index: 3;
}

section.para02 ul.point-nav li a:hover span {
color: #fff;
}
section.para02 ul.point-nav li a:hover:before {
left: 2rem;
}
section.para02 ul.point-nav li a:hover:after {
right: 0;
width: 100%;
}

section.para02 div.point-ttl {
position: relative;
margin: 0 auto 60px auto;
padding: 40px;
background: #acdce9;
border-radius: 35px;
}
section.para02 div.point-ttl::after {
position: absolute;
top: -25px;
right: 10px;
content: '';
display: inline-block;
background: url("../images/alc_check_focus_icon.png") no-repeat;
display: inline-block;
background-size: contain;
width: 100px;
height: 94px;
}
section.para02 div.point-ttl h3 {
font-size: 32px;
font-weight: 900;
color: #1abb5d;
-webkit-text-stroke: 5px #fff;
paint-order: stroke;
}
section.para02 div.point-ttl.point01::before {
position: absolute;
top: 20px;
left: 20px;
content: '';
display: inline-block;
background: url("../images/alc-check-point-01.png") no-repeat;
display: inline-block;
background-size: contain;
width: 100px;
height:100px;
}
section.para02 div.point-ttl.point02::before {
position: absolute;
top: 20px;
left: 20px;
content: '';
display: inline-block;
background: url("../images/alc-check-point-02.png") no-repeat;
display: inline-block;
background-size: contain;
width: 100px;
height:100px;
}
section.para02 div.point-ttl.point03::before {
position: absolute;
top: 20px;
left: 20px;
content: '';
display: inline-block;
background: url("../images/alc-check-point-03.png") no-repeat;
display: inline-block;
background-size: contain;
width: 100px;
height:100px;
}

section.para02 div.prepare {
position: relative;
border: #bbb 3px solid;
border-radius: 15px;
margin: 70px auto 45px auto;
padding: 25px 30px 15px 30px;
}
section.para02 div.prepare .title {
position: absolute;
left: -10px;
top: -20px;
display: inline-block;
background: #346a9b;
color: #fff;
font-size: 20px;
font-weight: bold;
padding: 10px 100px 8px 10px;
box-shadow: 15px -10px 0 8px #a0c6e8;
border-radius: 0 15px 0 0;
}

section.para02 ul.stuff {
display: flex;
flex-wrap: wrap;
margin: 0 auto 45px auto;
padding: 0;
width: 100%;
}
section.para02 ul.stuff li {
width: 32%;
margin: 0 2% 0 0;
}
section.para02 ul.stuff li:last-child {
margin: 0;
}
section.para02 .pic {
padding: 0;
margin: 0 0 20px 0;
}
section.para02 .pic + p {
font-size: 115%;
font-weight: bold;
padding: 0;
text-align: center;
}
section.para02 p.nav-back {
text-align: right;
margin: 15px 0;
}
section.para02 h4.admin {
display: inline-block;
position: relative;
left: 50%;
transform: translateX(-50%);
margin:0 auto 10px auto;
padding:8px 25px 6px 25px;
font-size:22px;
line-height:130%;
background:#215F9A;
border-radius: 8px;
color:#fff;
font-weight:bold;
}
section.para02 div.admin_page div.img-pc {
position: relative;
width: 500px;
margin: 30px 0 45px 0;
}
section.para02 div.admin_page div[class^="msg"] p:first-child {
color: #002e73;
font-weight: bold;
font-size: 18px;
}
section.para02 div.admin_page div.msg01-1 {
width: 350px;
padding: 15px;
background: #eee;
position: absolute;
left: 520px;
top: 0;
}
section.para02 div.admin_page div.msg01-2 {
width: 350px;
padding: 15px;
background: #eee;
position: absolute;
left: 520px;
bottom: 60px;
}

section.para02 div.admin_page div.msg02 {
width: 350px;
padding: 15px;
background: #eee;
position: absolute;
left: 520px;
top: 0;
}

section.para02 div.admin_page div.msg03 {
width: 350px;
padding: 15px;
background: #eee;
position: absolute;
left: 520px;
top: 0;
}

section.para02 h4.fare {
color: #215F9A;
font-weight: bold;
width: 70%;
text-align: center;
margin:0 auto 40px auto;
padding:8px 25px 6px 25px;
font-size:22px;
line-height:130%;
border-bottom: #215F9A 3px solid;
}
section.para02 h4.items {
color: #215F9A;
font-weight: bold;
width: 70%;
text-align: center;
margin:0 auto 40px auto;
padding:8px 25px 6px 25px;
font-size:22px;
line-height:130%;
border-bottom: #215F9A 3px solid;
}
section.para02 h4.items + p {
font-weight: bold;
text-align: center;
margin:0 auto 40px auto;
font-size:20px;
line-height:130%;
}
section.para02 h4.items + p span {
font-size:24px;
color: #f00;
}

section.para02 div.price-list {
background: #FBFBFB;
border: #D9D9D9 1px solid;
border-radius: 30px;
padding: 25px;
}
section.para02 div.price-list p.notice {
color: #215F9A;
font-weight: bold;
font-size: 18px;
}
section.para02 div.price-list p.ttl {
color: #215F9A;
font-weight: bold;
text-align: center;
margin:0 auto 40px auto;
padding:8px 25px 6px 25px;
font-size:22px;
line-height:130%;
border-bottom: #215F9A 3px solid;
}
section.para02 div.price-list table {
border: #666 1px solid;
margin: 0 0 25px 0;
}
section.para02 div.price-list table th {
background: #eee;
border: #666 1px solid;
padding: 10px 8px;
text-align: left;
}
section.para02 div.price-list table td {
border: #666 1px solid;
padding: 10px 8px;
}
section.para02 div.price-list table td span {
font-size: 20px;
font-weight: bold;
}
section.para02 div.price-list table td span span {
color: #f00;
}

section.para02 ul.items {
margin:0;
padding:0;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
section.para02 ul.items li {
width:28%;
margin:0 5% 10px 0;
padding:0;
}
section.para02 ul.items li p.pic {
margin: 0 0 10px 0;
}
section.para02 ul.items li p.item-name {
text-align: center;
margin: 0 0 10px 0;
min-height: 3.5em;
}
section.para02 ul.items li p.item-name a {
color: #00479d;
font-size: 110%;
font-weight: bold;
text-decoration: underline;
font-feature-settings: "palt";
}
section.para02 ul.items li p.item-price {
font-size: 16px;
font-weight: bold;
margin: 0 0 10px 0;
}
section.para02 ul.items li p.item-price span.ex-tax {
font-size: 19px;
color: #f00;
}
section.para02 ul.items dl {
display: flex;
flex-wrap: wrap;
}
section.para02 ul.items dt {
width: 3.5em;
padding: 0 10px 0 0;
margin: 0;
}
section.para02 ul.items dd {
width: calc(100% - 3.5em - 10px);
padding: 0;
margin: 0;
}

section.para03 dl {
background: url("../images/img_flow.png") no-repeat bottom center;
margin: 25px 0;
padding: 0 0 10px 0;
font-size: 20px;
line-height: 1.6;
}
section.para03 dl:last-child {
background: none;
margin: 25px 0 40px 0;
}
section.para03 dt {
background: #eee;
border-radius: 25px 25px 0 0;
padding: 25px 25px 15px 25px;
margin: 20px 0 0 0;
font-size: 22px;
font-weight: bold;
}
section.para03 dd {
background: #eee;
border-radius: 0 0 25px 25px;
padding: 0 25px 25px 25px;
margin: 0 0 25px 0;
}
section.para03 dl span.step {
display: inline-block;
background: #002E73;
padding: 5px 20px 3px 20px;
border: #fff 1px solid;
border-radius: 10px;
color: #fff;
font-weight: bold;
margin: 0 15px 0 0;
}
section.para03 dl span.step-ico {
color: #000;
font-size: 20px;
font-weight: bold;
}
section.para03 dl span.step-ico span {
display: inline-block;
background: #002E73;
padding: 4px 15px 2px 15px;
border: #fff 1px solid;
border-radius: 10px;
color: #fff;
font-weight: bold;
margin: 0 5px 0 0;
}

section.para03 div.free {
margin: 0 auto 30px auto;
display: flex;
width: 400px;
}
section.para03 div.free + p {
margin: 30px 0;
font-weight: bold;
font-size: 140%;
line-height: 1.6;
}
section.para03 div.prc {
display: flex;
justify-content: center;
align-items: center;
width: 120px;
height: 120px;
background: #01559C;
color: #fff;
border: #fff 10px solid;
box-shadow: 0 0 6px #999;
border-radius: 76px;
font-size: 80px;
font-weight: bold;
}
section.para03 div.prc p {
line-height: 1.0;
}
section.para03 div.prc p::first-letter {
font-size:70%;
vertical-align: 2px;
}
section.para03 div.prc p {
letter-spacing: -25px;
margin: 0 0 0 -15px;
}
section.para03 div.free-msg {
padding: 60px 0 0 0;
margin: 0 0 0 15px;
}
section.para03 p.free {
font-size: 2.4rem;
font-weight: bold;
color: #01559C;
}

section.para04 div.inner > p {
font-size: 120%;
font-weight: bold;
padding: 0;
text-align: center;
}

section.para05 table.compare {
width: 600px;
margin: 30px auto;
border-collapse: collapse;
border: #fff 1px solid;
border-radius: 17px;
overflow: hidden;
line-height: 1.3;
}
section.para05 table.compare th {
border: #125aa8 1px solid;
background: #125aa8;
color: #fff;
padding: 10px 0;
text-align: center;
vertical-align: middle;
width: 30%;
}
section.para05 table.compare th:first-child {
width: 40%;
}
section.para05 table.compare td {
border: #999 1px solid;
padding: 10px 20px;
vertical-align: middle;
font-weight: bold;
}
section.para05 table.compare tr td:nth-child(n + 2) {
text-align: center;
}


section.para05 p.tel_contact {
font-size: 120%;
text-align: center;
margin: 20px 0 40px 0;
}
section.para05 p.tel_contact span {
font-size: 150%;
font-weight: bold;
}

section.para06 div.app {
width: 40%;
margin: 0 5%;
}
section.para06 p.ttl {
background: #000;
color: #fff;
text-align: center;
font-size: 20px;
padding: 8px 0;
margin: 0 0 15px 0;
border-radius: 5px;
}
section.para06 p.qr {
margin: 35px 0 0 0;
}
section.para06 p.qr img {
box-shadow: 0 0 5px #999;
}

p.btn_blue {
width: 80%;
max-width: 420px;
position: relative;
margin:30px auto;
padding:0;
}
p.btn_blue a {
width:100%;
height: 45px;
display:flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 23px;
text-decoration: none;
text-align: center;
font-size: 140%;
background: #01559C;
font-weight: bold;
color: #fff;
border: #fff 2px solid;
box-shadow: 0 0 2px #999;
}
p.btn_blue a:hover {
background: #005aff;
}

p.btn_orange {
width: 80%;
max-width: 420px;
position: relative;
margin:30px auto;
padding:0;
}
p.btn_orange a {
width:100%;
height: 45px;
display:flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 23px;
text-decoration: none;
text-align: center;
font-size: 140%;
background: #ff6900;
font-weight: bold;
color: #fff;
border: #fff 2px solid;
box-shadow: 0 0 2px #999;
}
p.btn_orange a:hover {
background: #ffd800;
}

p.btn_white {
width: 80%;
max-width: 420px;
position: relative;
margin:30px auto;
padding:0;
}
p.btn_white a {
width:100%;
height: 45px;
display:flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 23px;
text-decoration: none;
text-align: center;
font-size: 140%;
background: #fff;
font-weight: bold;
color: #004ea2;
border: #004ea2 2px solid;
box-shadow: 0 0 2px #999;
}
p.btn_white a:hover {
background: #fffde1;
}

p.btn_bottom + p {
text-align: center;
margin: -20px 0 0 0;
}

span.logo_common::before {
content: "";
display: inline-block;
background: url("../images/logo_common_s.png") no-repeat;
background-size: auto 20px;
background-position: left 0 top 4px;
width: 71px;
height: 24px;
margin: 0 3px 0 3px;
}
span.logo_l::before {
content: "";
display: inline-block;
background: url("../images/logo_doconan.png") no-repeat;
background-size: 245px 56px;
background-position: left 0 top 0;
width: 250px;
height: 56px;
margin: 0 3px 0 3px;
}
span.logo_s::before {
content: "";
display: inline-block;
background: url("../images/logo_doconan_s.png") no-repeat;
background-size: 163px 30px;
background-position: left 0 top 0;
width: 168px;
height: 30px;
margin: 0 3px 0 3px;
}
span.logo_alc::before {
content: "";
display: inline-block;
background: url("../images/logo_s_alc.png") no-repeat;
background-size: auto 20px;
background-position: left 0 top 4px;
width: 156px;
height: 24px;
margin: 0 3px 0 3px;
}
span.logo_alc_l::before {
content: "";
display: inline-block;
background: url("../images/logo_l_alc.png") no-repeat;
background-size: auto 30px;
background-position: left 0 top 0;
width: 233px;
height: 30px;
margin: 0 3px 0 3px;
}

p.page_back {
text-align: right;
padding:0;
margin: 0 0 60px 0;
}
p.page_back a {
text-decoration: underline!important;
color: #CC0000 !important;
}
p.page_back a:hover {
text-decoration: none!important;
color: #ff8400 !important;
}

p.blead_crumb {
width: 980px;
margin: 20px auto 35px auto;
}

div.faq {
width: 980px;
margin: 0 auto 50px auto;
}
@scope (div.faq) {
.msg {
width: 980px;
margin:0 auto 60px auto;
line-height: 1.5;
}
h3 {
font-size: 1.2rem;
display: inline-block;
background: #01559C;
color: #fff;
font-weight: bold;
padding: 5px 20px;
margin: 0 0 40px 0;
}
dl {
margin:0 0 45px 20px;
}
dt {
position: relative;
padding: 15px 0 15px 60px;
margin:0 0 0 0;
font-size:1.2rem;
font-weight:bold;
color:#000;
cursor: pointer;
border-top: #ccc 1px solid;
min-height: 30px;
}
dt::before {
position: absolute;
font-family: 'Font Awesome 5 Free';
font-weight: 600;
content: '\51';
font-size: 30px;
color: #01559C;
line-height: 1.0;
border: #01559C 1px solid;
padding: 8px;
margin: 5px 0;
top: 2px;
left: 0;
}
dt::after {
position: absolute;
font-family: 'Font Awesome 5 Free';
font-weight: 600;
content: '\f078';
font-size: 20px;
color: #01559C;
line-height: 1.0;
top: 20px;
right: 30px;
}
dt.open::after {
content: '\f077';
}
dd {
position: relative;
color:#000;
overflow: hidden;
}
dd div.answer {
border-top: #ccc 1px solid;
padding: 15px 15px 60px 120px;
}
dd::before {
position: absolute;
font-family: 'Font Awesome 5 Free';
font-weight: 600;
content: '\41';
font-size: 30px;
color: #fff;
line-height: 1.0;
background: #01559C;
padding: 8px;
top: 12px;
left: 60px;
}

dd ol li {
text-indent: -1em;
padding-left: 1em;
margin: 0 0 5px 0;
}
dd ul li {
list-style: disc;
margin: 0 0 5px 20px;
}
}
}


.page_top{
width: 50px;
height: 50px;
position: fixed;
right: 10px;
bottom: 20px;
background: #000096;
opacity: 0.9;
border: transparent;
border-radius: 3px;
z-index: 100;
}
.page_top a{
position: relative;
display: block;
width: 50px;
height: 50px;
text-decoration: none;
}
.page_top a::before{
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: '\f106';
font-size: 25px;
color: #fff;
position: absolute;
width: 25px;
height: 25px;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
text-align: center;
}

