@charset "utf-8";

/* サービスページのCSS読み込み */
@import url("./searvice.css");

/* オンライン等その他のサービスページ */
.online-page p {
	font-size: 18px;
}
.online-bg p {
	font-size: 21px;
}
.online-nav {
	width: auto;
	height: auto;
	background-color: #F7F8F9;
	padding: 90px 0;
	margin: 0 auto;
}
.online-nav ul {
	width: 1100px;
	margin: 0 auto;
	display: flex;
	justify-content: space-around;
	align-items: flex-start;
	flex-wrap: wrap;
}
.online-nav ul li {
	width: calc( ( 100% - 27px ) / 3 );
	margin-right: calc( 27px / 2 );
	margin-bottom: 14px;
}
.online-nav ul li.single-nav {
	width: calc( ( 100% - 14px ) / 2 );
}
.online-nav ul li:nth-child(3n) {
	margin-right: 0;
}
.online-nav ul li:last-child {
	margin-right: 0
}
.online-nav ul li a {
	width: auto;
	min-height: 90px;
	height: auto;
    display: block;
	padding: 15px 20px;
    font-size: 18px;
    font-weight: bold;
    background: url(../../img/online/online_nav_icon.png) no-repeat right -1px bottom,#fff;
    color: #004898;
    text-decoration: none;
    text-align: center;
    text-align: left;
    display: flex;
    justify-content: flex-start;
    align-items: center;
	line-height: 1.2;
    transition-duration: 0.3s;
	border: 1px solid #fff;
	box-sizing: border-box;
}
.online-nav ul li a span {
	display: inline-block;
	font-size: 32px;
	padding-right: 14px;
	border-right: 1px solid #084EA1;
	margin-right: 14px;

}
.online-nav ul li a:hover {
    filter: grayscale(50%);
    transition-duration: 0.3s;
    background-color: #eee;
	border: 1px solid #999;
}
.online-wthite-cnt {
	background-color: #fff;
	text-align: center;
}
.online-inner,
.covid-inner {
	width: 1100px;
	margin: 0 auto;
	padding: 80px 0;
	text-align: left;
}
.online-inner h2,
.covid-inner h2 {
	font-size: 60px;
	border-bottom:1px solid #084EA1;
	color: #084EA1;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	font-weight: bold;
	padding-bottom: 20px;
	margin: 0 0 40px 0;
	line-height: 1.2;
}
.online-inner h2 span,
.covid-inner h2 span {
	display: inline-block;
	font-size: 43px;
	border-right: 1px solid #084EA1;
	padding-right: 25px;
	margin-right: 25px;
}
.online-inner figure {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.online-inner figure img {
	order: 2;
	margin-left: 20px;
}
.online-inner figure figcaption {
	order: 1;
	margin-right: 40px;
}
.online-inner figure figcaption p {
	margin: 0;
}
.online-bg {
	width: auto;
	height: auto;
	background: url("../../img/online/online_bg.jpg") no-repeat top center;
	background-size: auto 100%;
}
.check-list {
	background-color: #fff;
	margin: 40px 0;
	padding: 35px 80px;
}
.check-list li {
	background: url("../../img/online/check_icon.png") no-repeat top left;
	padding: 0 0 0 35px;
	font-size: 24px;
	margin-bottom: 40px;
	font-weight: bold;
}
.check-list li:last-child {
	margin-bottom: 0;
}
.end-txt {
	text-align: right;
	display: inline-block;
	float: right;
}
.online-soft {
	display: flex;
	justify-content: space-between;
}
.online-contact-flow {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}
.online-contact-flow li img {
	margin: 0 !important;
}

.shadow-over a img,
.online-soft a img {
	border: 1px solid #F7F8F9;
	box-sizing: border-box;
}

.footer-contact-us img {
	border:1px solid #fff;
}
.shadow-over a img:hover,
.online-soft a img:hover {
	border: 1px solid #999;
	box-sizing: border-box;
    filter: grayscale(50%);
    transition-duration: 0.3s;
	box-shadow: 0 0 10px #999;
}

.online-bg02 {
	width: auto;
	height: auto;
	background: url("../../img/online/online_bg02.jpg") no-repeat top center;
	background-size: auto 100%;
}
.online-merit {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.online-merit li {
	margin-bottom: 14px;
}
.online-merit li:last-child,
.online-merit li:nth-last-child(2):nth-child(odd) {
	margin-bottom: 0;
}
.online-bg02 h2 {
	color: #fff;
	border-bottom:2px solid #fff;
}
.online-bg02 h2 span {
	border-right:1px solid #fff;
}

.online-bg03 {
	width: auto;
	height: auto;
	background: url("../../img/online/online_bg03.jpg") no-repeat top center;
	background-size: auto 100%;
}

.online-page .searvice-reason-cnt figure i {
    font-size: 31px;
    width: 66px;
    height: 66px;
    flex-basis: 66px;
    margin: 0 40px 0 10px;
}
.online-page .online-inner figure figcaption {
    margin-right: 0;
}
.online-page .searvice-reason-cnt figure figcaption {
    flex-basis: 950px;
}
.searvice-reason-cnt .online-soft {
	margin-top: 30px;
}
.online-inner .searvice-reason-cnt {
	margin-bottom: 0;
}
.online-inner .searvice-reason-cnt figure {
    align-items: center;
	background: url("../../img/online/white_bg_arrow.png") no-repeat bottom center;
	padding-bottom: 80px;
}
.online-inner .searvice-reason-cnt figure.end {
	padding-bottom: 40px;
	background: none;
	background-color: #fff;
	margin-bottom: 0;
}
.online-inner .searvice-reason-cnt:last-child {
	margin-bottom: 0;
}
.preparation-cnt p {
	margin-bottom: 40px;
}
.online-contact {
    width: auto;
    height: auto;
    background: url(../../img/searvice/price_bg.jpg) top center;
}

.online-contact .footer-contact-area {
    width: auto;
    margin: 0;
    border: none;
    padding-bottom: 0;
}
.online-contact .footer-contact-area ul {
    display: flex;
    justify-content: space-between;
    padding: 0;
}
.page-template-page-online #container {
	background-color: #fff;
}

/* COVID */
.covid-plan {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.covid-plan figure {
	width: calc( ( 100% - 60px ) / 2 );
	margin-right: 60px;
	margin-bottom: 60px;
}
.covid-plan figure:nth-child(2n) {
	margin-right: 0;
}
.covid-plan figure:li:nth-last-child(2):nth-child(odd) {
	margin-bottom: 0;
}
.covid-plan figure img {
	margin-bottom: 20px;
}
.covid-plan figure p {
	margin: 0;
}
.covid-plan figure h3 {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	font-size: 24px;
	color: #084EA1;
	font-weight: bold;
	margin: 0 0 15px 0;
	line-height: 1.2;
}
.covid-plan figure h3 i {
    font-size: 31px;
    color: #fff;
    background-color: #084EA1;
    border: 1px solid #707070;
    width: 66px;
    height: 66px;
    flex-basis: 66px;
    margin: 0 20px 0 0;
    font-style: normal;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.covid-plan + h2 {
	margin-top: 150px;
}
.covid-plan-end {
	width: 970px;
	padding: 30px;
	box-sizing: border-box;
	margin: 50px auto;
	text-align: center;
	border: 1px solid #084EA1;
}
.covid-plan-end p {
	font-size: 40px;
	color: #084EA1;
	font-weight: bold;
	margin: 0;
}
.online-inner h2.no-border {
	display: block;
	text-align: center;
	border: none;
}


@media (max-width: 767px) {
.online-nav {
    width: auto;
    height: auto;
    padding: 40px 20px;
}	
.online-nav ul {
    width: auto;
    display: block;
	}
.online-nav ul li {
    width: auto;
    margin-right: 0;
    margin-bottom: 10px;
}
.online-nav ul li.single-nav {
    width: auto;
}
.online-inner, .covid-inner {
    width: auto;
    padding: 40px 20px;
}
.online-inner h2, .covid-inner h2 {
    font-size: 24px;
    padding-bottom: 20px;
    margin: 0 0 20px 0;
    line-height: 1.2;
}
.online-inner h2 span, .covid-inner h2 span {
    font-size: 24px;
    padding-right: 10px;
    margin-right: 10px;
}
.online-inner figure {
    display: block;
	}
.online-inner figure img {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
	margin-left: 0;
}
.online-bg p {
    font-size: 18px;
}
.check-list {
    margin: 20px 0;
    padding: 20px;
}
.check-list li {
    padding: 0 0 0 35px;
    font-size: 16px;
    margin-bottom: 20px;
}
.online-soft {
    display: block;
}	
.online-soft li:last-child {
	margin-top: 10px;
	}
	#page06 .online-soft {
		display: flex;
		flex-wrap: wrap;
	}
#page06 .online-soft li img {
	width: 100%;
	height: auto;
}
#page06 .online-soft li {
	width: calc( ( 100% - 20px ) / 2 );
	margin-top: 0;
	margin-right: 20px;
	margin-bottom: 10px;
}
#page06 .online-soft li:nth-child(2n) {
	margin-right: 0;
	}
	
