@charset "utf-8";

/* CSS Document */
* { box-sizing: border-box;}
html { font-size: 62.5%;}
body {
	background: #F2F5F9;
	color: #333;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: 1.6rem;
    font-weight: 600;
	letter-spacing: 0.1em;
	line-height: 1.8;
	margin: 0;
    text-size-adjust: 100%;
}
h1,h2,h3,h4 { font-weight: 600;}
p { margin: 0;}
a {
	color: #333;
	text-decoration: none;
}
a:hover, a:visited { opacity: 0.75;}
ul,li {
	list-style: none;
	margin: 0;
	padding: 0;
}	
img {
	border-radius: 30px;
	max-width: 100%;
	vertical-align: bottom;
}
video {
	max-width: 100%;
	vertical-align: bottom;
}
strong {
	font-size: 2rem;
	font-weight: 600;
}
.note {	color: #C33;}
.blue {	color: #043881;}
.lead {
    color: #043881;
    font-size: 2.6rem; 
}
.lead span { font-size: 3rem;}
.lead-s { font-size: 2.4rem;}
.marker {
	background: linear-gradient(transparent 70%, #FF0 0%);
	display: inline;
}
.txt-ct { text-align: center;}
.txt-lt { text-align: left;}
.txt-rt { text-align: right;}
.txt-l { font-size: 1.8rem;}
.txt-s { font-size: 1.4rem;}
@media screen and (max-width: 768px) {
.lead {
    font-size: 2.2rem;
    padding-top: 40px;
}
.lead span {
    font-size: 2.6rem;
    margin-bottom: 10px;
}}

/* 切り替え
---------------------------------------------------- */
.sp { display: none !important;}
@media screen and (max-width: 768px) {
.pc { display: none !important;}
.sp { display: block !important;}
}

/* header
---------------------------------------------------- */
#header {
	align-items: center;
    background: rgb(255 255 255 / 0.5);
	display: flex;
    height: 120px;
    justify-content: space-between;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}
#header h1 {
	margin: 20px;
	width: 168px;
}
#header h1 a {
	background: url(../img/common/logo.png) no-repeat center top;
	background-size: cover;
    display: block;
    height: 0;
	overflow: hidden;
	padding-top: 47.61904761%;
	text-indent: 100%;
	white-space: nowrap;
	width: 100%;
}
.gnav {
    display: flex;
    position: absolute;
    margin: 20px 0;
    right: 20px;
}
@media screen and (max-width: 1200px) {
.gnav {
    position: static;
    right: auto;
}}
@media screen and (max-width: 948px) {
#header {
    align-items: flex-start;
    height: 70px;
}
#header h1 {
	margin: 10px 15px;
    width: 105px;
}
#header h1 a { padding-top: 47.61904761%;}
.gnav { margin: 0;}
}

/* sns
---------------------------------------------------- */
.sns a {
    align-items: center;
    background: #043881;
    border: 1px solid #FFF;
    border-radius: 30px;
    color: #FFF;
    display: flex;
    font-size: 2.2rem;
    height: 60px;
    justify-content: center;
    letter-spacing: normal;
    margin-left: 10px;
    text-align: center;
    width: 60px;
    z-index: 100;
}
@media screen and (max-width: 948px) {
.sns a {
    border-radius: 20px;
    height: 40px;
    margin: 15px 60px 0 0;
    width: 40px;
}}

