﻿@charset "utf-8";

/* --------------------------------------------------------------------------------------------

サイト名: 青空会
用途：各コンテンツ設定用CSS - レスポンシブWebデザイン

-------------------------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------------------------

 * 1.0 - Reset

-------------------------------------------------------------------------------------------- */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/* --------------------------------------------------------------------------------------------

 * 2.0 - Common

-------------------------------------------------------------------------------------------- */

/* ********************************************************************************************
 ** 2.1 - Site Layout
******************************************************************************************** */

body {
	font: normal 18px/1.6em "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
	text-align: center;
	color: #000000;
	background-color: #ffffff;
}

.wrapper {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 20px;
	text-align: left;
	box-sizing: border-box;
}

/* ********************************************************************************************
 ** 2.2 - Link
******************************************************************************************** */

a:link {
    transition: all .3s ease;
	color: #007b54;
	text-decoration: none;
}
a:visited {
	color: #007b54;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	color: #1f72c0;
}
a:active {
	text-decoration: none;
	color: #f06816;
}
a:focus {
	-moz-outline-style: none;
}

a.pdf-icon::after {
	content: url(../images/ico_pdf.png);
	display: inline-block;
	vertical-align: middle;
	padding: 1px 0 0 10px;
}
a.excel-icon::after {
	content: url(../images/ico_excel.png);
	display: inline-block;
	vertical-align: middle;
	padding: 2px 4px 0 6px;
}

/* ********************************************************************************************
 ** 2.3 - Clearfix
******************************************************************************************** */

.clearfix::after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-table;
	min-height: 1%; }
/* Hides from IE-mac */
* html .clearfix { height: 1%; } 
.clearfix { display: block; } 
/* End hide from IE-mac */

/* ********************************************************************************************
 ** 2.4 - Common
******************************************************************************************** */

.detail-button {
	width: 100%;
	max-width: 340px;
	height: 60px;
	box-sizing: border-box;
}
.detail-button a {
	display: block;
	width: 100%;
	height: 100%;
	font-size: 16px;
	line-height: 60px;
	padding: 0 20px;
	border-radius: 12px;
	box-sizing: border-box;
	position: relative;
	text-align: left;
}
.detail-button a:hover {
	text-decoration: none;
}

.blue-layout a {
	color: #ffffff;
	background-color: #1695ef;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.blue-layout a::before,.blue-layout a::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 6px solid transparent;
	position: absolute;
	top: 24px;
    transition: all .3s ease;
}
.blue-layout a::before {
	border-left: 8px solid #ffffff;
	right: 10px;
}
.blue-layout a::after {
	border-left: 8px solid #1695ef;
	right: 12px;
}
.blue-layout a:hover {
	color: #ffffff;
	background-color: #006bd9;
}
.blue-layout a:hover::after {
	border-left: 8px solid #006bd9;
	right: 12px;
}

.white-layout a {
	color: #1695ef;
	background-color: #ffffff;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.white-layout a::before,.white-layout a::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 6px solid transparent;
	position: absolute;
	top: 24px;
    transition: all .3s ease;
}
.white-layout a::before {
	border-left: 8px solid #1695ef;
	right: 10px;
}
.white-layout a::after {
	border-left: 8px solid #ffffff;
	right: 12px;
}
.white-layout a:hover {
	color: #ffffff;
	background-color: #006bd9;
}
.white-layout a:hover::before {
	border-left: 8px solid #ffffff;
	right: 10px;
}
.white-layout a:hover::after {
	border-left: 8px solid #006bd9;
	right: 12px;
}

.orange-layout a {
	color: #ffffff;
	background-color: #e57700;
}
.orange-layout a::before,.orange-layout a::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 6px solid transparent;
	position: absolute;
	top: 24px;
    transition: all .3s ease;
}
.orange-layout a::before {
	border-left: 8px solid #ffffff;
	right: 10px;
}
.orange-layout a::after {
	border-left: 8px solid #e57700;
	right: 12px;
}
.orange-layout a:hover {
	color: #ffffff;
	background-color: #e84200;
}
.orange-layout a:hover::after {
	border-left: 8px solid #e84200;
	right: 12px;
}

a.map-link {
	color: #000000;
	text-decoration: underline;
}
a.map-link:hover {
	color: #000000;
	text-decoration: none;
}



/* --------------------------------------------------------------------------------------------

 * 3.0 - Header

-------------------------------------------------------------------------------------------- */

header {
	width: 100%;
	max-width: 1920px;
	height: 390px;
	position: relative;
	background: url(../images/main-visual.jpg) top center no-repeat;
}
.head-line {
	width: 100%;
	height: 80px;
	display: flex;
	justify-content: space-between;
}

.head-guidance-area-site-name {
	width: 240px;
	height: 80px;
	text-indent: -9999px;
	border-radius: 0 0 12px 0;
	background: url(../images/site-name.png) top center no-repeat;
}
.head-guidance-area-site-name a {
	width: 240px;
	height: 80px;
	display: block;
}

.head-guidance-area-offer {
	width: 340px;
	height: 80px;
	padding: 0 0 0 20px;
	border-radius: 0 0 0 12px;
	background-color: #ffffff;
}

.offer-button {
	max-width: 310px;
	display: inline-block;
}



/* --------------------------------------------------------------------------------------------

 * 4.0 - Global Navigation

-------------------------------------------------------------------------------------------- */

.global-navigation {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
}
.global-navigation p.floating-site-name {
	display: none;
}
.global-navigation p.floating-offer {
	display: none;
}
.navigation-contents {
	width: 100%;
	height: 128px;
	display: flex;
	margin: 0 0 20px 0;
}
.navigation-contents li {
	width: 20%;
	max-width: 256px;
	height: 128px;
	position: relative;
	text-align: center;
	border-right: none;
	box-sizing: border-box;
}
.navigation-contents li:first-child {
	border-left: none;
}
.navigation-contents li:last-child {
	display: none;
}
.navigation-contents li a {
	max-width: 236px;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
	padding: 45px 0 0 0;
	color: #1695ef;
/*	background-color: #1695ef;*/
	border-radius: 12px;
	border: 10px solid #1695ef;
	box-sizing: border-box;
	font-weight: bold;
	font-size: 20px;
}
.navigation-contents li a.doubleline {
	padding: 30px 0 0 0;
}
.navigation-contents li a:hover {
	color: #ffffff;
/*	background-color: #006bd9;*/
	background-color: #1695ef;
	text-decoration: none;
	top: 0;
}


header.contents-page-head {
	width: 100%;
	max-width: 1920px;
	height: 80px;
	position: relative;
	background: none;
}
header.contents-page-head .contents-page-global-navigation {
	margin: 16px 0 0 0;
}
header.contents-page-head .contents-page-global-navigation p.floating-site-name {
	display: none;
}
header.contents-page-head .contents-page-navi-list {
	display: flex;
}
header.contents-page-head .contents-page-navi-list li {
	margin: 0 30px 0 0;
}
header.contents-page-head .contents-page-navi-list li a {
	color: #000000;
}
header.contents-page-head .contents-page-navi-list li a:hover {
	color: #000000;
	text-decoration: underline;
}
header.contents-page-head .contents-page-navi-list li:last-child {
	display: none;
}


.clone-nav {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	max-width: 1920px;
	height: 90px;
	margin: 0 auto;
/*	font-size: 14px;
	background: url(../images/navi-cloud-line.png) top left repeat-x;*/
	box-sizing: border-box;
	background-color: #ffffff;
/*	border-top: 5px solid #1695ef;
	border-bottom: 1px solid #cdcdcd;
	box-shadow: 0 3px 3px rgba(119,119,119,0.5);*/
	transition: .3s;
	transform: translateY(-110%);
/*	border-top: 3px solid #1695ef;
	border-bottom: 1px solid #1695ef;*/
}
.is-show {
	transform: translateY(0);
}

.clone-nav p.floating-site-name {
	width: 22.5%;
	max-width: 288px;
	display: inline-block;
	border-left: none;
	margin: 0 0 0 40px;
}
.clone-nav p.floating-site-name img {
	width: 214px;
	height: 70px;
}

.clone-nav ul {
	width: 100%;
	max-width: 952px;
	height: 40px;
	margin: 0;
	display: flex;
}
.clone-nav li {
/*	width: 16.66%;
	max-width: 160px;*/
	width: auto;
	height: 40px;
/*	margin: 0 30px 0 0;*/
	margin: 0 20px 0 0;
	position: relative;
	line-height: 40px;
	font-size: 14px;
	text-align: center;
	border-right: none;
	box-sizing: border-box;
}
.clone-nav .navigation-contents li a,.clone-nav .contents-page-navi-list li a {
	display: block;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
	color: #000000;
	/* 追加プロパティ */
	background-color: transparent;
	padding: 0;
	border: none;
	font-weight: normal;
	font-size: 14px;
}
.clone-nav .navigation-contents li a:hover,.clone-nav .contents-page-navi-list li a:hover {
	text-decoration: underline;
	/* 追加プロパティ */
	background-color: none;
	color: #000000;
}

