@charset 'UTF-8';
@media screen and (min-width: 480px){ /*pc*/
}
@media screen and (max-width: 479px){ /*sp*/
}

.reimg img{ width: 100%; height: auto;}
img.full{ width: 100%; height: auto;}
.fa-xs{ vertical-align: middle !important;}
.icon-yellow{ color: #bdb99e;}
button{ background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none;}

.table-middle th{ vertical-align: middle !important;}
.table-middle td{ vertical-align: middle !important; letter-spacing: 0.9 !important;}
.table-archive{}
.table-archive th{ text-align: center; vertical-align: middle !important;}
.table-archive td{ text-align: center; vertical-align: middle !important;}
.table-market{ border: 4px solid #666;}

.nav-order a{ color: white !important; text-shadow: 1px 1px 0px #004100;}

.hover		{ position: relative; -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; transition: all .3s ease-out;}
.hover:hover { opacity: .8; text-decoration: none;}
.hover-scale	{ position: relative; -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; transition: all .3s ease-out;}
.hover-scale:hover { -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2);}

/* ----------------------------------------------------nav */
@media screen and (min-width: 480px){ /*pc*/
.pc-header{ height: 100px;}
.navbar-collapse{ flex-grow: inherit !important;}
ul.navbar-nav{}
ul.navbar-nav li{ border-left: 1px solid #ccc;}
ul.navbar-nav li a.gnavi{ position: relative; display: block; margin: 0 auto; padding: 16px 0; font-size: 16px; color: #222; background: #fff; width: 125px; z-index: 2; overflow: hidden;}
ul.navbar-nav li a.gnavi::after { background: #222; content: ''; position: absolute; z-index: -1;}
ul.navbar-nav li a.gnavi::after { height: 100%; left: 0; top: 0; width: 0;}
ul.navbar-nav li a.gnavi:hover:after { width: 100%;}
ul.navbar-nav li a.gnavi:hover{ color: #fff !important; text-decoration: none;}
.dropdown-toggle2::before { display: inline-block; position: absolute; bottom: 5px; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-bottom: 0; border-left: .3em solid transparent;}
.dropdown-toggle3::before { display: inline-block; position: absolute; bottom: 5px; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-bottom: 0; border-left: .3em solid transparent;}
.dropdown-menu.show{ padding: 36px !important; width: 680px !important; top: calc(100% + 10px); left: -265px;}
.dropdown-menu.show:before { content: ""; position: absolute; top: -24px; left: 50%; margin-left: -12px; border: 12px solid transparent; border-bottom: 12px solid #FFF; z-index: 2;}
.dropdown-menu.show:after { content: ""; position: absolute; top: -27px; left: 50%; margin-left: -13px; border: 13px solid transparent; border-bottom: 13px solid #ddd; z-index: 1;}
ul.navbar-nav li a.contact{ position: relative; display: block; margin: 0 auto; padding: 16px 0; font-size: 16px; color: #222; background: #fff; width: 150px; z-index: 2; overflow: hidden;}
ul.navbar-nav li a.contact::after { background: #00b020; content: ''; position: absolute; z-index: -1;}
ul.navbar-nav li a.contact::after { height: 100%; left: 0; top: 0; width: 0;}
ul.navbar-nav li a.contact:hover:after { width: 100%;}
ul.navbar-nav li a.contact:hover{ color: #fff !important; text-decoration: none;}
.dropdown-menu2.show{ padding: 36px !important; width: 500px !important; top: calc(100% + 10px); left: -348px;}
.dropdown-menu2.show:before { content: ""; position: absolute; top: -24px; left: 84.7%; margin-left: -12px; border: 12px solid transparent; border-bottom: 12px solid #FFF; z-index: 2;}
.dropdown-menu2.show:after { content: ""; position: absolute; top: -27px; left: 84.7%; margin-left: -13px; border: 13px solid transparent; border-bottom: 13px solid #ddd; z-index: 1;}
.gnavi_brand_box{border-bottom: 1px solid #eee;}
.gnavi_brand_box:nth-child(n+1){ border-right: 1px solid #eee;}
.gnavi_brand_box{ text-align: center;}
.gnavi_brand_box a{ position: relative; display: block; margin: 0 auto; padding: 8px; font-size: 14px; color: #888; background: #fff;  width: 100%; z-index: 2; overflow: hidden;}
.gnavi_brand_box a::after { background: #f9f9f9; content: ''; position: absolute; z-index: -1;}
.gnavi_brand_box a::after { height: 100%; left: 0; top: 0; width: 0;}
.gnavi_brand_box a:hover:after { width: 100%;}
.gnavi_brand_box a:hover{ text-decoration: none;}
.dropdown-menu2 .gnavi_brand_box_contact a{ padding: 16px 8px;}
.gnavi_brand_box_contact{border-bottom: 1px solid #eee;}
.gnavi_brand_box_contact{ text-align: center;}
.gnavi_brand_box_contact a{ position: relative; display: block; margin: 0 auto; padding: 8px; font-size: 14px; color: #888; background: #fff;  width: 100%; z-index: 2; overflow: hidden;}
.gnavi_brand_box_contact a::after { background: #f9f9f9; content: ''; position: absolute; z-index: -1;}
.gnavi_brand_box_contact a::after { height: 100%; left: 0; top: 0; width: 0;}
.gnavi_brand_box_contact a:hover:after { width: 100%;}
.gnavi_brand_box_contact a:hover{ text-decoration: none;}
.mt-header{ margin-top: 100px;}
.single-mainvis{ height: 400px;}
.single-icon img{ margin: -40px 0 0 0; width: 90px; height: 90px; border: 4px solid #fff; border-radius: 100px; }
.text-right-sm{ text-align: right;}
.single-cta{ display: none;}
}
@media screen and (max-width: 480px){ /*sp*/
.pl-0-xs{padding-left: 0}
.pr-0-xs{padding-right: 0}
ul.navbar-nav li a.gnavi{ padding: 18px 0;}
ul.navbar-nav li a.contact{ padding: 18px 0;}
ul.navbar-nav li{ border-top: 1px solid #ccc;}
ul.navbar-nav li:first-child{ border: none;}
.dropdown-toggle2::before { display: inline-block; position: absolute; left: 100px; content: ""; border-top: .32em solid; border-right: .32em solid transparent; border-bottom: 0; border-left: .32em solid transparent;}
.dropdown-toggle3::before { display: inline-block; position: absolute; left: 125px; content: ""; border-top: .32em solid; border-right: .32em solid transparent; border-bottom: 0; border-left: .32em solid transparent;}
.dropdown.show .dropdown-toggle2::before { display: inline-block; position: absolute; left: 100px; content: ""; border-top: 0; border-right: .32em solid transparent; border-bottom: .32em solid; border-right: .32em solid transparent;}
.dropdown.show .dropdown-toggle3::before { display: inline-block; position: absolute; left: 125px; content: ""; border-top: 0; border-right: .32em solid transparent; border-bottom: .32em solid; border-left: .32em solid transparent;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='1' stroke-linecap='round' stroke-miterlimit='5' d='M6 6L 24 24M24 6L6 24'/%3E%3C/svg%3E");}
button.navbar-toggler:focus{ outline: none !important;}
.dropdown-menu.show{ padding: 0 !important; border: none;}
.gnavi_brand_box{ padding: 2; border-bottom: 1px solid #eee;}
.gnavi_brand_box{ text-align: center;}
.gnavi_brand_box a{ position: relative; display: block; margin: 0 auto; padding: 8px; font-size: 14px; color: #888; background: #fff;  width: 100%; z-index: 2; overflow: hidden;}
.gnavi_brand_box a::after { background: #f9f9f9; content: ''; position: absolute; z-index: -1;}
.gnavi_brand_box a::after { height: 100%; left: 0; top: 0; width: 0;}
.gnavi_brand_box a:hover:after { width: 100%;}
.gnavi_brand_box a:hover{ text-decoration: none;}
.gnavi_brand_box_contact a{ position: relative; display: block; margin: 0 auto; padding: 12px 0; font-size: 14px; color: #888; background: #fff;  width: 100%; z-index: 2; overflow: hidden; border-top: 1px solid #ddd;}
.gnavi_brand_box_contact a::after { background: #f9f9f9; content: ''; position: absolute; z-index: -1;}
.gnavi_brand_box_contact a::after { height: 100%; left: 0; top: 0; width: 0;}
.gnavi_brand_box_contact a:hover:after { width: 100%;}
.gnavi_brand_box_contact a:hover{ text-decoration: none;}
.mt-header{ margin-top: 60px;}
.single-mainvis{ height: 300px;}
.single-icon img{ width: 56px; height: 56px; border: 4px solid #fff; border-radius: 60px; box-shadow: 0px 0px 3px 3px #eee;}
.single-cta{ position: fixed; display: block; margin-top: 48px; padding: 8px; bottom: 0; border-top: 1px solid #eee; background: #f9f9f9; width: 100%;}
.single-cta a.btn-estimate{ display: block; padding: 12px 0; font-size: 14px; color: #fff; font-weight: bold; width: 100%; text-align: center; border-radius: 4px; background: #009b06; box-shadow: 0px 2px 0px black}
}

/* ----------------------------------------------------a */
a,a::after{  -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s;}
a.underline{ color: #333; text-decoration: underline;}
a.underline:visited{ color: #6b0085; text-decoration: underline;}

/* ----------------------------------------------------single */
.single{}
.single h2{ margin: 3em 0 2em; font-size: 24px; font-weight: bold; color: #666;}
.single h3{ margin: 2em 0 1em; font-size: 20px; font-weight: bold; color: #006c90;}
.single h4{ margin: 1em 0 1em; font-size: 18px; font-weight: bold; color: #999;}

.single-budge-off{ background: #eee; color: #aaa;}
.single-budge-on{ background: #fd9283; color: #fff; font-weight: bold;}

.budge-case{ margin: 0 8px 12px 0; font-size: 75%; padding: 4px 16px; border-radius: 40px;}
.budge-case-1{ background: #ece3e3;}
.budge-case-2{ background: #e6e6c9;}
.budge-case-3{ background: #cee3e6;}
.budge-case-4{ background: #eee;}
.budge-case-structure1{ background: #004902; color: white;}
.budge-case-structure2{ background: #7c4600; color: white;}
.budge-case-structure3{ background: #000248; color: white;}
.budge-case-structure1:before { font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: 900; content: "\f1bb"; margin-right: 6px; font-size: 80%;}
.budge-case-structure2:before { font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: 900; content: "\f54f"; margin-right: 6px; font-size: 80%;}
.budge-case-structure3:before { font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: 900; content: "\f1ad"; margin-right: 6px; font-size: 80%;}

.single-staff{ margin: 0 0 6em;}
.single-staff ul.nav-tabs{ border: none;}
.single-staff ul.nav-tabs li{ position: relative;}
.single-staff ul.nav-tabs a.nav-link{ border: none; color: #000; font-weight: normal; font-size: 12px}
.single-staff ul.nav-tabs a.nav-link img{ margin: 0 0 8px;}
.single-staff ul.nav-tabs a.nav-link.active{ border: none; transform:scale(1.2); transition: .1s;}
.single-staff ul.nav-tabs a.nav-link.active:after{ 
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
   bottom: -34px;
  width: 120px;
  height: 40px;
  border: 4px solid #fff;
  border-width: 19px 42px;
  background-color: #aaa;
  border-radius: 2px;
}
.single-staff .tab-content{ margin: 40px 0 24px;}

dl.single-faq { margin: 3em 0 6em;}
dl.single-faq dt { position: relative; background: #f9f9f9; margin: 24px 0; padding: 0.25em 0.5em; border-left: solid 2em #006c90; border-radius: 4px;}
dl.single-faq dt:before { content: "Q"; position: absolute; padding: 0em; color: white; font-weight: 900; left: -1.35em; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
dl.single-faq dd{ margin: 8px 0 16px 42px;}

dl.single-flow{ position: relative; padding: 12px; border: 2px solid #eee; border-radius: 8px;}
.flow dl.single-flow:last-child::after{ display: none;}
.flow dl.single-flow:after{font-family: "Font Awesome 5 Free"; content: "\f0d7"; font-weight: 900; position:absolute; top: calc(100% + 10px); right: 50%; transform: translateY(-50%); transition: 0.2s; color: #ccc;}
dl.single-flow dt { margin: 1em 0; width: 100%; font-size: 20px; color: #006c90; text-align: center; border-bottom: 1px solid #006c90;}
dl.single-flow dd { margin: 0;}
	@media screen and (min-width: 480px){ /*pc*/
	dl.single-flow dt { width: 200px; text-align: left; border-right: 1px solid #006c90; border-bottom: none;}
	dl.single-flow dd{ padding: 0 0 0 24px; width: calc(100% - 200px);}
	}
dl.single-first{}
dl.single-first dt{ position: relative; margin: 2em 0 .5em; padding: 12px 4px 12px 36px; font-size: 18px;}
dl.single-first dt:before{ position: absolute; top: 0; bottom: 0; left: 0; width: 16px; height: 4px; margin: auto; background: #4fa5bf; content:'';}
dl.single-first dd{ margin: 0 0 0 36px;}


dl.single-case-detail{ display: block; margin-bottom: 4px; font-size: 14px; border: 1px solid #ddd; border-radius: 4px; width: 100%;}
dl.single-case-detail dt{ float: left; padding: 4px 12px; background: #eee; width: 120px; height: 100%; font-weight: normal; border-radius: 4px 0 0 4px;}
dl.single-case-detail dd{ float: left; margin: 0; padding: 4px 12px;}
.desc ul { position: relative; margin: 2.5em 0 0; padding: 0; border: 1px solid #bdb99e; background: #fcfcfc; border-radius: 0 8px 8px 8px;}
.desc ul li { padding: 6px 0 6px 32px; list-style-type: none !important; border-bottom: 1px dashed #ccc;}
.desc ul li:last-child{ border-bottom: none;}
.desc ul li:before { position: absolute; font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: 900; content: "\f00c"; left : 8px; color: #bdb99e;}
.desc ul li:after { position: absolute; padding: 4px 8px 3px; background: #bdb99e; color: #fff; font-size: 80%; font-weight: 900; left: -2px; bottom: 100%; border-radius: 8px 8px 0 0; letter-spacing: 1.65;
font-family: var(--fa-style-family, "Font Awesome 6 Free");
content: '\f0eb この会社の特徴';}


.table-container { position: relative; overflow-x: auto; white-space: nowrap;}

.scroll-hint { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: rgba(0, 0, 0, 0.5); color: #fff; font-weight: 700; line-height: 1.4; display: none; animation: hint-animation 2s infinite ease-in-out;}
@keyframes hint-animation {
  0% { transform: translate(-50%, -50%);}
  50% { transform: translate(-40%, -50%);}
  100% { transform: translate(-50%, -50%);}
}
.scroll-hint-block { display: block;}

.table-price { text-align: center; vertical-align: middle;  overflow-x: scroll; white-space: nowrap; width: 100%;}
.table-price th{ font-weight: normal; font-size: 13px; vertical-align: middle; background: #f9f9f9;}
.table-price td{ vertical-align: middle;}

.free-estimate{ margin: 4em 0; padding: 24px; text-align: center; border: 4px solid #ccc; border-radius: 4px;}


/* ----------------------------------------------------front-page */
.area{}
.area .dt{ padding: 8px 0; font-weight: bold;}
.area .dd ul{ margin: 0; padding: 8px 0;}
.area .dd ul li{ position: relative; display: inline-block; list-style: none;}
.area .dd ul li a{ display: block; margin: 0 0 4px; padding: 5px 18px 4px 32px; color: #006c90; border: 2px solid #006c90; border-radius: 30px; font-size: 14px; text-align: left;}
.area .dd ul li a:hover{  background: #006c90; color: #fff; text-decoration: none; font-weight: bold;}
.area .dd ul li i{ position: absolute; left: 15%; top: 50%; transform: translateY(-50%);}

a.top-service-btn{ display: block; margin: 0 0 8px; padding: 8px; color: #333; border: 1px solid #ccc; border-radius: 4px; }
a.top-service-btn:hover{ opacity: 0.65; text-decoration: none;}
a.top-service-btn .tit{ margin: 0; font-size: 130%; font-weight: bold;}
a.top-service-btn .desc{ margin: 0; font-size: 80%;}

/* ----------------------------------------------------category */
.cat-mainvis{ padding: 4% 0 0; height: 350px; background-size: cover; background-position: center center; background-repeat: no-repeat;}
.cat-mainvis-box{ padding: 3%; width: 80%; margin: 0 auto; text-align: center; background: rgba(0, 0, 0, 0.5);}
.cat-mainvis-box h1{ font-size: 250%; color: #fff; font-weight: bold;}
.cat-mainvis-box p.desc{ color: white;}

.search{}
.search h3{ font-weight: bold; font-size: 20px; color: #666;}
.search-box{ margin: 2em 0; padding: 16px 16px 0; border: 8px solid #d2e2e6;}

button.search { position: relative; margin: 0 auto; padding: 14px 36px 12px 54px; color: #fff; background-color: #094; font-size: 18px; font-weight: bold; border-radius: 30px; border-bottom: 4px solid #00672e;}
button.search:hover { margin-top: 3px; color: #fff; background: #00a34b; border-bottom: 1px solid #00672e; text-decoration: none; font-weight: bold; }
a.btn-c i.fa { margin-right: 1rem;}
.search-box button.search:after { position: absolute; margin: 0; padding: 0; font-family: var(--fa-style-family, "Font Awesome 6 Free");font-size: 16px; font-weight: 900; line-height: 1; top: 50%; left: 24px;content: "\f002"; transform: translateY(-50%);}
.search-box button.search:hover:after { content: "\f00e";}
.search-box button.search:active:after { content: "\f00e";}

a.more-accordion{ position: relative; display: block; margin: 24px 0; color: #006c90; text-decoration: none; border-top: 1px solid #006c90; font-size: 12px; cursor:pointer;}
a.more-accordion span{ position: absolute; padding:4px 32px 4px 18px; background: #fff; top: 0px; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
a.more-accordion:after { font-family: "Font Awesome 5 Free"; content: "\f0d7"; font-weight: 900; position:absolute; top: 50%; right: calc(50% - 64px); transform: translateY(-50%); transition: 0.2s;}
a.more-accordion.selected:after { transform: translateY(-50%) rotateX(180deg);}
a.town-list{ display: block; padding: 5px 0 4px 48px; color: #006c90; border: 2px solid #006c90; border-radius: 30px; font-size: 14px; text-align: left;}
a.town-list:hover{ background: #006c90; color: #fff; text-decoration: none; font-weight: bold;}
a.town-list i{ position: absolute; left: 23%; top: 50%; transform: translateY(-50%);}

.sort-container{ border: 1px solid #15aabf; border-radius: 8px;}
.sort-head{ padding: 4px 0; font-size: 12px; background: #15aabf; color: white; text-align: center; border-radius: 7px 7px 0 0;}
.sort-body{ padding: 16px 8px;}
.sort-body button.sort-btn{ display: block; padding: 8px; width: 100%; border: 2px solid #006c90; background: #fff; color: #006c90; border-radius: 40px;}
.sort-body button.sort-btn:hover{ background: #006c90; color: #fff; font-weight: bold; opacity: 0.7;}
.sort-body .sort-btn.selected{ display: block; background: #006c90; color: #fff; font-weight: bold;}


.cat h2{ margin: 2.6em 0 1.8em; font-size: 24px; font-weight: bold; color: #666;}
.cat h2 span.estimate{ margin: 0 0 0 12px; padding: 4px; border: 1px solid #f74b00; color: #f74b00;}
.cat h3{ margin: 2em 0 1em; font-size: 20px; font-weight: bold; color: #006c90;}
.cat h4{ margin: 1em 0 1em; font-size: 18px; font-weight: bold; color: #999;}
.cat-box{ margin: 16px 0 0;}
.cat-box a{ display: block; padding: 1em; color: #222; border: 3px solid #eee;}
.cat-box a:hover{ background: #f9f9f9; text-decoration: none; border: 3px solid #00abd6;}
.cat-box a .link{ font-weight: bold; color: #00abff}
.cat-box a:hover .link{color: #00abd6; text-decoration: underline;}
.cat-box h2{ font-size: 20px;}
.cat-box ul { position: relative; margin: 2em 0 0; padding: 0; border: 1px solid #bdb99e; background: #fcfcfc; border-radius: 0 8px 8px 8px;}
.cat-box ul li { padding: 6px 0 6px 32px; list-style-type: none !important; border-bottom: 1px dashed #ccc;}
.cat-box ul li:last-child{ border-bottom: none;}
.cat-box ul li:before { position: absolute; font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: 900; content: "\f00c"; left : 8px; color: #bdb99e;}
.cat-box ul li:after { position: absolute; padding: 4px 8px 3px; background: #bdb99e; color: #fff; font-size: 80%; font-weight: 900; left: -2px; bottom: 100%; border-radius: 8px 8px 0 0; letter-spacing: 1.65;
font-family: var(--fa-style-family, "Font Awesome 6 Free");
content: '\f0eb この会社の特徴';}

/* ----------------------------------------------------pagenation */
nav.pagenation{ margin: 2em 0; text-align: center;}
nav.pagenation .page-numbers{ padding: 8px 12px;}
nav.pagenation .current{ font-weight: bold;}
nav.pagenation a{ color: #444; border: 1px solid #ccc; border-radius: 8px;}
nav.pagenation a:hover{ border: 1px solid #4bb6e3; background: #def2ff; color: #033a6f; text-decoration: none;}

/* ----------------------------------------------------column */
.bg-column { background-image:  linear-gradient(#eee 1px, transparent 1px), linear-gradient(to right, #eee 1px, #fafafa 1px); background-size: 24px 24px;}
.column h1{ margin: 0 0 .1em; padding: 16px 12px 16px 24px; font-size: 130%; line-height: 1.65; color: #111; background: #fafafa; border-radius: 12px;}
.column h2{ margin: 3em 0 1em; font-size: 24px; font-weight: bold; color: #444;}
.column h3{ margin: 2em 0 1em; font-size: 20px; font-weight: bold; color: #666;}
.column h4{ margin: 1em 0; font-size: 18px; font-weight: bold; color: #888;}
.column h5{ margin: 1em 0; font-size: 18px; font-weight: bold; color: #aaa;}
.column ul{ margin: 1em 0; padding: 12px 12px 12px 36px; border: 8px solid #eee; border-radius: 6px; background: #fdfdfd;}
.column ul li{ padding: 6px;}
.column ol{ margin: 1em 0; padding: 12px 12px 12px 42px;}
.column ol li{ padding: 6px;}

.cta-column{}
.cta-column .thumb{ height: 150px; overflow: hidden; border-radius: 8px;}
.cta-column .thumb img{ margin-bottom: calc(50% - 150px/2); }
.cta-column .thumb:hover{ opacity: .65; border: 8px solid #fff;}


/* ----------------------------------------------------page */
.page h2{ margin: 5em 0 1em; padding: 24px; font-size: 20px; font-weight: bold; color: #111; border: 2px solid #a8a399; }
.page h3{ position: relative; margin: 4em 0 1.5em; padding: 12px 4px 12px 36px; font-size: 18px;}
.page h3:before{ position: absolute; top: 0; bottom: 0; left: 0; width: 16px; height: 4px; margin: auto; background: #4fa5bf; content:'';}
.page h4{ margin: 3em 0 2em; font-size: 19px; font-weight: normal; color: #666;}
.page h5{ margin: 1em 0; font-size: 18px; font-weight: bold; color: #aaa;}
.page ul{ margin: 1em 0; padding: 12px 12px 12px 36px; border: 8px solid #eee; border-radius: 6px; background: #fdfdfd;}
.page ul li{ padding: 3px;}
.page ul.list{ margin: 1em 0; padding: 12px 12px 12px 36px; border: 1px solid #eee; border-radius: 6px; background: #fffaf1;}
.page ul.list li{ padding: 6px; list-style: circle;}
.page ol{ margin: 1em 0; padding: 12px 12px 12px 42px; border: 1px solid #ddd;}
.page ol li{ padding: 6px;}
a.btn-dl{ display: block; margin: 4em 0; padding: 8px; background: #f2e600; color: #000; font-weight: bold; box-shadow: 0px 5px 0px #806600; border: 2px solid #111; text-align: center; border-radius: 8px;}
a.btn-dl:hover{ margin-top: calc(4em + 3px); margin-bottom: calc(4em - 3px); box-shadow: 0px 2px 0px #806600; text-decoration: none;}
a.btn-delate{ display: block; margin: 4em 0; padding: 8px; background: #0071c2; color: #fff; font-weight: bold; box-shadow: 0px 5px 0px #003f4d; border: 2px solid #111; text-align: center; border-radius: 8px;}
a.btn-delate:hover{ margin-top: calc(4em + 3px); margin-bottom: calc(4em - 3px); box-shadow: 0px 2px 0px #003f4d; text-decoration: none;}
a.btn-plan1 { position: relative; display: block; margin: 4em 0; padding: 14px 36px 12px 54px; color: #fff; background-color: #094; font-size: 18px; font-weight: bold; border-radius: 30px; border-bottom: 4px solid #00672e;}
a.btn-plan1:hover { display: block;margin-top: calc(4em + 3px); margin-bottom: calc(4em - 3px); color: #fff; background: #00a349; border-bottom: 1px solid #00672e; text-decoration: none; font-weight: bold;}
.page dl.list { margin: 1em 0; padding: 1em 0; border-top: 3px double #ccc; border-bottom: 3px double #ccc;}
.page dl.list dt{ font-weight: normal; font-size: 18px;}
.page dl.list dd{ margin: .4em 0 2em;}

a.btn-plan1{ display: block; margin: 4em 0; padding: 16px; background: #138700; color: #fff; text-shadow: 1px 1px 0px #333; font-weight: bold; text-align: center; border-radius: 30px;}
a.btn-plan2{ display: block; margin: 4em 0; padding: 8px; background: #f2e600; color: #000; font-weight: bold; box-shadow: 0px 5px 0px #807a00; border: 2px solid #111; text-align: center; border-radius: 8px;}
a.btn-plan2:hover{ margin-top: calc(4em + 3px); margin-bottom: calc(4em - 3px); box-shadow: 0px 2px 0px #807a00; text-decoration: none;}

.page dl.faq{}
.page dl.faq dt{ position: relative; margin: 0 0 1em; padding: 12px 36px 12px 12px; border: 2px solid #ccc; border-radius: 12px; cursor:pointer; font-weight: normal;}
.page dl.faq dt:hover{ background: #e7f2f5; border: 2px solid #4da4be;}
.page dl.faq dt.selected{ background: #006c90; border: 2px solid #156a83; color: white; font-weight: bold;}
.page dl.faq dt:after{ font-family: "Font Awesome 5 Free"; content: "\f0d7"; font-weight: 900; position:absolute; top: 50%; right: 12px; transform: translateY(-50%); transition: 0.2s;}
.page dl.faq dt.selected:after { transform: translateY(-50%) rotateX(180deg);}
.page dl.faq dd{ margin: 0 0 2em 12px; padding: 12px; border-left: 2px solid #4da4be;}


a.more-accordion span{ position: absolute; padding:4px 32px 4px 18px; background: #fff; top: 0px; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
a.more-accordion:after { font-family: "Font Awesome 5 Free"; content: "\f0d7"; font-weight: 900; position:absolute; top: 50%; right: calc(50% - 64px); transform: translateY(-50%); transition: 0.2s;}
a.more-accordion.selected:after { transform: translateY(-50%) rotateX(180deg);}