/* navbar
---------------------------------------------------- */
.navbar {
	background: #043881;
	border-radius: 300px;
    padding: 0 2px; 
}
.navbar ul {
	align-items: center;
	display: flex;
	justify-content: space-between;
	list-style: none;
	margin: 0;
}
.navbar li {
	align-items: center;
	display: flex;
	justify-content: center;
	margin: 0 10px;
}
.navbar li:nth-child(n+2):nth-child(-n+5) a {
	align-items: center;
    color: #FFF;
	display: flex;
	font-size: 1.6rem;
	text-decoration: none;
    transition: 0.3s;
    position: relative;
}
.navbar li:nth-child(n+2):nth-child(-n+5) a:hover,
.navbar li:nth-child(n+2):nth-child(-n+5) a:visited { opacity: 1;}
.navbar li:nth-child(n+2):nth-child(-n+5) a::after {
    background: #27ACD9;
    bottom: 0;
    color: #27ACD9;
    content: '';
    height: 2px;
    left: 0;
    position: absolute;
    transition: 0.3s;
    width: 0;
}
.navbar li:nth-child(n+2):nth-child(-n+5) a:hover::after { width: 100%;}
.navbar li:first-child, .navbar li:last-child, .navbar li:nth-child(6) {
	background: #FFF;
	border-radius: 50px;
	text-align: center;
}
.navbar li:first-child { margin: 5px 15px 5px 5px;}
.navbar li:first-child span { display: none;}
.navbar li:last-child { margin: 5px;}
.navbar li:nth-child(6) { margin: 5px 5px 5px 15px;}
.navbar li:first-child a {
    border-radius: 50px;
	color: #043881;
    display: block;
	font-size: 2rem;
	height: 50px;
	width: 50px;
    align-content: center;
}
.navbar li:last-child a, .navbar li:nth-child(6) a {
    border-radius: 50px;
	color: #043881;
	padding: 10px 15px;
}
.navbar li:last-child i, .navbar li:nth-child(6) i { padding-right: 5px;}
.navbtn a, .sns a {
    overflow: hidden;
    position: relative;
    transition: ease 0.2s;
}
.navbtn a::before, .sns a::before {
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%);
    content: '';
    height: 100%;
    left: -100%;
    position: absolute;
    top: 0;
    transform: skewX(-25deg);
    width: 50%;  
}
.navbtn a:hover, .sns a:hover {
    background: #27ACD9;
    border-radius: 50px;
    color: #FFF !important;
    opacity: 1;
}
.navbtn a:hover::before, .sns a:hover::before { animation: shine 0.7s;}
@keyframes shine {
  100% { left: 125%;}
}
#toggle { display: none;}
#toggle:checked ~ .navbar {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.navbar-toggle { display: none;}
.current { color: aqua;}
@media screen and (max-width: 948px) {
.navbar a:hover, .sns a:hover {
    background: #27ACD9;
    border-radius: 0;
}
.navbtn a, .sns a {
    overflow: hidden;
    position: relative;
}
.navbtn a::before, .sns a::before {
    background: none;
    height: auto;
    left: 0;
    position: static;
    transform: none;
    width: auto;  
}
.sns a:hover { border-radius: 50px !important}
.navbtn a:hover::before, .sns a:hover::before { animation: none;}
.navbar {
    border: 5px solid #FFF;
    border-left: none;
    border-radius: 0;
    border-radius: 0 30px 30px 0;
	left: -60%;
	margin: 10px 0 0 0;
	overflow: hidden;
	padding: 0;
	position: fixed;
	text-align: left;
    -webkit-transition: transform 0.3s ease-in;
	transition: transform 0.3s ease-in;
	width: 60%;
    z-index: 100;
}
.navbar ul { display: block;}
.navbar li {
	border-bottom: 1px solid #FFF;
	display: block;
	margin: 0;
	width: 100%;
}
.navbar li a {
	color: #FFF;
	display: block;
	padding: 20px 10px;
}
.navbar li a::before {
    display: inline-block;
    text-align: center;
    width: 35px;
}
.navbar li:nth-child(n+2):nth-child(-n+5) a { transition: none;}
.navbar li:nth-child(n+2):nth-child(-n+5) a::after { display: none;}
.navbar li:first-child, .navbar li:last-child, .navbar li:nth-child(6) {
	background: none;
	border-radius: 0;
	text-align: left;
}
.navbar li:first-child a {
    font-size: 1.6rem;
    height: auto;
    margin: 0;
	width: auto;
}
.navbar li:first-child span { display: inline-block;}
.navbar li:first-child, .navbar li:last-child, .navbar li:nth-child(6) { margin: 0;}
.navbar li:first-child i, .navbar li:last-child i, .navbar li:nth-child(6) i { display: none;}
.navbar li:first-child a, .navbar li:last-child a, .navbar li:nth-child(6) a {
    color: #FFF;
	padding: 20px 10px;
}
.navbar li:first-child a::before, .navbar li:last-child a::before,
.navbar li:nth-child(2) a::before, .navbar li:nth-child(3) a::before,
.navbar li:nth-child(4) a::before, .navbar li:nth-child(5) a::before,
.navbar li:nth-child(6) a::before {
	font-family: FontAwesome;
	padding-right: 5px;
}
.navbar li:first-child a::before { content: '\f015';}
.navbar li:last-child a::before { content: '\f0e0';}
.navbar li:nth-child(2) a::before { content: '\f1ad';}
.navbar li:nth-child(3) a::before { content: '\f2b5';}
.navbar li:nth-child(4) a::before { content: '\f043';}
.navbar li:nth-child(5) a::before { content: '\f2bd';}
.navbar li:nth-child(6) a::before { content: '\f07a';}
.navbar-toggle {
	background: #043881;
    border: 1px solid #FFF;
	border-radius: 10px;
    display: block;
	height: 40px;
    letter-spacing: normal;
	padding: 0 8px;
	position: fixed;
	right: 15px;
    top: 15px;
	z-index: 100;
}
.navbar-toggle:hover { background: #27ACD9;}
.menuicon {
	cursor: pointer;
	display: block;
	height: 100%;
	position: relative;
	-webkit-transition: transform 0.3s ease-in;
	transition: transform 0.3s ease-in;
	width: 25px;
}
.menuicon > span {
	background: #FFF;
	border-radius: 1px;
	display: block;
	height: 0.2em;
	margin-top: -0.3em;
	position: absolute;
	top: 55%;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	width: 100%;
}
.menuicon > span:before, .menuicon > span:after {
	background: #FFF;
	border-radius: 1px;
	content: '';
	height: 100%;
	position: absolute;
	-webkit-transition: transform 0.3s ease-in;
	transition: transform 0.3s ease-in;
	width: 100%;
}
.menuicon > span:before {
	-webkit-transform: translateY(-0.6em);
	transform: translateY(-0.6em);
}
.menuicon > span:after {
	-webkit-transform: translateY(0.6em);
	transform: translateY(0.6em);
}
#toggle:checked + .navbar-toggle .menuicon {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
#toggle:checked + .navbar-toggle span:before,
#toggle:checked + .navbar-toggle span:after {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
#toggle:checked ~ .navbar {
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
}}