.clone-nav .navigation-contents li span {
	display: none;
}
.clone-nav .navigation-contents li:first-child {
	border-left: none;
}
.clone-nav .navigation-contents li:last-child {
	height: 40px;
	display:inline-block;
}
.clone-nav .navigation-contents li:last-child a,.clone-nav .contents-page-navi-list li:last-child a {
	display: block;
	width: 100%;
	height: 100%;
	line-height: 40px;
	padding: 0 24px;
	font-size: 14px;
	border-radius: 12px;
	box-sizing: border-box;
	color: #ffffff;
	background-color: #e57700;
}
.clone-nav .navigation-contents li:last-child a:hover,.clone-nav .contents-page-navi-list li:last-child a:hover {
	text-decoration: none;
	color: #ffffff;
	background-color: #e84200;
}



/* --------------------------------------------------------------------------------------------

 * 5.0 - Top Page

-------------------------------------------------------------------------------------------- */

/* ********************************************************************************************
 ** 5.2 - top-corporative
******************************************************************************************** */

.top-corporative-area-all {
	width: 100%;
	max-width: 1920px;
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
}
span.l-cloud {
	width: 420px;
	height: 390px;
	background: url(../images/cloud-left.png) 0 0 no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
span.r-cloud {
	width: 500px;
	height: 386px;
	background: url(../images/cloud-right.png) 0 0 no-repeat;
	position: absolute;
	top: 300px;
	right: 0;
	z-index: 2;
}

.top-corporative-area {
	width: 100%;
	max-width: 1280px;
	display: flex;
	align-items: center;
	position: relative;
	margin: 0 auto;
	padding: 30px 0 60px;
	z-index: 3;
}
.top-corporative-logo {
	width: 100%;
	max-width: 240px;
	margin: 0 100px 0 0;
}
.top-corporative-logo img {
	width: 100%;
}
.top-corporative-column {
	width: 100%;
	max-width: 940px;
}
.top-corporative-column dt.catch {
	color: #1695ef;
	font-size: 28px;
	margin: 0 0 20px 0;
	line-height: 40px;
}
.top-corporative-column dt.catch span {
	display: block;
	font-size: 20px;
	font-weight: bold;
}

.top-corporative-column dd {
	font-size: 20px;
	line-height: 1.8em;
	margin: 0 0 20px 0;
}
.top-corporative-column dd span {
	display: block;
	font-size: 20px;
	font-weight: bold;
}



/* ********************************************************************************************
 ** 5.3 - top-aozora-club
******************************************************************************************** */

.top-aozora-club-area {
	width: 100%;
	margin: 0 0 20px 0;
	padding: 80px 0 40px;
	text-align: center;
	color: #ffffff;
	background-color: #1695ef;
	position: relative;
}
.top-aozora-club-area .circle-head {
	width: 440px;
	height: 220px;
	font-size: 32px;
	line-height: 48px;
	color: #ffffff;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: -150px auto 0;
	padding: 70px 0 0 0;
	background-color: #1695ef;
	border-radius: 220px 220px 0 0;
	box-sizing: border-box;
}
.top-aozora-club-area p {
	line-height: 36px;
	margin-bottom: 40px;	
}
.top-aozora-club-about {
	font-size: 32px;
	margin: 0 0 40px 0;
}
.top-aozora-club-button {
	margin: 0 auto;
}
.top-aozora-club-button a {
	color: #1695ef;
	background-color: #ffffff;
}

.top-aozora-club-office-area {
	width: 100%;
	margin: 0 0 20px 0;
	padding: 40px 0;
	text-align: center;
	background-color: #c6e7ff;	
}
.top-aozora-club-office-area p {
	margin: 0 0 30px 0;
}
.top-aozora-club-office-heading {
	font-size: 32px;
}

.top-aozora-club-area p span,.top-aozora-club-office-area p span {
	font-weight: bold;
}

.top-aozora-club-office-box {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}

.top-aozora-club-office-box figure img {
	border-radius: 50%;
}

.top-aozora-club-office-info {
	margin: 10px auto 0;
}
.top-aozora-club-office-info dt {
	font-size: 20px;
	margin: 0 0 10px 0;
}
.top-aozora-club-office-info dd {
	margin: 0 0 16px 0;
}

.top-aozora-club-office-button a {
	color: #ffffff;
	background-color: #1695ef;
}
.top-aozora-club-office-button a:hover {
	color: #ffffff;
	background-color: #006bd9;
}

/* ********************************************************************************************
 ** 5.4 - top-other-office
******************************************************************************************** */

.top-other-office-area {
	width: 100%;
	margin: 0 0 20px 0;
	display: flex;
	justify-content: center;
/*	justify-content: space-between;*/
}
.large-space {
	margin: 0 0 200px 0;
}
.top-other-office-area section {
	width: 25%;
	margin: 0 20px 0 0;
	color: #ffffff;
	background-color: #1695ef;
	border-radius: 12px;
	box-sizing: border-box;
}
.top-other-office-area section:nth-child(4n) {
	margin: 0;
}
.top-other-office-area figure img {
	width: 100%;
	border-radius: 12px 12px 0 0;
}
.top-other-office-area article {
	padding: 20px;
}
.top-other-office-area article p.office-name {
	font-size: 20px;
	display: inline-block;
	font-weight: bold;
	margin: 0 0 16px 0;
	padding: 0 0 6px 0;
	border-bottom: 1px dotted #ffffff;
}
.top-other-office-area article p.catch-text {
	font-size: 18px;
	line-height: 1.5em;
	margin: 0 0 16px 0;
}

.top-other-office-button {
	width: 200px;
}

/* ********************************************************************************************
 ** 5.5 - top-pr
******************************************************************************************** */

.top-pr-area {
	width: 100%;
}
.top-pr-box {
	width: 100%;
	height: 926px;
	max-width: 1280px;
	text-align: center;
	margin: 0 auto;
	position: relative;
}
.top-pr-box::before {
	content: "";
	max-width: 926px;
	max-height: 926px;
	background-color: #ffffe5;
	border-radius: 50%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}
.top-pr-box figure.top-pr-head {
	width: 580px;
	height: 214px;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	text-indent: -9999px;
	margin: -130px auto;
	background: url(../images/aozora-tsushin.png) 0 0 no-repeat;
}
.top-pr-box p.massage {
	width: 100%;
	line-height: 30px;
	position: absolute;
	top: 120px;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}
.top-pr-magazine-set {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top: 50%;
	right: 0;
	bottom: 0;
	left: 0;
	margin: -231px auto 0;
}
.top-pr-magazine-set figure {
	width: 100%;
	max-width: 590px;
	box-sizing: border-box;
}
.top-pr-magazine-set img {
	width: 100%;
	border: 1px solid #000000;
}
.top-pr-box p.archive-button {
	position: absolute;
	top: 730px;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}



/* --------------------------------------------------------------------------------------------

 * 6.0 - Contents Pages

-------------------------------------------------------------------------------------------- */

/*
header.contents-page-head .contents-page-navi-list li:last-child {
	margin: 0;
}
*/

.page-head-area {
	width: 100%;
	max-width: 1920px;
	height: 160px;
	background: url(../images/main-visual-01.jpg) top center no-repeat;
}
.page-head-box {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	position: relative;
}

h1 {
	width: 290px;
	height: 290px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #edf8ff;
	border-radius: 50%;
	border: 20px solid #ffffff;
	font-size: 28px;
	line-height: 48px;
	text-align: center;
	position: absolute;
	top: 10px;
	left: 0;
}

.breadcrumb-list {
	width: 100%;
	max-width: 910px;
	display: flex;
	position: absolute;
	top: 175px;
	left: 350px;
}
.breadcrumb-list li {
	margin: 0 0 0 16px;
	padding: 0 32px 0 0;
	position: relative;
}
.breadcrumb-list li::before,.breadcrumb-list li::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 4px solid transparent;
	position: absolute;
	top: 10px;
}
.breadcrumb-list li::before {
	border-left: 6px solid #000000;
	right: 0;
}
.breadcrumb-list li::after {
	border-left: 6px solid #efefef;
	right: 1px;
}
.breadcrumb-list li:last-child::before,.breadcrumb-list li:last-child::after {
	display: none;
}