.online-merit {
    display: block;
	}
#page08 .footer-contact-area {
    margin: 0 !important;
}
.online-contact .footer-contact-area ul {
    display: block;
}
.online-merit li:nth-last-child(2):nth-child(odd) {
	margin-bottom: 14px;
}
.online-page .searvice-reason-cnt figure i {
    font-size: 36px;
    width: 66px;
    height: 66px;
    flex-basis: inherit;
    margin: 0 auto 10px auto;
}
.page-title {
    padding-top: 40px !important;
}
.page-template-page-covid .page-title {
    padding-top: 49px !important;
}	
.page-template-page-covid .page-title h1 {
    font-size: 26px;
}
.covid-plan-end {
    width: auto;
    padding: 20px;
    margin: 0px auto;
}
	.online-page > .online-inner {
		padding-top: 0;
	}
	.page-template-page-covid .online-inner p {
	margin-top: 0;
	}
.page-template-page-covid .online-inner p:last-child {
	margin-bottom: 0;
	}
.covid-plan {
    display: block;
	}
.covid-plan figure {
    width: auto;
    margin-right: 0;
    margin-bottom: 20px;
}
	.covid-plan figure h3 {
		font-size: 18px;
	}
	.covid-plan figure h3 i {
    font-size: 18px;
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    margin: 0 10px 0 0;
}
.covid-plan figure img {
    margin-bottom: 10px;
}
.covid-plan + h2 {
    margin-top: 40px !important;
}
.covid-plan-end p {
    font-size: 16px;
}
	.covid-plan-end p br {
	}
.online-inner h2.no-border {
    font-size: 18px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.online-contact-flow {
	display: block;
	}
.online-contact-flow li {
	margin-top: 20px;
	}
.online-contact-flow li img {
	border: 1px solid #084EA1;
	}
	
	.online-inner .searvice-reason-cnt {
	padding: 0;
}
	
}