/* slider
---------------------------------------------------- */
.slider {
    background: #043881;
    margin-top: 120px;
    padding: 30px 0;
}
.slide li {
    margin:  auto;
    padding: 0 15px;
}
.slide img { border: 10px solid #FFF;}
.slick-prev, .slick-next {
    background: #FFF !important;
    border: 1px solid #043881;
    border-radius: 30px !important;
    color: #043881 !important;
    height: 60px !important;
    width: 60px !important;
    z-index: 10;
}
.slick-prev { left: 13% !important;}
.slick-next { right: 13% !important;}
.slick-prev:before { content: '\f053' !important;}
.slick-next:before { content: '\f054' !important;}
.slick-prev:before, .slick-next:before {
    color: #043881 !important;
	font-family: fontAwesome !important;
	font-size: 2rem !important;
}
@media screen and (max-width: 948px) {
.slider { margin-top: 70px;}
}
@media screen and (max-width: 768px) {
.slider { padding: 15px 0 10px 0;}
.slide img { border: 5px solid #FFF;}
.slick-prev, .slick-next { display: none !important;}
.slick-dots { bottom: -30px !important;}
.slick-dots li button:before {
    bottom: -30px !important;
    color: #FFF !important;
    font-size: 10px !important;
    opacity: 0.75 !important;
}
.slick-dots li.slick-active button:before {
    color: #FFF !important;
    opacity: 1 !important;
}}

/* page
---------------------------------------------------- */
.wrap-page {
    min-height: 420px;
    margin-top: 120px;
}
.page-area {
    background: #043881;
    color: #FFF;
    display: flex;
    padding: 60px 0 70px 0;
	position: relative;
}
.page-txt {
    margin: 0 auto;
	width: 1200px;
    z-index: 10;
}
.page-txt div {
    display: inline-block;
    padding-left: 40px;
    text-shadow: 1px 1px 0 #043881, -2px 2px 0 #043881, 1px -1px 0 #043881, -1px -1px 0 #043881;
    vertical-align: middle;
}
.page-txt span {
    font-size: 6rem;
    font-family: "Cinzel", serif;
    font-weight: 400;
    line-height: 1.4;
    margin: 15px 0;
}
.page-txt h2 {
    font-size: 2.2rem;
    margin: 0;
}
.page-img {
    position: absolute;
    right: 0;
    text-align: right;
    top: 30px;
}
.page-img img {
    border: 10px solid #FFF;
    border-right: none !important;
    border-radius: 300px 0 0 300px;
    max-height: 380px;
}
@media screen and (max-width: 1350px) {
.page-txt {
    margin: 0;
	width: 100%;
}}
@media screen and (max-width: 948px) {
.wrap-page { margin-top: 70px;}
.page-txt { position: relative;}
}
@media screen and (max-width: 768px) {
.wrap-page { min-height: 230px;}
.page-area { padding: 30px 0 40px 0;}
.page-txt div { padding-left: 15px;}
.page-txt span { font-size: 5rem;}
.page-img { top: 20px;}
.page-img img {
    border: 5px solid #FFF;
    max-height: 200px;
}}
@media screen and (max-width: 480px) {
.wrap-page { min-height: 180px;}
.page-area { padding: 20px 0 30px 0;}
.page-txt span { font-size: 4rem;}
.page-txt h2 { font-size: 2rem;}
.page-img img { max-height: 160px;}
}

/* wrap
---------------------------------------------------- */
.wrap {
	margin: 100px 3% 0 3%;
	position: relative;
	width: 94%;
}
.wrap-lt, .wrap-rt {
	background: #FFF;
	padding-bottom: 60px;
	position: relative;
	width: 97%;
}
.wrap-lt {
	border-radius: 0 30px 30px 0;
	margin: 100px 3% 0 0;
	padding-left: 3%;
}
.wrap-rt {
	border-radius: 30px 0 0 30px;
	margin: 100px 0 0 3%;
	padding-right: 3%;
}
.wrap-area {
	margin: 0 auto;
    overflow: hidden;
	padding: 80px 40px 0 40px;
	width: 1200px;
}
.wrap-box {
	display: flex;
    flex-wrap: wrap;
    justify-content: start;
	padding-top: 50px;
}
.inner { margin-top: 40px;}
@media screen and (max-width: 1350px) {
.wrap-lt .wrap-area, .wrap-rt .wrap-area, .wrap-area {
	width: 100%;
}}
@media screen and (max-width: 768px) {
.wrap-lt { margin: 90px 3% 0 0;}
.wrap-rt { margin: 90px 0 0 3%;}
.wrap-area {
	margin: 0;
    padding: 60px 30px 0 30px;
	width: 100%;
}
.wrap-box {	padding-top: 40px;}
}
@media screen and (max-width: 480px) {
.wrap-area { padding: 60px 20px 0 20px;}
}

/* box
---------------------------------------------------- */
.box2 { width: calc(100%/2);}
.box3 { width: calc(100%/3);}
.box4 { width: calc(100%/4);}
.box-txt {
	padding-right: 60px;
	width: 60%;
}
.box-img { width: 40%;}
.box-s {
    margin: 40px auto 0 auto;
    width: 80%;
}
@media screen and (max-width: 768px) {
.box2, .box3, .box4, .box-txt, .box-img { width: 100%;}
.box-txt { padding-right: 0;}
.box-s {
    margin: 40px 0 0 0;
    width: 100%;
}}

/* title
---------------------------------------------------- */
.tit-area {
    margin: 0 auto;
    padding: 0 40px;
    width: 1200px;
}
.tit {
    overflow: hidden;
    position: absolute;
    top: -50px;
    z-index: 1;
}
.tit div {
	color: #043881;
    font-family: "Cinzel", serif;
	font-size: 6rem;
    font-weight: 500;
	line-height: normal;
}
.tit h2 {
	font-size: 2.6rem;
	margin: 5px 0 0 0;
}
.tit h2 span {
    display: block;
    font-size: 3.5rem;
}
.tit h3 {
	color: #043881;
	font-size: 5rem;
}
.tit-ct {
	left: 50%;
    text-align: center;
    transform: translateX(-50%);
}
.tit-rt {
    padding-right: 80px;
    text-align: right;
    width: 1200px;
}
.wrap-area-s .tit { padding-left: 30px;}
@media screen and (max-width: 1350px) {
.tit-area, .tit-rt {
    margin: 0;
	width: 100%;
}}
@media screen and (max-width: 768px) {
.tit-area {
    margin: 0;
    padding: 0 20px;
    width: 100%;
}
.tit {
    top: -30px;
    width: 100%;
}
.tit div { font-size: 5rem;}
.tit h2 {
    font-size: 2.6rem;
    margin: 10px 0 0 0;
    
}
.tit h2 span {
    font-size: 3rem;
    width: 100%;
}}
@media screen and (max-width: 480px) {
.tit div { font-size: 4.6rem;}
.tit h2 { font-size: 2.2rem;}
}

/* btn
---------------------------------------------------- */
.btn {
    border-radius: 50px;
    display: inline-block;
    margin-top: 40px;
	overflow: hidden;
	position: relative;	
	transition: all 0.2s ease-in;
    vertical-align: middle;	
}
.btn a {
    align-items: center;
	background: #043881;
	border-radius: 50px;
	color: #FFF;
    display: flex;
    justify-content: flex-start;
    overflow: hidden;
	padding: 5px 5px 5px 30px;
}
.btn a::before {
	background: #FFF;
    box-shadow: 0 0 50px 30px #FFF;
	content: '';
	display: block;
	height: 85%;
	left: 0;
    position: absolute;
	opacity: 0;
	top: 5%;
	transform: skewX(-20deg);
	width: 0;
}
.btn a:hover {
	background: #27ACD9;
	border-radius: 50px;
	color: #FFF;
	transition: all 0.2s ease-out;
}
.btn a:hover::before { animation: light 0.5s 0s linear;}
.btn a::after {
    align-items: center;
	background: #FFF;
	border-radius: 50px;
	color: #043881;
	content: '\f054';
    display: flex;
    height: 50px;
    justify-content: center;
	float: right; 
	font-family: fontAwesome;
	margin-left: 15px;
	text-align: center;
	width: 50px;
}
.btn a:hover::after { color: #27ACD9;}
@keyframes light {
	from {opacity: 0; left: 0%;}
	50% {opacity: 1;}
	to {opacity: 0;left: 100%;}
}
.btn a::after {
    align-items: center;
	background: #FFF;
	border-radius: 50px;
	color: #043881;
	content: '\f054';
    display: flex;
    height: 50px;
    justify-content: center;
	float: right; 
	font-family: fontAwesome;
	margin-left: 15px;
	text-align: center;
	width: 50px;
}
.wrap-btn {
	margin: 0 3%;
	position: relative;
	width: 94%;
}
.btn-area {
    margin: 20px auto 0 auto;
    overflow: hidden;
    text-align: right;
    width: 1200px;
}
@media screen and (max-width: 1350px) {
.btn-area {
    margin: 20px 0 0 0;
    width: 100%;
}}
@media screen and (max-width: 768px) {
.btn-area {
    margin: 20px 0 0 0;
    text-align: center;
    width: 100%;
}}

/* form
---------------------------------------------------- */
.check {
    margin-top: 40px;
    text-align: center;
}
.btn-form {
    display: flex;
    justify-content: center;
    padding-top: 20px;
}
.btn-form div { margin-top: 20px;}
.btn-form input {
	background: #043881;
	border: none;
    border-radius: 50px;
    color: #FFF;
    display: block;
	font-family: "Zen Kaku Gothic New", sans-serif !important;
	font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: 0.1em;
	margin: 0 5px;
	padding: 20px 60px;
	transition: 0.5s;
    width: auto;
}
.btn-form input:hover {
    background: #27ACD9;
    cursor: pointer;
	transform: translateY(3px);
}
input {
    font-size: 1.6rem;
	margin: 5px 0;
	padding: 5px;
	width: 100%;
}
select {
    font-size: 1.6rem;
    padding: 5px;
}
textarea {
    font-size: 1.6rem;
	height: 200px;
	margin: 5px 0;
	padding: 5px;
	width: 100%;
}
input[type=checkbox], input[type=radio] { width: auto;}
.form-item ul input { width: 60px;}
.mwform-tel-field input { width: 15%;}
.mw_wp_form .error {
	background: linear-gradient(transparent 60%, #FF6 60%);
	color: #C33 !important;
	font-size: 100% !important;
	display: inline-block !important;
}
.mw_wp_form_confirm td div, .mw_wp_form_confirm .mailcheck, .mw_wp_form_confirm .check { display: none;}
.mw_wp_form_confirm .form-item ul input { font-size: 2rem;}
@media screen and (max-width: 768px) {
    .btn-form input { padding: 15px 30px;}
    .mwform-tel-field input { width: 25%;}
}

/* table
---------------------------------------------------- */
table {
	border-collapse: collapse;
	width: 100%;
}
table th {
	border-bottom: 2px solid #043881;
	font-weight: 600;
	padding: 20px;
	text-align: left;
	vertical-align: top;
	width: 30%;
}
table th span {
	background: #043881;
	border-radius: 50px;
	color: #FFF;
	font-size: 1.2rem;
    line-height: normal;
	margin-left: 10px;
	padding: 0 5px;
	white-space: nowrap;
}
table td {
	border-bottom: 1px solid #B3C3D9;
	padding: 20px;
    width: 70%;
}
table tr:first-child th { border-top: 2px solid #043881;}
table tr:first-child td { border-top: 1px solid #B3C3D9;}
@media screen and (max-width: 768px) {
table th, table td {
	display: block;
    padding: 15px;
	width: 100%;
}
table th { border-bottom: 1px solid #B3C3D9;}
table td { border-bottom: 2px solid #043881;}
table tr:first-child th { border-top: 2px solid #043881;}
table tr:first-child td { border-top: none;}
}

/* aboutus
---------------------------------------------------- */
.aboutus-box {
	display: flex;
    flex-wrap: wrap;
    justify-content: start;
	margin: 20px 0;
}
.aboutus-box div {
	border: 1px solid #043881;
	border-radius: 50px;
	color: #043881;
	margin: 10px 20px 10px 0;
	padding: 15px;
	vertical-align: middle;
}
.wrap-aboutus .box-img div {
	margin: 0 40px 40px 40px;
	text-align: center;
}
.aboutus { margin-top: 60px;}
.aboutus ul { padding-left: 20px;}
.aboutus li { list-style: disc outside;}
.aboutus li::marker { color: #043881;}
@media screen and (max-width: 768px) {
.aboutus-box {
    justify-content: center;
    margin: 20px 0;
}
.aboutus-box div {
    margin: 10px 5px;
    padding: 15px 20px;
}
.aboutus { margin-top: 50px;}
.wrap-aboutus .box-img {
    display: grid;
    gap: 30px;
    grid-template-columns: 1fr 1fr;
    margin-top: 40px;
}
.wrap-aboutus .box-img div { margin: 0;}
}

/* background
---------------------------------------------------- */
.wrap-bg {
    position: relative;
    width: 100%;
}
.wrap-bg::before, .wrap-bg::after {
    background: #FFF;
    content: "";
    height: 35%;
    position: absolute;
    width: 40%;
    z-index: -1;
}
.wrap-bg::before {
    border-radius: 0 30px 30px 0;
    left: 0;
    top: 0;
}
.wrap-bg::after {
    border-radius: 30px 0 0 30px;
    right: 0;
    bottom: -10%;
}
@media screen and (max-width: 768px) {
.wrap-bg::before {
    height: 15%;
    width: 75%;
}
.wrap-bg::after {
    bottom: -3%;
    height: 35%;
    width: 40%;
}
.bg-area .tit { margin: 0 10px;}
}

/* service
---------------------------------------------------- */
.wrap-service {
	margin: 0 auto;
	padding: 60px 10px 0 10px;
	width: 1200px;
}
.wrap-service .tit { padding-left: 30px;}
.service-list .box2 {
	display: flex;
	padding: 0 30px;
}
.service-box {
	background: #043881;
	border-radius: 30px;
	color: #FFF;
}
.service-box img {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.service-inner { padding: 20px 30px 50px 30px;}
.service-inner h3 {
	font-size: 3rem;
	margin: 0;
}
.service-inner h3 span {
	font-size: 1.8rem;
	padding-right: 15px;
}
.service-inner p {
	border-bottom: 1px solid #FFF;
	font-family: "Cinzel", serif;
	font-size: 1.6rem;
	margin: 5px 0 20px 0;
	padding-bottom: 20px;
}
.service-inner strong {
	display: block;
	margin-bottom: 15px;
}
.service-inner .btn { padding: 0;}
.service-inner .btn a {
	background: #FFF;
	color: #043881;
}
.service-inner .btn a:hover {
	background: #27ACD9;
	color: #FFF;
}
.service-inner .btn a::after {
	background: #043881;
	color: #FFF;
}
.service-inner .btn a:hover::after {
	background: #FFF;
	color: #27ACD9;
}
@media screen and (max-width: 1350px) {
.wrap-service {
	margin: 0;
	width: 100%;
}}
@media screen and (max-width: 768px) {
.wrap-service .tit { padding-left: 10px;}
.service-list .box2 {
	display: block;
    padding: 0 10px;
}
.wrap-service .wrap-box { padding-top: 0;}
.service-list .box2 { margin-top: 30px;}
.service-inner h3 span { display: block;}
}

/* building maintenance
---------------------------------------------------- */
.wrap-bm {
    background: #FFF;
    border-radius: 30px;
}
.wrap-bm .tit div { font-size: 8rem;}
.wrap-bm h2 {
    border-bottom: 2px solid #043881;
    color: #043881;
    font-size: 3.6rem;
    margin: 0 0 30px 0;
    padding-bottom: 20px;
}
.wrap-bm .box2 { padding: 0 30px;}
.bm {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}
.bm-box {
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
    margin: 40px 0 60px 0;
}
.bm dl {
    align-items: center;
    border-bottom: 1px solid #B3C3D9;
    border-top: 1px solid #B3C3D9;
    display: flex;
    margin: 0;
    padding: 5px 0;
    width: 48%;
}
.bm dt {
    background: #043881;
	border-radius: 10px;
    color: #FFF;
    display: inline-block;
    line-height: 1;
    padding: 15px;
}
.bm dd { margin-left: 20px;}
.bm-img { margin: 20px 0 60px 0;}
.line { border-top: none !important;}
@media screen and (max-width: 768px) {
.wrap-bm .tit div { font-size: 6rem;}
.wrap-bm h2 { font-size: 3rem;}
.bm-box {
    display: block;
    margin: 40px 0 20px 0;
}
.bm dl { width: 100%;}
.line-sp { border-top: none !important;}
}

/* alclean
---------------------------------------------------- */
.wrap-alclean {
	background: url(../img/index/bg_alclean.jpg) no-repeat bottom;
	background-size: cover;
	margin-top: 160px;
	padding: 0 3% 80px 3%;
	position: relative;
}
.alclean-txt {
	padding-right: 40px;
	width: 50%;
}
.alclean-txt h4 {
	font-size: 3rem;
	margin: 0;
}
.alclean-txt h4 span { color: #043881;}
.alclean-img {
	display: grid;
    gap: 40px;
    grid-template-columns: 1fr 1fr;
    margin-top: 20px;
	width: 50%;
}
.alclean-area {
    margin-top: 80px;
    text-align: center;
}
.alclean-area .lead-s { margin-top: 20px;}
.alclean-box {
    display: grid;
    gap: 15px;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    margin: 0 auto;
    padding-top: 30px;
}
.alclean-box div {
    align-items: center;
    align-content: center;
    background: #043881;
    border-radius: 100%;
    color: #FFF;
    display: flex;
    font-size: 1.8rem;
    justify-content: center;
    margin-top: 20px;
    padding: 20px;
}
.alclean-box div::before {
    display: block;
    content: '';
    padding-top: 100%;
}
.merit {
    align-items: center;
    border: 3px solid #043881;
    border-radius: 30px;
    display: flex;
    font-size: 1.8rem;
    margin: 40px auto 0 40px;
}
.merit ul {
    display: inline-block;
    padding: 30px;
    text-align: left;
}
.merit li { list-style: disc outside;}
.merit li::marker { color: #043881;}
.ph {
    border: 3px solid #043881;
    border-radius: 30px;
    margin-top: 40px;
    padding: 40px;
}
.ph img { border-radius: 0;}
.arrow {
    align-items: center;
    background: #043881;
    clip-path: polygon(0 21.4%, 69.8% 21.4%, 69.8% 0, 100% 50%, 69.8% 100%, 69.8% 78.6%, 0 78.6%);
    color: #FFF;
    display: flex;
    height: 105px;
    justify-content: center;
    left: -40px;
    position: relative;
    text-align: center;
    width: 200px;
}
.ex-flow {
    display: flex;
    justify-content: center;
    margin-top: 50px;
}
.ex-flow li {
    align-items: center;
    color: #043881;
    display: flex;
    font-weight: bold;
    padding-left: 15px;
}
.ex-flow li::after {
    content: '\f061';
    display: inline-block;
    font-family: fontAwesome;
    font-size: 3rem;
    padding-left: 15px;
}
.ex-flow li:last-child::after { display: none;}
.ex-flow img { border-radius: 10px; }
.ex {
    border: 3px solid #043881;
    border-radius: 30px;
    display: inline-block;
    margin-top: 80px;
    padding: 40px 40px 0 40px;
    position: relative;
    text-align: center;
}
.ex-box {
    position: relative;
    top: -65px;
}
.ex-box video { margin-top: 40px;}
.ex-tit {
    background: #043881;
    border-radius: 50px;
    color: #FFF;
    display: inline-block;
    font-size: 1.8rem;
    padding: 15px 30px;
    min-width: 30%;
}
.ex-flow-sp { display: none;}
@media screen and (max-width: 768px) {
.wrap-alclean {
	margin-top: 100px;
	padding: 0 3% 60px 3%;
}
.alclean-txt {
	padding-right: 0;
	width: 100%;
}
.alclean-img {
    gap: 30px;
    margin-top: 40px;
    width: 100%;
}
.alclean-txt h4 { font-size: 2.6rem;}
.alclean-box {
    grid-template-columns: 1fr 1fr;
    margin: 0;
}
.alclean-box div {
    border-radius: 50px;
    display: block;
    margin-top: 0;
}
.alclean-box div::before { display: none;}
.merit {
    display: block;
    font-size: 1.6rem;
    margin: 40px 0 0 0;
}
.merit ul {
    margin-left: 15px;
    padding: 0 30px 30px 30px;
}
.ph {
    margin-top: 30px;
    padding: 20px;
}
.arrow {
    clip-path: polygon(0 22.2%, 66.5% 22.2%, 66.5% 0, 100% 50%, 66.5% 100%, 66.5% 77.8%, 0 77.8%);
    left: 0;
    height: 90px;
    margin-bottom: 30px;
    position: relative;
    top: 15px;
    width: 160px;
}
.ex-flow { display: none;}
.ex-flow-sp {
    display: block;
    margin-top: 40px;
}
.ex-flow-sp img { border-radius: 0;}
/*
.ex-flow {
	display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 30px;
}
.ex-flow li {
    margin: auto;
    padding:10px 5px 0 5px;
    width: 85%;
}
.ex-flow li::after {
    font-size: 2rem;
    padding: 0 5px;
}
.ex-flow li:nth-child(2)::after { display: none;}
 */
.ex { padding: 30px 30px 0 30px;}
}

/* use
---------------------------------------------------- */
.use-tit { text-align: center;}
.use-tit h3 {
    border-top: 3px solid#043881;
    color: #043881;
    font-family: "Cinzel", serif;
    font-size: 5rem;
    font-weight: 500;
    margin: 60px 0 0 0;
    padding-top: 20px;
}
.use-tit div { font-size: 2rem;}
.use {
	display: grid;
    gap: 40px;
    grid-template-columns: 1fr 1fr;
}
.use-box h3 {
    background: #043881;
    border-radius: 50px;
    color: #FFF;
    font-size: 1.6rem;
    margin: 40px 0 0 0;
    padding: 10px 30px;
}
.use-box h3 span { font-size: 1.4rem;}
.use-inner {
	display: grid;
    gap: 30px;
    grid-template-columns: 1fr 2fr;
    margin-top: 30px;
}
.use-inner img { border-radius: 10px;}
@media screen and (max-width: 768px) {
.use {
	display: block;
    gap: 0;
    grid-template-columns: auto;
}
.use-inner {
    gap: 20px;
    grid-template-columns: auto;
}
.use-inner img { border-radius: 30px;}
}

/* category
---------------------------------------------------- */
.cat {
    bottom: 100px;
    opacity: 0;
    padding: 0;
    position: fixed;
    right: 0;
    transform: translateY(200px);
    transition: opacity 1s,visibility 1s, transform 1s;
    visibility: hidden;
    z-index: 10;
}
.cat.show {
    opacity: 1;
    transform: translateY(0px);
    visibility: visible;
}
.cat li { margin: 5px 0;}
.cat a {
    background: #043881;
    border-bottom: 3px solid #FFF;
    border-left: 3px solid #FFF;
    border-top: 3px solid #FFF;
    border-radius: 10px 0 0 10px;
    color: #FFF;
    display: block;
	line-height: normal;
    overflow: hidden;
    padding: 10px 10px 10px 12px;
    position: relative;
    text-align: center;
    transition: ease 0.2s;
}
.cat a::after {
    content: '\f138';
    font-family: fontAwesome;
    font-size: 1.4rem;
    padding-left: 5px;
}
.cat a::before {
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%);
    content: '';
    height: 100%;
    left: -100%;
    position: absolute;
    top: 0;
    transform: skewX(-25deg);
    width: 50%;  
}
.cat a:hover {
    background: #27ACD9;
    opacity: 1;
}
.cat a:hover::before { animation: shine 0.7s;}
.cat span {
    display:inline-block;
    width: 1em;
}
@keyframes shine {
  100% { left: 125%;}
}
@media screen and (max-width: 768px) {
.cat { display: none !important;}
}

/* cautions
---------------------------------------------------- */
.cautions {
    margin-top: 40px;
    padding-left: 25px;
}
.cautions li { list-style: disc outside;}
.cautions li::marker { color: #043881;}

/* shopping
---------------------------------------------------- */
.wrap-item {
	margin: 20px 3% 0 3%;
	width: 94%;
	position: relative;
}
.item-area {
	margin: 0 auto;
	padding: 0 10px;
	width: 1200px;
}
.item-list {
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.item-list .box2 {
	display: flex;
	padding: 0 30px;
}
.item-box {
	background: #FFF;
    border: 3px solid #043881;
	border-radius: 30px;
    margin-top: 60px;
    padding: 40px;
}
.item-tit {
    align-items: center;
    border-bottom: 2px solid #043881;
    display: flex;
    justify-content: space-between;
    margin-bottom: 25px;
    padding-bottom: 25px;
}
.item-tit h3 {
	color: #043881;
    font-size: 2.4rem;
    margin: 0;
}
.item-tit span {
    display: block;
    font-size: 1.6rem;
}
.item-tit div { margin-top: 5px;}
.item-tit span::before {
    content: "●";
    display: inline-block;
    font-size: 0.6rem;
    margin: 0 10px 0 8px;
    vertical-align: middle;
}
.item-tit i {
    align-items: center;
    background: #043881;
    border-radius: 40px;
    color: #FFF;
    display: flex;
    justify-content: center;
    height: 40px;
    width: 40px;
}
a:hover .item-tit i { background: #27ACD9;}
.item-txt strong { color: #C33;}
.item-txt div { margin-top: 20px;}
.item-img {
    display: grid;
    gap: 30px;
    grid-template-columns: 1fr 1fr;
    margin-top: 30px;
}
.item-img div { text-align: center;}
.item-img h4 {
    font-size: 1.8rem;
    margin: 20px 0 0 0;
}
.item-img h4 span {
    color: #043881;
    display: inline-block;
    padding-left: 10px;
}
.item-img p {
    display: inline-block;
    font-size: 2.2rem;
}
.item-img p span {
    display: inline-block;
    font-size: 1.4rem;
    margin-left: 2px;
}
.item-area .txt-ct { margin-top: 20px !important;}
.box {
    font-size: 1.8rem !important;
    margin: 0 10px 0 0 !important;
}
@media screen and (max-width: 1200px) {
.item-area {
	margin: 0;
	width: 100%;
}}
@media screen and (max-width: 768px) {
.wrap-item { margin: 40px 3% 0 3%;}
.item-area {padding: 0;}
.item-list .box2 { padding: 0 20px;}
.item-box {
    padding: 30px;
    margin-top: 40px;
}
.item-area .txt-ct { margin-top: 0 !important;}
.item-tit { align-items: flex-end;}
.item-tit h3 { width: 85%;}
}

/* news
---------------------------------------------------- */
.wrap-news {
	background: #FFF;
	border-radius: 0 300px 300px 0;
	margin: 140px 3% 0 0;
	padding: 0 0 60px 3%;
	position: relative;
	width: 97%;
}
.news-list {
    margin-top: 30px;
    width: 90%;
}
.news-list dl {
	border-bottom: 1px solid #B3C3D9;
	margin: 0;
	padding: 30px 0;
}
.news-list a {
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
    position: relative;
}
.news-list a::after {
	color: #043881;
	content: '\f138';
    position: absolute;
	font-family: fontAwesome;
    right: 3%;
    transition: 0.4s;
}
.news-list a:hover::after {	right: 0;}
.news-list dt {
	padding: 0 30px;
	min-width: 80%;
}
.news-list dt span {
	background: #043881;
	border-radius: 50px;
	color: #FFF;
	display: inline-block;
	margin-right: 30px;
	padding: 0 15px;
}
.news-list dt div { display: inline-block;}
.news-list dd {
	border-left: 1px solid #043881;
	margin: 0;
	padding: 0 30px;
}
.news h3 {
	border-bottom: 1px solid #043881;
	font-size: 1.8rem;
	margin: 40px 0 30px 0;
	padding-bottom: 30px;
	text-align: center;
}
.news span {
	display: block;
	text-align: right;
}
.news div { margin-top: 30px;}
@media screen and (max-width: 768px) {
.wrap-news {
	border-radius: 0 300px 300px 0;
	margin: 80px 3% 0 0;
}
.news-list { margin-top: 20px;}
.news-list dl {	padding: 20px 0;}
.news-list a { display: block;}
.news-list a::after { bottom: 0;}
.news-list dt {
	padding: 0;
	min-width: 100%;
}
.news-list dt div {	margin: 15px 0;}
.news-list dd {
	border-left: none;
	border-top: 1px solid #043881;
    display: inline-block;
	padding: 10px 0 0 0;
}
.news h3 {
	font-size: 1.6rem;
}}

/* careers
---------------------------------------------------- */
.careers-area {
    margin-top: 40px;
    text-align: center;
}
.careers-area .lead-s { margin-top: 20px;}
.careers-box {
    display: grid;
    gap: 40px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    margin: 0 auto;
    padding-top: 20px;
    width: 80%;
}
.careers-box div {
    align-items: center;
    background: #043881;
    border-radius: 100%;
    color: #FFF;
    display: flex;
    font-size: 2rem;
    justify-content: center;
    margin-top: 20px;
    padding: 30px;
}
.careers-box div::before {
    display: block;
    content: '';
    padding-top: 100%;
}
.careers-img {
    display: grid;
    gap: 40px;
    grid-template-columns: 1fr 1fr;
    margin-top: 20px;
}
.careers-img div { margin-top: 40px;}
.careers { text-align: center;}
.careers-tit {
    border: 3px solid #043881;
    border-radius: 50px;
    color: #043881;
    display: inline-block;
    font-size: 2rem;
    margin: 60px 0 0 0;
    padding: 10px 40px;
    text-align: center;
}
.careers h3 {
    color: #043881;
    font-size: 2.2rem;
    margin: 60px 0 40px 0;
}
.careers h3::before {
    background: #043881;
    content: "";
    display: block;
    height: 5px;
    margin: 0 auto 40px auto;
    width: 40px;
}
.careers table { text-align: left;}
.job { padding-left: 20px;} 
.job li {
    list-style: disc outside;
    margin-bottom: 20px;
}
.job li::marker { color: #043881;}
.job-box { padding-left: 25px;} 
.job-box li {
    list-style: circle outside;
    margin-bottom: 0;
}
.job-box li::marker { color: #333;}
@media screen and (max-width: 768px) {
.careers-area { margin-top: 0;}
.careers-box {
    display: block;
    gap: 0;
    grid-template-columns: none;
    margin: 0;
    width: 100%;
}
.careers-box div {
    border-radius: 30px;
    margin-top: 20px;
    padding: 15px;
}
.careers-box div::before { display: none;}
.careers-area .inner { text-align: left;}
.careers-img {
    gap: 30px;
    margin-top: 0;
}}

/* contact
---------------------------------------------------- */
.wrap-form {
    background: #FFF;
    border-radius: 30px;
    padding-bottom: 60px;
}
.contact-txt { text-align: center;}
.contact-tel, .contact-area {
    background: #043881;
    border-radius: 30px;
    color: #FFF;
    margin: 40px auto 0 auto;
    padding: 40px;
    text-align: center;
    width: 60%;
}
.contact-tel span, .contact-area, .number {
    color: #FFF;
    font-family: "Cinzel", serif;
    font-size: 4.6rem;
    font-weight: 400;
}
.contact-tel span::before, .contact-area span::before {
    content: '\f1e4';
    display: block;
    font-family: fontAwesome;
    font-size: 3rem;
}
.contact-tel div {
    border: 1px solid #FFF;
    border-radius: 50px;
    display: inline-block;
    margin: 10px 0 20px 0;
    padding: 5px 20px;
}
.contact { margin-top: 50px;}
.contact-mail { text-align: center;}
.contact-box {
    background: #043881;
    border-radius: 30px;
    color: #FFF;
    margin: 0 auto;
    padding: 40px;
    text-align: center;
    min-height: 380px;
}
.contact-note {
    border: 1px solid #FFF;
    border-radius: 50px;
    color: #FFF;
    display: inline-block;
    margin-top: 20px;
    padding: 5px 20px;
}
.tit-tel, .tit-mail {
    font-size: 2rem;
    margin-bottom: 20px;
}
.tit-tel::before, .tit-mail::before {
    display: block;
    font-family: fontAwesome;
    font-size: 3rem;
    margin-bottom: 20px;
}
.tit-tel::before { content: '\f1e4';}
.tit-mail::before { content: '\f1d8';}
.contact-box .btn, .contact-area .btn { margin: 10px 0 20px 0;}
.contact-box .btn a, .contact-area .btn a {
    background: #FFF;
    color: #043881;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-size: 1.6rem;
    font-weight: 600;
	letter-spacing: 0.1em;
}
.contact-box .btn a:hover, .contact-area .btn a:hover {
	background: #27ACD9;
    border-radius: 50px;
	color: #FFF;
}
.contact-box .btn a { font-size: 2rem;}
.contact-area .btn a { font-size: 1.6rem;}
.contact-box .btn a::after, .contact-area .btn a::after {
    background: #043881;
    color: #FFF;
}
.number a { color: #FFF;}
.grecaptcha-badge { bottom: 70px !important;}
@media screen and (max-width: 768px) {
.mailform { margin-top: 100px;}
.contact-txt { text-align: left;}
.contact-tel, .contact-area {
    margin: 40px auto 0 auto;
    padding: 30px;
    width: 100%;
}
.contact-tel span::before { font-size: 2.6rem;}
.contact-tel {
    padding: 20px;
    width: 100%;
}
.contact-tel span, .number { font-size: 3.6rem;}.contact-box {
    padding: 20px 20px 40px 20px;
    min-height: auto;
}
.tit-tel, .tit-mail { margin-bottom: 10px;}
.tit-tel::before, .tit-mail::before { margin-bottom: 10px;}
.contact-box .btn a { font-size: 1.8rem;}
.contact-note { margin-top: 10px;}
.contact-tel span, .contact-area, .number { font-size: 2.6rem;}
.contact-area a { color: #FFF;}
}

/* order form
---------------------------------------------------- */
.form-tit {
    align-items: center;
    color: #043881;
    display: flex;
    font-size: 2rem;
    margin-top: 60px;
}
.form-tit p {
    color: #333;
	font-size: 1.6rem;
    margin-left: 40px;
}
.form-tit::before {
    background: #043881;
    content: "";
    display: inline-block;
    height: 30px;
    margin-right: 15px;
    width: 5px;
    vertical-align: middle;
}
.form-item {
    border-bottom: 2px solid #043881;
    border-top: 2px solid #043881;
    margin-top: 60px;
    padding-bottom: 60px;
}
.form-item h3 {
    align-items: center;
    color: #043881;
    display: flex;
    font-size: 2.6rem;
    justify-content: space-between;
    margin: 60px 0 0 0;
}
.form-item h3::after {
    background: #043881;
    content: "";
    display: inline-block;
    height: 1px;
    width: 75%;
}
.form-item ul {
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}
.form-item li {
    margin-top: 30px;
    font-size: 1.8rem;
    padding: 0 10px;
    width: calc(100%/7);
}
.form-item img { margin-bottom: 20px;}
.form-item p span {
    display: inline-block;
    font-size: 1.4rem;
    margin-left: 2px;
}
.form-item div {
    font-size: 2rem;
    margin-top: 10px;
}
.form-item div span { font-size: 1.4rem;}
.form { margin-top: 40px;}
@media screen and (max-width: 768px) {
.form-tit { display: block;}
.form-item h3::after { width: 30%;}
.form-item li { width: calc(100%/2);}
.form-item li:nth-child(odd) { padding-left: 0;}
.form-item li:nth-child(even) { padding-right: 0;}
}

/* guide
---------------------------------------------------- */
.guide-area {
    margin: 0 auto;
    padding: 70px 10px 0 10px;
    width: 1200px;
}
.guide {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.guide .box2 { padding: 0 30px;}
.guide h3 {
    border: 1px solid #043881;
    border-radius: 50px;
    margin: 60px 0 10px 0;
    padding: 10px 20px;
}
.guide-box div, .guide-box ul { padding-top: 20px;}
.guide-box li {
    list-style: disc outside;
    margin-left: 25px;
}
.guide-box li::marker { color: #043881;}
.delivery p {
    display: block;
    list-style: none;
    margin-left: 0;
    width: 100%;
}
.delivery p::after {
    background: #043881;
    content: "";
    display: inline-block;
    height: 1px;
    margin-left: 20px;
    width: 20%;
    vertical-align: middle;
}
.delivery ul {
    align-content: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 5px 0 !important;
}
.delivery li { margin-right: 20px;}
.postage dl {
    align-content: center;
    border-bottom: 1px solid #B3C3D9;
    border-top: 1px solid #B3C3D9;
    display: flex;
    font-size: 1.8rem;
    margin: 10px 0 0 0;
    padding: 5px 0;
    width: 100%;
}
.postage dt {
    border-right: 1px solid #B3C3D9;
    padding: 5px 15px;
    width: 15%;
}
.postage dd {
    margin: 0;
    padding: 5px 15px;
    text-align: right;
    width: 85%;
}
.postage span {
    display: inline-block;
    font-size: 2rem;
    margin: 0 5px 0 20px;
}
.postage p {
    font-size: 1.6rem;
    padding-top: 0;
}
.postage div {
    border-bottom: 1px solid #B3C3D9;
    color: #043881;
    font-size: 2rem;
    padding: 15px !important;
    text-align: center;
}
.commission div {
    background: #B3C3D9;
    border-bottom: 1px solid #FFF;
    border-top: 1px solid #FFF;
    margin-bottom: 2px;
    padding: 10px 15px;
    outline: 2px solid #B3C3D9;
}
.commission div span { float: right;}
.commission dl {
    border-bottom: 1px solid #B3C3D9;
    display: flex;
    margin: 0;
    width: 100%;
}
.commission dt { border-right: 1px solid #B3C3D9;}
.commission dt, .commission dd {
    margin: 2px 0;
    padding: 10px 15px;
}
.commission dt { width: 70%;}
.commission dd {
    text-align: right;
    width: 30%;
}
.commission span {
    display: inline-block;
    font-size: 1.4rem;
    padding-left: 2px;
}
@media screen and (max-width: 768px) {
.guide-area {
    margin: 0;
    padding: 60px 10px 0 10px;
    width: 100%;
}
.guide .box2 { padding: 0 20px;}
.guide h3 { margin: 50px 0 10px 0;}
.postage div {
    font-size: 1.8rem;
    padding: 10px !important;
}
.commission dt { width: 65%;}
.commission dd { width: 35%;}
.postage dt, .postage dd,
.commission div, .commission dt, .commission dd { padding: 5px 10px;}
}

/* policy
---------------------------------------------------- */
.policy h3 {
    border-bottom: 2px solid #043881;
    color: #043881;
    font-size: 2rem;
    margin: 40px 0 20px 0;
    padding: 0 20px 20px 20px;
}
.policy div {
    margin-bottom: 20px;
    padding: 0 20px;
}
.policy ul { padding: 0 20px 0 45px;}
.policy li { list-style: disc outside;}
.policy li::marker { color: #043881;}
@media screen and (max-width: 768px) {
.policy h3 {
    display: block;
    font-size: 1.8rem;
    padding: 0 0 20px 0;
}
.policy h3::after { display: none;}
.policy div { padding: 0;}
.policy ul { padding: 0 0 0 25px;}
}

/* bana
---------------------------------------------------- */
.wrap-bana { margin: 60px 3% 0 3%;}
.bana-area {
	margin: 0 auto;
	padding: 0 10px;
    overflow: hidden;
	width: 1200px;
}
.bana {
    display: flex;
    flex-wrap: wrap;
	text-align: center;
}
.bana .box2 { padding: 40px 30px 0 30px;}
.bana-box {
	align-items: center;
	background: #043881;
	border-radius: 30px;
    display: flex;
    flex-wrap: wrap;
	text-align: center;
}
.bana-box div {
	color: #FFF;
	width: calc(100%/2);
}
.bana-box h3 {
	font-size: 3rem;
	margin: 0 0 15px 0;
}
.bana-box p {
	font-family: "Cinzel", serif;
	font-size: 1.6rem;
}
.bana-box div img {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
@media screen and (max-width: 1350px) {
.bana-area {
	margin: 0;
	width: 100%;
}}
@media screen and (max-width: 768px) {
.wrap-bana { margin: 30px 3% 0 3%;}
.bana-area { padding: 0 20px;}
.bana { display: block;}
.bana .box2 { padding: 30px 0 0 0;}
.bana-box h3 { font-size: 2.2rem;}
}

/* instagram
---------------------------------------------------- */
.wrap-instagram {
	background: #FFF;
	border-top-left-radius: 250px;
	border-bottom-left-radius: 250px;
	margin: 140px 0 0 3%;
	min-height: 500px;
	padding: 0 3% 60px 0;
	position: relative;
	width: 97%;
}
@media screen and (max-width: 768px) {
.wrap-instagram {
	margin: 80px 0 0 3%;
	min-height: 500px;
}}

/* footer
---------------------------------------------------- */
#footer {
	background: #FFF;
	margin-top: 100px;
	padding: 0 3% 30px 3%;
}
.wrap-footer {
	margin: 0 auto;
    padding: 20px;
    overflow: hidden;
	width: 1200px;
}
.footer-area {
    align-items: stretch;
  	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
#footer .box3 {
	margin-top: 40px;
	padding: 0 20px;
}
.footer-box div { border-bottom: 1px solid #B3C3D9;}
.footer-box h2 {
	margin: 0 auto 20px auto;
	width: 160px;
}
.footer-box h2 a {
	background: url(../img/common/logo.jpg) no-repeat center top;
	background-size: cover;
    display: block;
    height: 0;
	overflow: hidden;
	padding-top: 57.5%;
	text-indent: 100%;
	white-space: nowrap;
	width: 100%;
}
.addr p { text-indent: 1.2em;}
.addr, .tel { padding: 15px;}
.addr::before, .tel::before {
	font-family: fontAwesome;
	padding-right: 10px;
}
.addr::before { content: '\f1ad';}
.tel::before { content: '\f2a0';}
#footer iframe {
    border-radius: 30px;
	height: 100%;
	width: 100%;
}
@media screen and (max-width: 1350px) {
.wrap-footer {
	margin: 0;
	width: 100%;
}}
@media screen and (max-width: 768px) {
#footer {
    margin-top: 60px;
    padding: 0 3% 10px 3%;
}
#footer .box3 {	padding: 0;}
#footer iframe { height: 360px;}
}

/* address
---------------------------------------------------- */
address {
	background: #043881;
	color: #FFF;
	font-style: normal;
	padding: 15px;
	text-align: center;
}

/* pagetop
---------------------------------------------------- */
#pagetop {
	bottom: 0;
	position: fixed;
	right: 0;
	z-index: 10;
}
#pagetop a {
	background: #043881;
    border-left: 3px solid #FFF;
    border-top: 3px solid #FFF;
    border-radius: 10px 0 0 0;
	color: #FFF;
    display: block;
	font-size: 1.6rem;
	line-height: normal;
	padding: 10px 15px;
	position: relative;
    text-align: center;
}

/* CLEARFIX
---------------------------------------------------- */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix { min-height: 1px;}
* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}