.local-navigation {
	width: 100%;
	max-width: 750px;
	display: flex;
	position: absolute;
	top: 310px;
	right: 0;
	bottom: 0;
	left: 180px;
	margin: 0 auto;
}
.local-navigation li {
	width: 33.33%;
	max-width: 140px;
	text-align: center;
	margin-right: 30px;
}
.local-navigation li a {
	width: 100%;
	padding: 16px 0;
	display: block;
	color: #000000;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
/*
	border-right: 1px solid #ffffff;
	background-color: #1695ef;
*/
	box-sizing: border-box;
}
.local-navigation li:first-child a {
	border-radius: 12px 0 0 12px;
}
.local-navigation li:last-child a {
	border-radius: 0 12px 12px 0;
}
.local-navigation li a:hover {
	color: #000000;
	text-decoration: underline;
}
.local-navigation li a span img {
	width: 140px;
	height: 140px;
	border-radius: 50%;
}


h2 {
	font-size: 30px;
	line-height: 48px;
	margin: 0 0 30px 0;
}

.office-introduction-area-gh {
	width: 100%;
	max-width: 1920px;
	background-color: #efefef;
	margin: 0 0 80px 0;
	padding: 260px 0 30px;
}
.office-introduction-area {
	width: 100%;
	max-width: 1920px;
	background-color: #efefef;
	margin: 0 0 80px 0;
	padding: 200px 0 70px;
}
.office-introduction-box {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}

.office-introduction-text {
	width: 100%;
	max-width: 450px;
	margin: 0 30px 0 0;
	padding: 0;
}
.office-introduction-text p {
	font-size: 20px;
	line-height: 30px;
	margin: 0 0 14px 0;
}
.office-contact-address {
	font-size: 20px;
	margin: 0 0 16px 0;
}
.office-contact-address li.tel {
	margin: 0 0 10px 0;
	font-size: 24px;
}
.office-contact-address li.tel span {
	font-size: 36px;
	font-weight: bold;
	color: #1795ef;
}

.office-business-hours {
	font-size: 20px;
	margin: 0 0 10px 0;
	padding: 0 0 10px 0;
	border-bottom: 1px dashed #000000;
}
.office-business-hours dt {
	margin: 0;
}
.office-business-hours dd {
	font-size: 16px;
}
.office-introduction-image {
	width: 100%;
	max-width: 320px;
}
.office-introduction-image img {
	border-radius: 12px;
	width: 100%;
}


.office-overview-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto 50px;
	display: flex;
	justify-content: space-between;	
}
.office-button-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto 80px;
	display: block;
}

.office-overview-box {
	width: 50%;
}
.office-overview-box:first-child {
	margin: 0 30px 0 0;
}
.office-overview-box:last-child {
	margin: 0 0 0 30px;
}

h3 {
	position: relative;
	margin: 0 0 20px 0;
	padding: 0 0 14px 0;
	font-size: 24px;
}
h3::after {
	content: "";
	width: 50px;
	height: 3px;
	background-color: #1795ef;
	position: absolute;
	bottom: 0;
	left: 0;
}

h4 {
	width: 100%;
	margin: 0 0 16px 0;
	padding: 0 0 6px 0;
	border-bottom: 1px dotted #000000;
}


.office-message-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 70px 0 50px;
	text-align: center;
	position: relative;
	border: 1px solid #000000;
	box-sizing: border-box;
}

.office-message-head {
	width: 240px;
	height: 50px;
	font-size: 20px;
	background-color: #ffffff;
	position: absolute;
	top: -12px;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}

.office-message-box {
	margin: 0 0 50px 0;
	padding: 0 20px;
}
.office-message-box p {
	line-height: 30px;
}

.contents-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
}
.contents-box {
	width: 100%;
	font-size: 20px;
	margin: 0 0 80px 0;
}
.contents-flex-box {
	width: 100%;
	display: flex;
	font-size: 20px;
	margin: 0 0 80px 0;
}
.contents-half-box {
	width: 50%;
	margin: 0 50px 0 0;
}
.contents-half-box img {
	width: 100%;
}
.contents-head-space-gh {
	padding: 260px 0 0 0;
}

.contents-inner-box {
	width: 100%;
	margin: 0 0 50px 0;
}
.contents-inner-flex-box {
	width: 100%;
	display: flex;
	justify-content: space-between;	
	align-items: center;
}
.item-01 {
	order: 1;
}
.item-02 {
	order: 2;
}

.contents-inner-illust-set {
	width: 400px;
	height: 400px;
	padding: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #1795ef;
	border-radius: 50%;
	overflow: hidden;
}

.contents-inner-illust-set-02 {
	width: 100%;
	max-width: 450px;
	height: 450px;
	padding: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #1795ef;
	border-radius: 50%;
	overflow: hidden;
}

.about-zaitaku {
	width: 100%;
	max-width: 750px;
}
.about-zaitaku li {
	position: relative;
	margin: 0 0 16px 0;
	padding: 0 0 0 24px;
}
.about-zaitaku li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 0;
}

.about-grouphome {
	width: 750px;
}
.about-grouphome li {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0 0 0 24px;
}
.about-grouphome li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 0;
}
.about-grouphome p {
	margin: 0 0 16px 0;
}


.contents-head-space {
	padding: 200px 0 0 0;
}

.blue-line-box-basicfee {
	width: 100%;
	max-width: 500px;
	height: 330px;
	margin: 20px 60px;
	padding: 24px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}

.blue-line-box-fee {
	width: 100%;
	max-width: 500px;
	height: auto;
	margin: 20px;
	padding: 24px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}
.blue-line-box-basicfee::after {
	content:"+";
	color: #1795ef;
	font-size: 32px;
	font-weight: bold;
	width: 0px;
	height: 0px;
	/*border-top: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid #ababab;*/
	position: absolute;
	top: 50%;
	right: -30px;
}

.balloon-box {
	width: 100%;
	max-width: 500px;
	height: auto;
	max-height: 260px;
	margin: 0;
	padding: 24px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}
.balloon-box::before {
	content: "";
	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-right: 8px solid #1795ef;
	border-bottom: 8px solid transparent;
	border-left: 8px solid transparent;
	position: absolute;
	top: 30px;
	left: -18px;
}

.balloon-box-head {
	color: #1795ef;
	font-size: 20px;
	font-weight: bold;
	margin: 0 0 16px 0;
}
.balloon-box-list {
	margin: 0 0 0 10px;
}
.balloon-box-list li {
	position: relative;
	margin: 0 0 6px 0;
	padding: 0 0 0 24px;
}
.balloon-box-list li::before,.balloon-box-list li::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 4px solid transparent;
	position: absolute;
	top: 10px;
}
.balloon-box-list li::before {
	border-left: 6px solid #1795ef;
	left: 2px;
}
.balloon-box-list li::after {
	border-left: 6px solid #ffffff;
	left: 0;
}

.balloon-box02 {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 20px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}
.balloon-box02::before {
	content: "";
	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid #1795ef;
	border-left: 8px solid transparent;
	position: absolute;
	top: -18px;
	left: 24px;
}

.contents-circle-head {
	width: 100%;
	max-width: 1280px;
	height: 140px;
	position: relative;
	margin: 0 0 10px 0;
}
.contents-circle-head::before {
	content: "";
	width: 130px;
	height: 130px;
	border-radius: 50%;
	border: 2px solid #1795ef;
	position: absolute;
	top: 0;
	left: 0;
}
.contents-circle-head p {
	padding: 20px 0;
	font-size: 30px;
	background-color: #ffffff;
	color: #1795ef;
	position: absolute;
	top: 32px;
	left: 40px;
}
.contents-circle-head span {
	font-size: 42px;
	color: #1795ef;
	padding: 0 30px 0 0;
}

.aiming-list li {
	position: relative;
	font-size: 20px;
	margin: 0 0 20px 0;
	padding: 0 0 10px 20px;
	border-bottom: 1px dashed #000000;
}
.aiming-list li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 12px;
	left: 0;
}

.overview-list {
	width: 100%;
	max-width: 1280px;
	display: flex;
	background-color: #efefef;
	margin: 0 0 10px 0;
	padding: 10px 0;
	box-sizing: border-box;
}
.overview-list dt {
	width: 15%;
	max-width: 192px;
	font-weight: bold;
	padding: 0 0 0 16px;
	line-height: 30px;
	box-sizing: border-box;
}
.overview-list dd {
	width: 85%;
	max-width: 1088px;
	padding: 0 0 0 16px;
	line-height: 30px;
	box-sizing: border-box;
}

.public-document {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.public-document li {
	width: 48%;
	max-width: 620px;
	padding: 10px;
	border: 1px dashed #000000;
	box-sizing: border-box;
}
.public-document li:nth-child(odd) {
	margin: 0 4% 20px 0;
}
.public-document li:nth-child(even) {
	margin: 0 0 20px 0;
}

#aozora-tsushin {
	width: 100%;
	height: 100px;
}
.pr-document-text {
	margin: 0 0 16px 0;
}
.pr-document-inner-box {
	width: 100%;
	margin: 0 0 20px 0;
}
.pr-document {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.pr-document li {
	width: 25%;
	max-width: 300px;
	margin: 0 20px 20px 0;
	padding: 10px;
	border: 1px dashed #000000;
	box-sizing: border-box;
}
.public-document li:nth-child(4n) {
	margin: 0 0 20px 0;
}

.number-list {
	margin: 0 0 0 20px;
}
.number-list li {
	margin: 0 0 10px 0;
	list-style-type: decimal;
}

.promise-count-area {
	display: flex;
}
.promise-count-box {
	width: 31.25%;
	max-width: 400px;
	margin-right: 40px;
	position: relative;
	padding: 10px;
	border: 1px dashed #ababab;
	box-sizing: border-box;
}
.promise-count-box:last-child {
	margin-right: 0;
}
.promise-head-number {
	width: 60px;
	height: 60px;
	text-align: center;
	background-color: #1795ef;
	color: #ffffff;
	line-height: 60px;
	font-size: 24px;
	font-weight: bold;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}
.promise-head {
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	margin: 60px 0 20px 0;
	position: relative;
	padding: 30px 0 0;
}

.application-flow {
/*	background-color: #fff0f8;*/
	border-radius: 12px;
	margin: 0 0 10px 0;
	padding: 8px 10px;
	position: relative;
	border: 3px solid #ffbddf;
}
.application-flow::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 12px solid #ffbddf;
	border-right: 12px solid transparent;
	border-bottom: 12px solid transparent;
	border-left: 12px solid transparent;
	position: absolute;
	bottom: -24px;
	left: 30px;
}
.application-flow:last-child::after {
	content: "";
	display: none;
}
.application-flow-head {
	font-size: 18px;
	font-weight: bold;
}
.necessary-list {
	margin: 16px 20px 0;
	padding: 0;
}
.add-mb {
	margin: 0 0 30px 0;
}
.necessary-list dt {
	margin: 0 0 10px 0;
	padding: 0 0 6px 10px;
	border-bottom: 1px dashed #000000;
}
.necessary-list dd {
	margin: 0 0 0 10px;
	padding: 0 0 0 20px;
	position: relative;
}
.necessary-list dd.fee {
	font-weight: bold;
}
.necessary-list dd::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	left: 0;
}

.kouken-text-flex-box {
	width: 100%;
	display: flex;
}
.kouken-text-box {
	margin: 0 30px 0 0;
}

.kouken-text-list li {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0 0 0 24px;
}
.kouken-text-list li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	left: 0;
}

.usage-flow-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 0 50px 0;
	padding: 30px 0 0 0;
	display: flex;
	justify-content: space-between;
}
.usage-flow-area02 {
	width: 100%;
	max-width: 1280px;
	margin: 0 0 50px 0;
	padding: 30px 0 0 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.usage-flow-box {
	width: 25%;
	max-width: 280px;
	height: 320px;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box::after {
	content:"";
	width: 0px;
	height: 0px;
	border-top: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid #ababab;
	position: absolute;
	top: 50%;
	right: -40px;
}
.usage-flow-box:last-child::after {
	display: none;
}
.usage-flow-box02 {
	width: 25%;
	max-width: 280px;
	height: 320px;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box03 {
	width: 33%;
	max-width: 350px;
	height: 420px;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box04 {
	/*width: 33%;*/
	max-width: 350px;
	height: 420px;
	border-radius: 12px;
	position: relative;
	margin: 0 5% 20px 0;
}
.usage-flow-box04::after {
	content:"";
	width: 0px;
	height: 0px;
	border-top: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid #ababab;
	position: absolute;
	top: 50%;
	right: -40px;
}
.usage-flow-box04:last-child::after {
	display: none;
}

.flow-head-box {
	width: 100px;
	height: 100px;
	text-align: center;
	position: absolute;
	top: 64px;
	left: 10px;
}
.flow-head-box02 {
	width: 170px;
	height: 100px;
	text-align: center;
	position: absolute;
	top: 64px;
	left: 10px;
}
.flow-head-text {
	display: block;
	font-size: 32px;
	margin-left: -5px;
	margin-bottom: 28px;
}
.flow-head-number {
	display: block;
	font-size: 75px;
}
.usage-flow-image {
	position: absolute;
	top: -30px;
	right: -30px;
}
.detail-text {
	margin: 200px 16px 0 16px;
}

.color-b {
	color: #2390ed;
}
.color-g {
	color: #67ae2d;
}
.color-y {
	color: #ed9023;
}
.color-o {
	color: #ed5c23;
}

.flow-box-height {
	height: 490px;
}
.flow-box-height03 {
	/*height: 380px;*/
}
.flow-box-blue {
	background-color: #d1f5fe;
}
.flow-box-green {
	background-color: #deffdb;
}
.flow-box-yellor {
	background-color: #feffc6;
}
.flow-box-orange {
	background-color: #ffdec6;
}

h5 {
	font-weight: bold;
}
.contents-inner-mini-box {
	width: 100%;
	margin: 0 0 16px 0;
}

.about-helper-service-list {
	width: 100%;
	margin: 10px 0 0 0;
}
.about-helper-service-list li {
	position: relative;
	margin: 0 0 6px 0;
	padding: 0 0 0 24px;
}
.about-helper-service-list li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 0;
}

.sugoshikata {
	width: 100%;
	max-width: 1140px;
/*	max-width: 567px;*/
}
.sugoshikata img {
	width: 100%;
}

.sugoshikata-schedule{
	width: 100%;
	font-size: 16px;
	margin: 180px 0 0 0;
	box-sizing: border-box;	
}
.sugoshikata-schedule th{
	width: 20%;
	text-align: right;
	padding: 0 10px;
}
.sugoshikata-schedule td{
	width: 80%;
	line-height: 20px;
	padding: 0 10px;
}

.kyujin-layout{
	width: 100%;
	margin: 0 0 20px 0;
	box-sizing: border-box;
}
.kyujin-layout th{
	width: 20%;
	border: 1px #999 solid;
	background: #ffd9f0;
	text-align: center;
	padding: 1em 0;
}
.kyujin-layout td{
	width: 80%;
	border: 1px #999 solid;
	padding: 1em;
}


.gc-box {
	width: 100%;
	height: 600px;
	overflow: hidden;
}
.gc-box iframe {
	width: 100% !important;
	height: 100% !important;
}

.center-image-box {
	text-align: center;
	max-width: 900px;
	height: auto;
	margin: 0 auto;
}

.center-image-box img {
	width: 100%;
}
/* --------------------------------------------------------------------------------------------

 * 7.0 - Footer

-------------------------------------------------------------------------------------------- */

footer {
	width: 100%;
	max-width: 1920px;
/*	height: 460px;*/
	margin: 150px 0 0 0;
	padding: 50px 20px 0 20px;
	position: relative;
	background-color: #efefef;
	box-sizing: border-box;
}
.footer-contents-box {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto 26px;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px dashed #000000;
}
.footer-contents-box p.ft-contents-head-logo{
	margin: -6px 0 0 0;
}
.footer-contents-box p.ft-contents-head {
	font-size: 20px;
	margin: 0 0 34px 0;
}
.footer-contents-box figure.ft-logo {
	max-width: 244px;
	align-self: center;
	margin: 0 32px 0 0;
}
.footer-contents-box figure.ft-logo img {
	width: 80%;
}
.footer-contents-box article {
	display: flex;
	justify-content: space-between;
}
.footer-contents-box dl.ft-office-info {
	margin: 0 0 32px 0;
}
.footer-contents-box dl.ft-office-info dt {
	font-weight: bold;
	margin: 0 0 4px 0;
	padding: 0 0 0 16px;
	position: relative;
}
.footer-contents-box dl.ft-office-info dt::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color: #1695ef;
	position: absolute;
	top: 10px;
	left: 0;
}
.footer-contents-box dl.ft-office-info dd.item-set {
	margin-bottom: 14px;
}
.footer-contents-box dl.ft-office-info dd.map-link-set {
	margin-bottom: 20px;
}
.footer-contents-box dl.ft-office-info dd a.map-link {
	color: #000000;
	text-decoration: underline;
}
.footer-contents-box dl.ft-office-info dd.ft-offer {
	max-width: 280px;
}
/*
.footer-contents-box dl.ft-office-info dd a.map-link::after {
	content: "";
	width: 6px;
	height: 6px;
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	transform: rotate(45deg);
	position: absolute;
	top: 6px;
}
*/
.footer-contents-box dl.ft-office-info dd a.map-link:hover {
	color: #000000;
	text-decoration: none;
}
.ft-navi-adjustment {
	margin-right: 70px;
}


.footer-lower-layer {
	width: 100%;
	max-width: 1280px;
	font-size: 14px;
	margin: 0 auto;
	padding: 0 0 26px 0;
	display: flex;
	justify-content: space-between;
}
.copyrights {
	order: 1;
}
.footer-lower-layer ul.ft-nav-list {
	display: flex;
	order: 2;
}
.footer-lower-layer ul.ft-nav-list li {
	margin: 0 0 0 20px;
}
.footer-lower-layer ul.ft-nav-list li a {
	color: #000000;
	text-decoration: underline;
}
.footer-lower-layer ul.ft-nav-list li a:hover {
	color: #000000;
	text-decoration: none;
}

.nav-unshown {
	display:none;
}



/* --------------------------------------------------------------------------------------------

 * 8.0 - Media

-------------------------------------------------------------------------------------------- */

@media screen and (max-width: 1280px) {
	
/* Header
-------------------------------------------------------------------------------------------- */

header {
	width: 100%;
	max-width: none;
	height: 390px;
	position: relative;
	background: url(../images/main-visual-01.jpg) top center no-repeat;
}
.head-line {
	width: 100%;
	height: 80px;
	display: flex;
	justify-content: space-between;
}

.offer-button {
	max-width: 310px;
	display: inline-block;
}

header.contents-page-head {
	width: 100%;
	max-width: none;
	height: 80px;
	position: relative;
	background: none;
}

.page-head-area {
	width: 100%;
	max-width: none;
	height: 160px;
	background: url(../images/main-visual-01.jpg) top center no-repeat;
}
.page-head-box {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	position: relative;
}

.breadcrumb-list {
	width: auto;
	max-width: none;
	display: flex;
	position: absolute;
	top: 175px;
	left: 350px;
}



/* グローバルナビゲーション
-------------------------------------------------------------------------------------------- */

.navigation-area {
	width: 60px;
	height: 60px;
	background-color: #ffffff;
	border-radius: 12px 0 0 12px;
	position: fixed;
	top: 20px;
	right: 20px;
	z-index: 9999;/*最前面に*/
}

.head-guidance-area-offer {
	display:none;
}


#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display: none;
}

/*アイコンのスペース*/
#nav-open {
	display: inline-block;
	width: 60px;
	height: 60px;
	vertical-align: middle;
	padding: 18px 0 0 20px;
	box-sizing: border-box;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
	position: absolute;
	height: 4px;/*線の太さ*/
	width: 30px;/*長さ*/
	border-radius: 5px;
	background: #1695ef;
	display: block;
	content: '';
	cursor: pointer;
}
#nav-open span:before {
  bottom: -10px;
}
#nav-open span:after {
  bottom: -20px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1000;/*最前面に*/
  width: 70%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 300px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(105%);
  transform: translateX(105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}



/* グローバルナビゲーション
-------------------------------------------------------------------------------------------- */

#nav-content .global-navigation,
#nav-content .contents-page-global-navigation {
	width: 100%;
	max-width: none;
	margin: 0;
}
#nav-content .global-navigation p.floating-site-name,
#nav-content .contents-page-global-navigation p.floating-site-name {
	display: block;
	text-align: center;
	padding: 30px 0;
	box-sizing: border-box;
}
#nav-content .global-navigation p.floating-offer {
	display: none;
}
#nav-content .navigation-contents,
#nav-content .contents-page-navi-list {
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
	padding: 0;
}
#nav-content .navigation-contents li,
#nav-content .contents-page-navi-list li {
	width: 100%;
	max-width: none;
	height: auto;
	padding: 16px 0 16px 42px;
	position: relative;
	text-align: left;
	border-right: none;
	border-bottom: 1px dashed #ababab;
	box-sizing: border-box;
}

#nav-content .navigation-contents li::before,
#nav-content .contents-page-navi-list li::before {
	content: "";
	width: 8px;
	height: 8px;
	background-color: #1695ef;
	border-radius: 50%;
	margin-top: -5px;
	position: absolute;
	top: 50%;
	left: 16px;
}

#nav-content .navigation-contents li:first-child,
#nav-content .contents-page-navi-list li:first-child {
	border-top: 1px solid #ababab;
	border-left: none;
}
#nav-content .navigation-contents li:last-child,
#nav-content .contents-page-navi-list li:last-child {
	display: block;
}
#nav-content .navigation-contents li a,
#nav-content .contents-page-navi-list li a {
	display: block;
	position: static;
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
	margin: 0;
	color: #000000;
	/* 追加プロパティ */
	background-color: transparent;
	padding: 0;
	border: none;
	font-weight: normal;
	font-size: 18px;
}
#nav-content .navigation-contents li a:hover {
	color: #000000;
	text-decoration: none;
	top: auto;
}
#nav-content .navigation-contents li span {
	display: none;
	text-align: center;
	display: block;
}
#nav-content .navigation-contents li span img {
	display: none;
	width: 136px;
	height: 136px;
	border-radius: 50%;
	border: 10px solid #ffffff;
}


.clone-nav {
	display: none;
}

.local-navigation {
	width: 100%;
	max-width: 510px;
	display: flex;
	position: static;
	top: 0px;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto 30px;
}
.local-navigation li {
	width: 33.33%;
	max-width: 140px;
	text-align: center;
}
.local-navigation li a {
	width: 100%;
	padding: 16px 0;
	display: block;
	color: #000000;
	border-right: none;
	background-color: transparent;
	box-sizing: border-box;
}
.local-navigation li:first-child a {
	border-radius: 12px 0 0 12px;
}
.local-navigation li:last-child a {
	border-radius: 0 12px 12px 0;
}
.local-navigation li a:hover {
	color: #000000;
	text-decoration: underline;
	background-color: transparent;
}



.office-introduction-area-gh {
	width: 100%;
	max-width: 1920px;
	background-color: #efefef;
	margin: 0 0 80px 0;
	padding: 180px 0 70px;
}

.office-introduction-area {
	width: 100%;
	max-width: 1920px;
	background-color: #efefef;
	margin: 0 0 80px 0;
	padding: 200px 0 70px;
}
.office-introduction-box {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
}

.office-introduction-text {
	width: 100%;
	max-width: 610px;
	margin: 0 30px 0 0;
}
.office-introduction-text p {
	font-size: 20px;
	line-height: 30px;
	margin: 0 0 14px 0;
}
.office-contact-address {
	font-size: 20px;
	margin: 0 0 30px 0;
}
.office-contact-address li.tel {
	margin: 0 0 14px 0;
	font-size: 24px;
}
.office-contact-address li.tel span {
	font-size: 36px;
	font-weight: bold;
	color: #1795ef;
}

.office-business-hours {
	font-size: 20px;
	margin: 0 0 30px 0;
	padding: 0 0 30px 0;
	border-bottom: 1px dashed #000000;
}
.office-business-hours dt {
	margin: 0 0 6px 0;
}
.office-business-hours dd {
	font-size: 16px;
}

.office-introduction-image img {
	border-radius: 12px;
}


.usage-flow-area {
	width: 100%;
	margin: 0 0 50px 0;
	padding: 30px 0 0 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.usage-flow-box {
	width: 45%;
	max-width: 600px;
	height: 320px;
	margin: 0 5% 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box::after {
	content:"";
	width: 0px;
	height: 0px;
	border-top: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid #ababab;
	position: absolute;
	top: 50%;
	right: -10%;
}
.usage-flow-box:last-child::after {
	display: none;
}
.usage-flow-box02 {
	width: 45%;
	max-width: 600px;
	height: 320px;
	margin: 0 5% 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box03 {
	width: 45%;
	max-width: 600px;
	height: 420px;
	margin: 0 5% 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box04 {
	width: 45%;
	max-width: 600px;
	/*height: 450px;*/
	height: auto;
	margin: 0 5% 20px 0;
	padding-bottom: 20px;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box04::after {
	content:"";
	width: 0px;
	height: 0px;
	border-top: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid #ababab;
	position: absolute;
	top: 50%;
	right: -10%;
}
.usage-flow-box04:last-child::after {
	display: none;
}
	
.flow-head-box {
	width: 100px;
	height: 100px;
	text-align: center;
	position: absolute;
	top: 64px;
	left: 10px;
}
.flow-head-box02 {
	width: 170px;
	height: 100px;
	text-align: center;
	position: absolute;
	top: 64px;
	left: 10px;
}
.flow-head-text {
	display: block;
	font-size: 32px;
	margin-left: -5px;
	margin-bottom: 28px;
}
.flow-head-number {
	display: block;
	font-size: 75px;
}
.usage-flow-image {
	position: absolute;
	top: -30px;
	right: -30px;
}
.detail-text {
	margin: 200px 16px 0 16px;
}

.flow-box-height {
	height: 490px;
}
.flow-box-height03 {
	/*height: 380px;*/
}

}



@media screen and (max-width: 900px) {

/* ********************************************************************************************
 ** 5.3 - top-aozora-club
******************************************************************************************** */

.top-aozora-club-office-box {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	display: block;
}
.top-aozora-club-office-box article {
	width: 100%;
	max-width: 300px;
	margin: 0 auto 30px;
}

.breadcrumb-list {
	display: none;
}

.office-introduction-area {
	width: 100%;
	max-width: none;
	background-color: #efefef;
	margin: 0 0 60px 0;
	padding: 200px 20px 70px;
	box-sizing: border-box;
}
.office-introduction-box {
	width: 100%;
	max-width: none;
	margin: 0 auto;
	padding: 0;
	display: block;
	box-sizing: border-box;
}

.office-introduction-text {
	width: 100%;
	max-width: none;
	margin: 0;
}
.office-introduction-text p {
	width: 100%;
	max-width: 640px;
	font-size: 20px;
	line-height: 30px;
	margin: 0 auto 14px;
}
.office-introduction-text h2 {
	text-align: center;
}

.office-contact-address {
	width: 100%;
	max-width: 640px;
	font-size: 20px;
	margin: 0 auto 20px;
}
.office-contact-address li.tel {
	margin: 0 0 14px 0;
	font-size: 24px;
}
.office-contact-address li.tel span {
	font-size: 36px;
	font-weight: bold;
	color: #1795ef;
}

.office-business-hours {
	width: 100%;
	max-width: 640px;
	font-size: 20px;
	margin: 0 auto 20px;
	padding: 0 0 20px 0;
	border-bottom: 1px dashed #000000;
}
.office-business-hours dt {
	margin: 0 0 6px 0;
}
.office-business-hours dd {
	font-size: 16px;
}
.office-introduction-image {
	width: 100%;
	max-width: 640px;
	margin: 0 auto 20px;
}
.office-introduction-image img {
	border-radius: 12px;
	width: 100%;
}

.contents-flex-box {
	width: 100%;
	display: block;
	margin: 0 0 80px 0;
}
.contents-half-box {
	width: 100%;
	margin: 0 auto 30px;
}
.contents-half-box img {
	width: 100%;
}

.brlayout br {
	display: none;
}

.local-navigation {
	width: 100%;
	max-width: 750px;
	display: flex;
	position: static;
	top: 0px;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto 30px;
}
.local-navigation li {
	width: 33.33%;
	max-width: 250px;
	text-align: center;
	margin: 0;
}
.local-navigation li a {
	width: 100%;
	padding: 16px 0;
	display: block;
	color: #ffffff;
	border-right: 1px solid #ffffff;
	background-color: #1695ef;
	box-sizing: border-box;
}
.local-navigation li:first-child a {
	border-radius: 12px 0 0 12px;
}
.local-navigation li:last-child a {
	border-radius: 0 12px 12px 0;
}
.local-navigation li a:hover {
	color: #ffffff;
	text-decoration: none;
	background-color: #006bd9;
}
.local-navigation li a span {
	display: none;
}

.blue-line-box-basicfee {
	width: 100%;
	max-width: none;
	height: auto;
	margin: 0 0 50px;
	padding: 24px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}

.blue-line-box-fee {
	width: 100%;
	max-width: none;
	height: auto;
	margin: 0;
	padding: 24px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}
.blue-line-box-basicfee::after {
	content:"+";
	color: #1795ef;
	font-size: 32px;
	font-weight: bold;
	width: 0px;
	height: 0px;
	/*border-top: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid #ababab;*/
	position: absolute;
	top: 103%;
	/*right: 20px;*/
	left: 50%;
}

.balloon-box {
	width: 100%;
	max-width: none;
	height: auto;
	max-height: none;
	margin: 0;
	padding: 24px;
	position: relative;
	border-radius: 12px;
	border: 2px solid #1795ef;
	box-sizing: border-box;
}
.balloon-box::before {
	content: "";
	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid #1795ef;
	border-left: 8px solid transparent;
	position: absolute;
	top: -18px;
	left: 30px;
}

.balloon-box-head {
	color: #1795ef;
	font-size: 20px;
	font-weight: bold;
	margin: 0 0 16px 0;
}
.balloon-box-list {
	margin: 0 0 0 10px;
}
.balloon-box-list li {
	position: relative;
	margin: 0 0 6px 0;
	padding: 0 0 0 24px;
}
.balloon-box-list li::before,.balloon-box-list li::after {
	content: "";
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 4px solid transparent;
	position: absolute;
	top: 10px;
}
.balloon-box-list li::before {
	border-left: 6px solid #1795ef;
	left: 2px;
}
.balloon-box-list li::after {
	border-left: 6px solid #ffffff;
	left: 0;
}

.kouken-text-flex-box {
	width: 100%;
	display: block;
}
.kouken-text-box {
	margin: 0;
}
.kouken-text-flex-box figure img {
	width: 100%;
}

.kouken-text-list li {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0 0 0 24px;
}
.kouken-text-list li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 10px;
	left: 0;
}


}


@media screen and (min-width: 600px) and (max-width: 1280px) {

/* ********************************************************************************************
 ** 5.2 - top-corporative
******************************************************************************************** */

.top-corporative-area-all {
	width: 100%;
	max-width: none;
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
	margin: 0 0 20px 0;
}
/*
span.l-cloud {
	width: 420px;
	height: 390px;
	background: url(../images/cloud-left.png) 0 0 no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
span.r-cloud {
	width: 500px;
	height: 386px;
	background: url(../images/cloud-right.png) 0 0 no-repeat;
	position: absolute;
	top: 300px;
	right: 0;
	z-index: 2;
}
*/

.top-corporative-area {
	width: 100%;
	max-width: 1280px;
	display: flex;
	align-items: center;
	position: relative;
	margin: 0 autox;
	padding: 60px 0;
	z-index: 3;
}
.top-corporative-logo {
	width: 100%;
	max-width: 240px;
	margin: 0 100px 0 0;
}
.top-corporative-logo img {
	width: 100%;
}
.top-corporative-column {
	width: 100%;
	max-width: 940px;
}
.top-corporative-column dt.catch {
	color: #1695ef;
	font-size: 28px;
	margin: 0 0 20px 0;
	line-height: 40px;
}
.top-corporative-column dd {
	font-size: 20px;
	line-height: 1.8em;
	margin: 0 0 20px 0;
}

/* ********************************************************************************************
 ** 5.4 - top-other-office
******************************************************************************************** */

.top-other-office-area {
	width: 100%;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.top-other-office-area section {
	width: 49%;
	margin: 0 2% 20px 0;
	color: #ffffff;
	background-color: #1695ef;
	border-radius: 12px;
	box-sizing: border-box;
}
.top-other-office-area section:nth-child(even) {
	margin: 0 0 20px 0;
}
.top-other-office-area section:last-child {
	margin: 0 0 20px 0;
}

.top-other-office-area figure img {
	width: 100%;
	border-radius: 12px 12px 0 0;
}
.top-other-office-area article {
	padding: 20px;
}
.top-other-office-area article p.office-name {
	display: inline-block;
	font-weight: bold;
	margin: 0 0 16px 0;
	padding: 0 0 6px 0;
	border-bottom: 1px dotted #ffffff;
}
.top-other-office-area article p.catch-text {
	font-size: 18px;
	line-height: 1.5em;
	margin: 0 0 16px 0;
}

.top-other-office-button {
	width: 200px;
}

.large-space {
	margin: 0;
	padding: 0 0 200px 0;
}

}



@media screen and (max-width: 959px) {

/* ********************************************************************************************
 ** 5.4 - top-other-office
******************************************************************************************** */

.large-space {
	margin: 0;
	padding: 0;
}


/* ********************************************************************************************
 ** 5.5 - top-pr
******************************************************************************************** */

.top-pr-area {
	width: 100%;
}
.top-pr-box {
	width: 100%;
	height: auto;
	max-width: none;
	text-align: center;
	margin: 0 auto;
	padding: 70px 20px;
	background-color: #ffffe5;
	position: relative;
	box-sizing: border-box;
}
.top-pr-box::before {
	content: "";
	display: none;
}
.top-pr-box figure.top-pr-head {
	width: 100%;
	max-width: 246px;
	height: 80px;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto 30px;
	background: url(../images/aozora-tsushin-959.png) 0 0 no-repeat;
}
.top-pr-box p.massage {
	width: 100%;
	line-height: 30px;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto 30px;
}
.top-pr-magazine-set {
	display: block;
	text-align: center;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}
/*
.top-pr-magazine-set a {
	display: block;
	margin: 0 auto;
}
*/
.top-pr-magazine-set figure {
	width: 100%;
	max-width: 590px;
	margin: 0 auto 30px;
	box-sizing: border-box;
}
.top-pr-magazine-set img {
	width: 100%;
	border: 1px solid #000000;
}
.top-pr-box p.archive-button {
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}

.contents-circle-head {
	width: 100%;
	max-width: none;
	height: auto;
	position: relative;
	margin: 0 0 30px 0;
	box-sizing: border-box;
}
.contents-circle-head::before {
	content: "";
	display: none;
}
.contents-circle-head p {
	margin: 0;
	padding: 20px 0;
	font-size: 24px;
	text-align: center;
	background-color: #ffffff;
	position: relative;
	top: 0;
	left: 0;
}
.contents-circle-head p::after {
	content: "";
	width: 100px;
	height: 2px;
	border-bottom: 1px dashed #000000;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -50px;
}
.contents-circle-head span {
	display: none;
}

.contents-inner-flex-box {
	width: 100%;
	display: block;
	justify-content: space-between;	
	align-items: center;
}

.contents-inner-illust-set {
	width: 100%;
	max-width: 400px;
	height: auto;
	max-height: 400px;
	margin: 0 auto 20px;
	padding: 20px;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #1795ef;
	border-radius: 50%;
	overflow: hidden;
}
.contents-inner-illust-set img {
	width: 100%;
}

.contents-inner-illust-set-02 {
	width: 100%;
	max-width: 450px;
	height: auto;
	max-height: 450px;
	margin: 0 auto 20px;
	padding: 20px;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #1795ef;
	border-radius: 50%;
	overflow: hidden;
}
.contents-inner-illust-set-02 img {
	width: 100%;
}

.about-grouphome {
	width: 100%;
}
.about-grouphome li {
	position: relative;
	margin: 0 0 16px 0;
	padding: 0 0 0 24px;
}
.about-grouphome li::before {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #1795ef;
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 0;
}
.about-grouphome p {
	margin: 0 0 16px 0;
}

}



@media screen and (min-width: 600px) and (max-width: 959px) {
	
.promise-count-area {
	display: block;
}
.promise-count-box {
	width: 100%;
	max-width: none;
	margin-right: 0;
	margin-bottom: 20px;
	position: relative;
}
.promise-count-box:last-child {
	margin-right: 0;
}
.promise-count-sort-box {
	display: flex;
	align-items: center;
}
.promise-head-number {
	width: 10%;
	max-width: 60px;
	height: 60px;
	text-align: center;
	background-color: #1795ef;
	color: #ffffff;
	line-height: 60px;
	font-size: 24px;
	font-weight: bold;
	border-radius: 50%;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 0 10px 0;
}
.promise-head {
	width: 90%;
	text-align: left;
	font-weight: bold;
	font-size: 20px;
	margin: 0 0 6px 0;
	position: relative;
	padding: 0 0 0 30px;
	box-sizing: border-box;
}



/* --------------------------------------------------------------------------------------------

 * 7.0 - Footer

-------------------------------------------------------------------------------------------- */

footer {
	width: 100%;
	max-width: none;
	margin: 100px 0 0 0;
	padding: 50px 20px 0 20px;
	position: relative;
	background-color: #efefef;
	box-sizing: border-box;
}
.footer-contents-box {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto 26px;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px dashed #000000;
}
.footer-contents-box section {
	width: 48%;	
}
.footer-contents-box section:first-child {
	margin: 0 4% 0 0;	
}
.footer-contents-box p.ft-contents-head {
	font-size: 20px;
	margin: 0 0 34px 0;
}
.footer-contents-box figure.ft-logo {
	max-width: 244px;
	align-self: center;
	margin: 0 32px 0 0;
}
.footer-contents-box figure.ft-logo img {
	width: 80%;
}
.footer-contents-box article {
	display: block;
	justify-content: space-between;
}
.footer-contents-box dl.ft-office-info {
	margin: 0 0 32px 0;
}
.footer-contents-box dl.ft-office-info dt {
	font-weight: bold;
	margin: 0 0 4px 0;
	padding: 0 0 0 16px;
	position: relative;
}
.footer-contents-box dl.ft-office-info dt::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color: #1695ef;
	position: absolute;
	top: 10px;
	left: 0;
}
.footer-contents-box dl.ft-office-info dd.item-set {
	margin-bottom: 14px;
}
.footer-contents-box dl.ft-office-info dd.map-link-set {
	margin-bottom: 20px;
}
.footer-contents-box dl.ft-office-info dd a.map-link {
	color: #000000;
	text-decoration: underline;
}
.footer-contents-box dl.ft-office-info dd.ft-offer {
	max-width: 280px;
}
/*
.footer-contents-box dl.ft-office-info dd a.map-link::after {
	content: "";
	width: 6px;
	height: 6px;
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	transform: rotate(45deg);
	position: absolute;
	top: 6px;
}
*/
.footer-contents-box dl.ft-office-info dd a.map-link:hover {
	color: #000000;
	text-decoration: none;
}

.ft-navi-adjustment {
	margin-right: 0;
}

.footer-lower-layer {
	width: 100%;
	max-width: 1280px;
	font-size: 14px;
	margin: 0 auto;
	padding: 0 0 26px 0;
	display: flex;
	justify-content: space-between;
}
.footer-lower-layer ul.ft-nav-list {
	display: flex;
}
.footer-lower-layer ul.ft-nav-list li {
	margin: 0 0 0 20px;
}
.footer-lower-layer ul.ft-nav-list li a {
	color: #000000;
	text-decoration: underline;
}
.footer-lower-layer ul.ft-nav-list li a:hover {
	color: #000000;
	text-decoration: none;
}

}



@media screen and (max-width: 599px) {

.wrapper {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 20px 10px 10px;
	text-align: left;
	box-sizing: border-box;
}
header {
	height: 220px;
	background: url(../images/main-visual-02.jpg) top center no-repeat;
}

.navigation-area {
	width: 80px;
/*	width: 60px;*/
	height: 60px;
	background-color: #ffffff;
	border-radius: 12px 0 0 12px;
	position: fixed;
	top: 20px;
	right: 10px;
	z-index: 9999;/*最前面に*/
}

.head-guidance-area-site-name {
	width: 200px;
	height: 60px;
	text-indent: -9999px;
	border-radius: 0 0 12px 0;
	background: url(../images/site-name-sp01.png) top center no-repeat;
}
.head-guidance-area-site-name a {
	width: 200px;
	height: 65px;
	display: block;
}

.top-aozora-club-area {
	width: 100%;
	margin: 0 0 20px 0;
	padding: 80px 10px 40px;
	text-align: center;
	color: #ffffff;
	background-color: #1695ef;
	position: relative;
	box-sizing: border-box;
}

.top-aozora-club-area .circle-head {
	width: 100%;
	height: auto;
	font-size: 32px;
	line-height: 48px;
	color: #ffffff;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto 36px;
	padding: 0;
	background-color: #1695ef;
	border-radius: 0;
	box-sizing: border-box;
}

h1 {
	width: 250px;
	height: 250px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #edf8ff;
	border-radius: 50%;
	border: 20px solid #ffffff;
	font-size: 24px;
	line-height: 48px;
	text-align: center;
	position: absolute;
	top: 10px;
	left: 0;
}
h1 span {
	font-size: 24px;
}

.overview-list {
	width: 100%;
	max-width: none;
	display: block;
	background-color: #efefef;
	margin: 0 0 10px 0;
	padding: 10px 0;
	box-sizing: border-box;
}
.overview-list dt {
	width: 100%;
	max-width: none;
	font-weight: bold;
	padding: 0 0 0 16px;
	line-height: 30px;
	box-sizing: border-box;
}
.overview-list dd {
	width: 100%;
	max-width: none;
	padding: 0 0 0 16px;
	line-height: 30px;
	box-sizing: border-box;
}



/* ********************************************************************************************
 ** 5.2 - top-corporative
******************************************************************************************** */

.top-corporative-area-all {
	width: 100%;
	max-width: none;
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
}
span.l-cloud {
	display: none;
}
span.r-cloud {
	display: none;
}

.top-corporative-area {
	width: 100%;
	max-width: 1280px;
	display: block;
	text-align: center;
	position: relative;
	margin: 0 auto;
	padding: 100px 0 100px;
	z-index: 3;
}
.top-corporative-logo {
	width: 100%;
	max-width: 200px;
	margin: -100px auto 20px;
}
.top-corporative-logo img {
	width: 100%;
}
.top-corporative-column {
	width: 100%;
	max-width: 722px;
}
.top-corporative-column dt.catch {
	color: #1695ef;
	font-size: 28px;
	margin: 0 0 20px 0;
	line-height: 40px;
}
.top-corporative-column dd {
	font-size: 20px;
	line-height: 1.8em;
	margin: 0 auto 20px;
}

/* ********************************************************************************************
 ** 5.4 - top-other-office
******************************************************************************************** */

.top-other-office-area {
	width: 100%;
	margin: 0;
	display: block;
	flex-wrap: wrap;
	justify-content: space-between;
}
.top-other-office-area section {
	width: 100%;
	margin: 0 0 20px 0;
	color: #ffffff;
	background-color: #1695ef;
	border-radius: 12px;
	box-sizing: border-box;
}
.top-other-office-area section:nth-child(even) {
	margin: 0 0 20px 0;
}
.top-other-office-area section:last-child {
	margin: 0 0 20px 0;
}

.top-other-office-area figure img {
	width: 100%;
	border-radius: 12px 12px 0 0;
}
.top-other-office-area article {
	padding: 20px;
}
.top-other-office-area article p.office-name {
	display: inline-block;
	font-weight: bold;
	margin: 0 0 16px 0;
	padding: 0 0 6px 0;
	border-bottom: 1px dotted #ffffff;
}
.top-other-office-area article p.catch-text {
	font-size: 18px;
	line-height: 1.5em;
	margin: 0 0 16px 0;
}

.top-other-office-button {
	width: 200px;
}

.top-pr-box p.massage {
	width: 100%;
	line-height: 30px;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto 30px;
}

.public-document {
	width: 100%;
	display: block;
}
.public-document li {
	width: 100%;
	max-width: none;
	padding: 10px;
	border: 1px dashed #000000;
	box-sizing: border-box;
}
.public-document li:nth-child(odd) {
	margin: 0 0 20px 0;
}
.public-document li:nth-child(even) {
	margin: 0 0 20px 0;
}

.pr-document {
	width: 100%;
	display: block;
}
.pr-document li {
	width: 100%;
	max-width: none;
	margin: 0 0 20px 0;
	padding: 10px;
	border: 1px dashed #000000;
	box-sizing: border-box;
}
.public-document li:nth-child(4n) {
	margin: 0 0 20px 0;
}


.promise-count-area {
	display: block;
}
.promise-count-box {
	width: 100%;
	max-width: 450px;
	margin: 0 auto 20px;
	position: relative;
}
.promise-count-box:last-child {
	margin: 0 auto;
}
.promise-head-number {
	width: 60px;
	height: 60px;
	text-align: center;
	background-color: #1795ef;
	color: #ffffff;
	line-height: 60px;
	font-size: 24px;
	font-weight: bold;
	border-radius: 50%;
	position: static;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}
.promise-head {
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	margin: 0 0 20px 0;
	position: relative;
	padding: 30px 30px 0;
}


.office-overview-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto 60px;
	display: block;
	justify-content: space-between;	
}

.office-overview-box {
	width: 100%;
	margin: 0 0 20px 0;
}
.office-overview-box:first-child {
	margin: 0 0 20px 0;
}
.office-overview-box:last-child {
	margin: 0 0 20px 0;
}

h3 {
	position: relative;
	margin: 0 0 30px 0;
	padding: 0 0 20px 0;
	font-size: 24px;
}
h3::after {
	content: "";
	width: 50px;
	height: 3px;
	background-color: #1795ef;
	position: absolute;
	bottom: 0;
	left: 0;
}

.office-message-area {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 70px 0 50px;
	text-align: center;
	position: relative;
	border: none;
	box-sizing: border-box;
}

.office-message-head {
	width: 240px;
	height: 50px;
	border-bottom: 1px dashed #000000;
	font-size: 20px;
	background-color: #ffffff;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
}

.office-message-box {
	margin: 0 0 50px 0;
}
.office-message-box p {
	line-height: 30px;
}


.usage-flow-area {
	width: 100%;
	margin: 0 0 30px 0;
	padding: 30px 0 0 0;
	display: block;
}
.usage-flow-box {
	width: 100%;
	max-width: 570px;
	height: auto;
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box::after {
	content:"";
	width: 0px;
	height: 0px;
	border-top: 10px solid #ababab;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid transparent;
	position: absolute;
	top: 102%;
	left: 10%;
}
.usage-flow-box:last-child::after {
	display: none;
}
.usage-flow-box02 {
	width: 100%;
	max-width: 570px;
	height: auto;
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box03 {
	width: 100%;
	max-width: 570px;
	height: auto;
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box04 {
	width: 100%;
	max-width: 570px;
	height: auto;
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-radius: 12px;
	position: relative;
}
.usage-flow-box04::after {
	content:"";
	width: 0px;
	height: 0px;
	border-top: 10px solid #ababab;
	border-right: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid transparent;
	position: absolute;
	top: 102%;
	left: 10%;
}
.usage-flow-box04:last-child::after {
	display: none;
}	
.flow-head-box {
	width: 100px;
	height: 100px;
	text-align: center;
	position: static;
	padding: 20px 0 0 2%;
}
.flow-head-box02 {
	width: 130px;
	height: 100px;
	text-align: center;
	position: static;
	padding: 20px 0 0 2%;
}
.flow-head-text {
	display: block;
	font-size: 32px;
	margin-left: -5px;
	margin-bottom: 28px;
}
.flow-head-number {
	display: block;
	font-size: 75px;
}
.usage-flow-image {
	position: absolute;
	top: -30px;
	right: 0px;
}
.detail-text {
	margin: 50px 16px 0 16px;
}

.sugoshikata-schedule{
	margin: 30px 0 0 0;
}

.kyujin-layout{
	width: 100%;
	margin: 0 0 20px 0;
	box-sizing: border-box;
	font-size: 18px;
}
.kyujin-layout th{
	display: block;
	width: 100%;
	font-weight: bold;
	padding: 0.5em 0;
	box-sizing: border-box;
}
.kyujin-layout td{
	display: block;
	width: 100%;
	padding: 0.5em;
	box-sizing: border-box;
}


/* --------------------------------------------------------------------------------------------

 * 7.0 - Footer

-------------------------------------------------------------------------------------------- */

footer {
	width: 100%;
	max-width: none;
	margin: 100px 0 0 0;
	padding: 50px 20px 0 20px;
	position: relative;
	background-color: #efefef;
	box-sizing: border-box;
}
.footer-contents-box {
	width: 100%;
	max-width: none;
	margin: 0 auto 26px;
	display: block;
	border-bottom: 1px dashed #000000;
}
.footer-contents-box section {
	width: 100%;
}
.footer-contents-box section:first-child {
	margin: 0 0 30px 0;
	border-bottom: 1px dashed #000000;
}
.footer-contents-box p.ft-contents-head-logo{
	display: flex;
	justify-content: space-between;
	max-width: 180px;
	margin: -10px auto 10px;
}
.footer-contents-box p.ft-contents-head {
	margin: 0 auto;
}
.footer-contents-box figure.ft-logo {
	max-width: 160px;
	align-self: center;
	margin: 0 auto;
}
.footer-contents-box figure.ft-logo img {
	width: 100%;
}
.footer-contents-box article {
	display: block;
	justify-content: space-between;
}
.footer-contents-box dl.ft-office-info {
	margin: 0 0 32px 0;
}
.footer-contents-box dl.ft-office-info dt {
	font-weight: bold;
	margin: 0 0 4px 0;
	padding: 0 0 0 16px;
	position: relative;
}
.footer-contents-box dl.ft-office-info dt::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color: #1695ef;
	position: absolute;
	top: 10px;
	left: 0;
}
.footer-contents-box dl.ft-office-info dd.item-set {
	margin-bottom: 14px;
}
.footer-contents-box dl.ft-office-info dd.map-link-set {
	margin-bottom: 20px;
}
.footer-contents-box dl.ft-office-info dd a.map-link {
	color: #000000;
	text-decoration: underline;
}
.footer-contents-box dl.ft-office-info dd.ft-offer {
	max-width: 280px;
}
/*
.footer-contents-box dl.ft-office-info dd a.map-link::after {
	content: "";
	width: 6px;
	height: 6px;
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	transform: rotate(45deg);
	position: absolute;
	top: 6px;
}
*/
.footer-contents-box dl.ft-office-info dd a.map-link:hover {
	color: #000000;
	text-decoration: none;
}

.ft-navi-adjustment {
	margin-right: 0;
}

.footer-lower-layer {
	width: 100%;
	max-width: 1280px;
	font-size: 14px;
	margin: 0 auto;
	padding: 0 0 26px 0;
	display: block;
	justify-content: space-between;
}
.footer-lower-layer ul.ft-nav-list {
	display: flex;
	margin: 0 0 10px 0;
}
.footer-lower-layer ul.ft-nav-list li {
	margin: 0 20px 0 0;
}
.footer-lower-layer ul.ft-nav-list li a {
	color: #000000;
	text-decoration: underline;
}
.footer-lower-layer ul.ft-nav-list li a:hover {
	color: #000000;
	text-decoration: none;
}

}


@media screen and (max-width: 450px) {

.office-contact-address li.tel {
	margin: 0 0 14px 0;
	font-size: 20px;
}
.office-contact-address li.tel span {
	display: block;
	font-size: 30px;
	font-weight: bold;
	color: #1795ef;
}

}

/* 黒丸ありリスト(黒丸はインサイド) */
.list-disc-inside {
	list-style-type: disc;
	list-style: inside;
}