@charset "UTF-8";
/*-----------------------------------

Theme Name: fast-Mirai
Theme URI: 
Description: 未来電子Fastテンプレート
Version: 2.2

-----------------------------------*/


/*リセット
/************************************************************/
html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{
	margin:0;
	padding:0;
}
h1,h2,h3,h4,h5,h6{font-size:100%;}
ol,ul,li,dl{list-style-position: inside;}
ol,ul,li,dl {list-style: none;}
button,input,select,textarea{margin:0;}
html{
	box-sizing:border-box;
	line-height:1;
	font-size: 62.5%;
}
*,*:before,*:after{box-sizing:inherit;}
img,embed,iframe,object,audio,video{max-width:100%;}
iframe{border:0;}
table{
	border-collapse:collapse;
	border-spacing:0;
}
td,th{
	padding:0;
	text-align:left;
}
hr{
	height: 0;
	border: 0;
}


/*ベース
/************************************************************/
body {
	width:100%;
	font-family: "游ゴシック体", "Yu Gothic", "YuGothic", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo, Osaka", "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-size: 1.4rem;
	font-weight:500;
	color:#191919;
	background:#FFF;
	word-wrap : break-word;
	overflow-wrap : break-word;
	padding-top: 140px;
}

@media screen and (max-width: 1000px){
	body {
		padding-top: 70px;
	}
}

button, input, select, textarea{
	font-family:inherit;
	font-weight:inherit;
	font-size:  inherit;
}
a{
	color:inherit;
	text-decoration:none;
}

.font-mincho {
	font-family: 'Noto Serif JP', serif;
}

.bg-pink {
	background-image: url(img/bg_pink.jpg);
	-webkit-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
}

.fade{
  opacity : 0;
  transition: opacity 2s;
}
 
.fade.view{
	opacity: 1;
}

/*レイアウト
/************************************************************/

/*ヘッダー*/
.l-header{
	position:fixed;
	width:100%;
	top: 0;
	left: 0;
	z-index: 99;
	background-color: #FFF;
}

	.l-header-pink {
		background-color: #DB4151!important;
		color: #fff;
	}

	.l-header-pink .header-top .siteTitle h1 span {
		color: #FFF;
	}

	.l-header-pink .header-top .siteTitle h1 img {
		display: none;
	}

	.l-header-pink .header-top .siteTitle p img {
	    display: none;
	}

	.l-header-pink .header-top .siteTitle .siteTitle__link:before {
		content: "";
		width: 90px;
		height: 47px;
		background-image: url(img/logo-w.png);
		display: inline-block;
		-webkit-background-size: cover;
		     -o-background-size: cover;
		        background-size: cover;
	}

.l-header::after {
	content: "";
	display: block;
	clear: both;
}

.header-top {
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	-webkit-align-items: center;
	        align-items: center;
}

.menuNavi {
	background-color: #DB4151;
	padding: 24px;
	position: fixed;
	top: 0;
	right: 0;
}

.menuNavi-w {
	background-color: #FFF;
}

	.menuNavi-w .icon-close:before {
		color: #DB4151;
	}

@media screen and (min-width: 1001px){
	.menuNavi {
		display: none;
	}
}

#menuNavi__menu {
	color: #FFF;
	font-size: 150%;
}

.menu-open {
	display: block!important;
	z-index: 99;
}

/*エキストラ*/
.l-extra{
	position:relative;
	background:#191919;
}
.l-extraNone{display:none;}

/*ラッパー(メイン&サイドバーを囲む要素)*/
.l-wrapper {
	position:relative;
	display: flex;
	width:1200px;
	max-width:98%;
    margin: 40px auto 0;
}

@media (max-width: 640px) {
	.l-wrapper {
		margin-top: 20px;
	}
}

/*メイン*/
.l-main {
	width: 70%;
	padding:0 2.5% 60px 0;
}
.l-main.l-main-single {
	width: 820px;
	max-width:100%;
	padding:60px 0;
	margin: 0 auto;
}
.l-main.l-main-w740{width: 740px;}
.l-main.l-main-w900{width: 900px;}
.l-main.l-main-w100{width: 100%;}

/*サイドバー*/
.l-sidebar {
	width: 30%;
	padding:0 0 60px 2.5%;
}

/*フッター*/
.l-footer {
	position:relative;
	width:100%;
	background:#191919;
}

.contents-padding {
	padding: 80px 10px;
}

.main-contents {
	width: 1200px;
	margin: 0 auto;
}

	@media screen and (max-width: 1400px){
		.main-contents {
			width: 100%;
			padding: 0 100px;
		}
	}

	@media screen and (max-width: 1000px){
		.main-contents {
			padding: 0;
		}
	}

.sub-contents {
	width: 1000px;
	margin: 0 auto;
}
	
	@media screen and (max-width: 1000px){
		.sub-contents {
			width: 100%;
		}
	}


.slim-contents {
	width: 800px;
	margin: 0 auto;
}
	
	@media screen and (max-width: 800px){
		.slim-contents {
			width: 100%;
		}
	}

@media screen and (min-width: 641px){
	.menuNavi__item {
		display: none;
	}
}

.title-single {
	font-family: 'Noto Serif JP', serif;
	text-align: center;
	font-size: 200%;
	font-weight: normal;
}

/*モジュール
/************************************************************/

/*コンテナ(ヘッダー・フッター・エキストラなどで使用)*/
.container{
	position:relative;
	width:1200px;
	max-width:98%;
    margin: 0 auto;
}
.container::after {
	content: "";
	display: block;
	clear: both;
}

/*インフォメーションヘッダー*/
.infoHead{
	text-align:center;
	background:#c53929;
}
.infoHead__link {
    display: block;
	font-weight: 700;
	color:#ffffff;
	height:30px;
	line-height:30px;
}
.infoHead__link:hover {
    background: rgba(255,255,255,0.15);
    transition: .2s;
}

/*サイトタイトル(ヘッダーで使用)*/
.siteTitle{
	overflow:hidden;
	padding: 0;
	display: flex;
	-webkit-align-items: center;
	        align-items: center;
}
/*ロゴがあるとき*/
.siteTitle__logo{
	display:flex;
	max-width:100%;
	-webkit-align-items: center;
	        align-items: center;
}
/*ロゴがないとき*/
.siteTitle__name{
	display:block;
	letter-spacing:0.5px;
	line-height:30px;
}

.siteTitle__link{
	display: block;
	float:left;
	width:auto;
	text-align: center;
	padding: 10px 15px;
}

	@media screen and (max-width: 1000px){
		.siteTitle__link {
			padding: 3.5px 15px;
		}
	}

	@media screen and (max-width: 700px){
		.siteTitle__link {
			padding: 3.5px 3px;
		}
	}

.siteTitle__link span {
	font-size: 90%;
	font-weight: normal;
	color: #DB4151;
}

	@media screen and (max-width: 700px){
		.siteTitle__link span {
			font-size: 10px;
		}
	}

.siteTitle__link:hover {opacity:0.6;}
.siteTitle__img{
	width:auto;
	max-height:47px;
}
.siteTitle__main{
	display:block;
	color:#ffffff;
	font-size:2rem;
	font-weight: 900;
}
.siteTitle__sub{
	font-size: 12px;
	display:block;
	margin-left:10px;
	float:left;
	font-weight: normal;
	padding: 3px 0;
	line-height: 1.4em;
	letter-spacing: 0.1em;
}

	@media screen and (max-width: 700px){
		.siteTitle__sub{
			margin-left:5px;
			font-size: 90%;
		}
	}

/*検索ナビ(エキストラで使用)*/
.searchNavi{
	display: flex;
	padding:15px 0;
}
.searchNavi__title{
	height:30px;
	line-height:30px;
	text-align:center;
	color:#ffffff;
	padding:0 15px;
	background:#f0b200;
	margin-right:5px;
	border-radius:5px;
	font-weight: 500;
}
.searchNavi__list{
	list-style:none;
	flex-grow: 2;
	padding-top: 8px;
	margin-right: 15px;
	overflow: hidden;
}
.searchNavi__item{
	color: #bfbfbf;
	float:left;
	height:14px;
	overflow:hidden;
	line-height:1;
	margin-bottom:8px;
	transition: .2s;
}
.searchNavi__item:hover{
	color:#ffffff;
	font-weight:bold;
}
.searchNavi__link{padding:0 10px;}

.header-right {
	display: flex;
	-webkit-align-items: center;
	        align-items: center;
}

.header-right{
	margin-right: 0;
}

	@media screen and (max-width: 640px){
		.header-subnavi {
			display: none;
		}
	}

.header-tel {
	display: flex;
}

	@media screen and (max-width: 1000px){
		.header-tel {
			display: none;
		}
	}

	.header-tel li {
		padding: 10px;
		display: block;
	}

	.header-tel li p {
		padding-bottom: 5px;
		font-size: 12px;
	}

.header-subnavi a {
	display: flex;
	padding: 4px 10px;
	-webkit-align-items: center;
	        align-items: center;
}

	.header-subnavi a:hover {
		opacity: 0.8;
	}

	.header-subnavi a img {
		margin-right: 3px;
	}

.header-sns {
	display: flex;
	padding: 0 20px;
	-webkit-align-items: center;
	        align-items: center;
}

	@media screen and (max-width: 1000px){
		.header-sns {
			padding: 0 80px 0 20px;
		}
	}

	@media screen and (max-width: 640px){
		.header-sns {
			display: none;
		}
	}

.header-sns a {
	display: block;
	padding: 10px;
}

	.header-sns a .hover {
		display: none;
	}

	.header-sns a:hover .hover {
		display: block;
	}

	.header-sns a:hover .link {
		display: none;
	}

	.header-sns a img {
		display: block;
	}

/*メインナビ(ヘッダーで使用)*/

.mainNavi {
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	padding: 10px;
}

@media screen and (max-width: 1000px){
	.mainNavi {
		display: none;
		height: calc(100vh - 69px);
		width: 100%;
		overflow-y: scroll;
		background-color: #DB4151;
	}	
}

.mainNavi_pc {
	display: flex;
	-webkit-justify-content: center;
	        justify-content: center;
	-webkit-align-items: center;
	        align-items: center;
	width: 100%;
}

@media screen and (max-width: 1000px){
	.mainNavi_pc {
		display: none;
	}
}

.mainNavi_pc a{
	padding: 9.5px 20px;
	display: inline-block;
	cursor: pointer;
	text-align: center;
	line-height: 1.3em;
}

	.mainNavi_pc a:hover {
		color: #DB4151;
	}

	@media screen and (max-width: 1100px){
		.mainNavi_pc a{
			padding: 9.5px 15px;
		}
	}

.mainNavi_pc a span {
	font-size: 90%;
	padding-top: 3px;
}

.mainNavi_smp {
	width: 640px;
	margin: 30px auto;
}

	@media screen and (min-width: 1001px){
		.mainNavi_smp {
			display: none;
		}
	}

	@media screen and (max-width: 640px){
		.mainNavi_smp {
			width: 100%;
		}
	}

	.acd-check{
	    display: none;
	}
	.acd-label{
	    color: #fff;
	    display: block;
	    padding: 20px 20px 20px 0;
	    border-bottom: 1px solid #EB7C87;
	    font-size: 120%;
	    font-weight: bold;
	    position: relative;
	}



	.acd-label:after{
	    box-sizing: border-box;
	    content: '＋';
	    display: block;
	    height: 1em;
	    width: 1em;
	    position: absolute;
	    right: 10px;
	    bottom: 0;
	    top: 0;
	    margin: auto;
	    font-weight: bold;
	    font-size: 20px;
	}

	.acd-content{
	    border-bottom: 1px solid #EB7C87;
	    height: 0;
	    opacity: 0;
	    transition: .5s;
	    visibility: hidden;
	    display: none;
	    padding: 10px 10px 10px 0;
	}

	.acd-check:checked + .acd-label {
		border-bottom: 0;
	}

	.acd-check:checked + .acd-label:after{
	    content: 'ー';
	    font-size: 14px;
	}

	.acd-content a {
		display: inline-block;
		width: 50%;
		padding: 10px 10px 10px 0;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
		color: #FFF;
		line-height: 1.5em;
	}

	.acd-check:checked + .acd-label + .acd-content{
	    opacity: 1;
	    visibility: visible;
	    height: auto;
	    display: flex;
	    -webkit-flex-flow: row wrap;
	        -ms-flex-flow: row wrap;
	            flex-flow: row wrap;
	}

	.mainNavi_smp-tel {
		color: #FFF;
		padding: 40px 0;
		text-align: center;
	}

		.mainNavi_smp-tel a {
			padding: 10px;
			display: block;
		}

		.mainNavi_smp-tel p {
			font-size: 12px;
		}

		.mainNavi_smp-tel img{
			width: 150px;
		}

	.mainNavi_smp-cv {
		text-align: center;
		width: 264px;
		margin: 0 auto;
	}

	.mainNavi_smp-cv p {
		font-weight: bold;
		font-size: 130%;
		margin-bottom: 30px;
		color: #FFF;
	}

	.mainNavi_smp-cv a {
		display: flex;
		-webkit-justify-content: center;
		        justify-content: center;
		-webkit-align-items: center;
		        align-items: center;
		position: relative;
		margin-bottom: 15px;
		-webkit-border-radius: 5px;
		        border-radius: 5px;
		padding: 1.5em;
		font-size: 130%;
		font-weight: bold;
		position: relative;
	}

		.mainNavi_smp-cv a:after {
			content: "〉";
			width: 1em;
			height: 1em;
			position: absolute;
			top: 0;
			bottom: 0;
			right: 10px;
			margin: auto;
			font-weight: bold;
			font-size: 90%;
		}

		.mainNavi_smp-cv a img {
			margin-right: 1em;
		}

		.mainNavi_smp-cv .contact-btn a {
			background-color: #FFF;
			color: #DB4151;
		}

		.mainNavi_smp-cv .repuest-btn a {
			background-color: #FFF;
			color: #DB4151;
		}

		.mainNavi_smp-cv .reservation-btn a{
			background-color: #FFF;
			color: #DB4151;
		}

		.mainNavi_smp-cv .line-btn a {
			background-color: #25C755;
			color: #fff;
		}

	.mainNavi_smp-sns {
		display: flex;
		-webkit-justify-content: center;
		        justify-content: center;
		-webkit-align-items: center;
		        align-items: center;
		padding: 40px 0;
	}

	.mainNavi_smp-sns a {
		padding: 10px;
	}

.right-cv {
	position: fixed;
	right: 0;
	bottom: 100px;
	display: flex;
	-webkit-flex-flow: column wrap;
	    -ms-flex-flow: column wrap;
	        flex-flow: column wrap;
	z-index: 99;
}

	@media screen and (max-width: 1000px){
		.right-cv {
			display: none;
		}
	}

	.right-cv a {
		display: flex;
		-webkit-flex-flow: column wrap;
	    -ms-flex-flow: column wrap;
	        flex-flow: column wrap;
		-webkit-align-items: center;
		        align-items: center;
		-webkit-border-radius: 5px;
		        border-radius: 5px;
		padding: 20px 15px;
		text-align: center;
		transition: ease .4s;
	}

	.right-cv a .hover {
		display: none;
	}

	.right-cv a:before {
		-webkit-background-size: cover;
		     -o-background-size: cover;
		        background-size: cover;
	    background-position: center;
	    transition: ease .4s;
	    margin-bottom: 10px;
	    content: "";
	    transition: ease .4s;
	}

	.right-cv a:hover .hover{
		display: inline;
	}

	.right-cv a:hover .link {
		display: none;
	}

	.right-cv a img {
		padding-bottom: 10px;
	}

	.right-cv div {
		margin-bottom: 10px;
	}

	.right-cv img {
		transition: ease .4s;
	}

	.right-cv .request-btn a{
		border: 1px solid #DB4151;
		background-color: #DB4151;
		color: #fff;
	}

		.right-cv .request-btn a:before {
			width: 15px;
			height: 17px;
			background-image: url(img/ico-note-w.png);
		}

		.right-cv .request-btn a:hover {
			background-color: #FFF;
			color: #DB4151;
		}

		.right-cv .request-btn a:hover:before {
			background-image: url(img/ico-note-p.png);
		}

	.right-cv .reservation-btn a {
		border: 1px solid #DB4151;
		background-color: #fff;
		color: #DB4151;
	}

		.right-cv .reservation-btn a:before {
			width: 17px;
			height: 17px;
			background-image: url(img/ico-calender-p.png);
		}

		.right-cv .reservation-btn a:hover {
			background-color: #DB4151;
			color: #FFF;
		}

		.right-cv .reservation-btn a:hover:before {
			background-image: url(img/ico-calender-w.png);
		}

	.right-cv .line-btn a {
		border: 1px solid #25C755;
		background-color: #25C755;
		color: #fff;
	}

		.right-cv .line-btn a:before {
			width: 22px;
			height: 21px;
			background-image: url(img/ico-line-w.png);
		}

		.right-cv .line-btn a:hover {
			background-color: #FFF;
			color: #25C755;
		}

		.right-cv .line-btn a:hover:before {
			background-image: url(img/ico-line-g.png);
		}




/*パンくずエリアパーツ(複数個所で使用)*/
.breadcrumb{
	font-size: 80%;
	color: #191919;
}

.breadcrumb{
	padding: 13px 21px 21px;
}

.breadcrumb span {
	display: inline-block!important;
	margin: 3px;
}

.breadcrumb a:hover{
	color: #DB4151;
	transition: ease .4s;
}


.nf{
	text-align: center;
}

.nf p{
	font-size: 1.4rem;
	line-height: 2;
	padding-bottom: 54px;
}

@media (max-width: 640px) {
	.nf p{
		text-align: left;
		padding-bottom: 40px;
	}
}

.nf a {
	display: inline-block;
    background-color: #db4151;
    color: #FFF;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    font-size: 120%;
    padding: 22px 10px;
    position: relative;
    width: 290px;
    border: 1px solid #DB4051;
    transition: ease .4s;
}

@media screen and (max-width: 700px){
	.nf a {
		width: 250px;
		padding: 17.5px 10px;
		margin-bottom: 24px;
	}
}

.nf a:before{
	display: block;
    position: absolute;
    content: "";
    background-color: #fcebed;
    width: 90%;
    height: 10px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
    bottom: -11px;
    left: 0;
    right: 0;
    margin: auto;
}

.nf a:hover{
	background-color: #fff;
	color: #db4151;
}


.nf a:after {
    content: url(img/more.svg);
    width: 7px;
    height: 14px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
}

.nf a:hover:after {
    content: url(img/more-p.svg);
}

.slick-slide:focus {
  outline: none;
}


.l-header-pink .header-top .siteTitle .siteTitle__link:before {
	background-image: url(../../img/lp/logo-w.png);
}

/*LPページ*/
.lp-wrapper {
	 max-width: 1200px;
	 margin: 0 auto;
	 padding: 0 24px;
}
 @media screen and (max-width: 640px) {
	 .lp-wrapper {
		 max-width: 100%;
	}
}
 @media screen and (max-width: 320px) {
	 .lp-wrapper {
		 padding: 0 15px;
	}
}

#mainVisual {
	 background-image: url(../../img/lp/beige-bg.png);
	 background-color: rgba(235,234,232,0.32);
	 z-index: 2;
	 position: relative;
}
 #mainVisual .lp-wrapper {
	 display: flex;
	 position: relative;
	 height: 702px;
	 padding: 0 20px;
}
 @media screen and (max-width: 900px) {
	 #mainVisual .lp-wrapper {
		 display: block;
		 text-align: center;
	}
}
 #mainVisual .left {
	 width: 46.25%;
	 margin-right: auto;
	 position: relative;
	 z-index: 2;
}
 @media screen and (max-width: 640px) {
	 #mainVisual .left {
		 width: 100%;
		 margin: 0 auto;
	}
}
 #mainVisual .left .inner {
	 padding-top: 65px;
}
 @media screen and (min-width: 901px) {
	 #mainVisual .left .inner {
		 position: absolute;
		 top: 50%;
		 transform: translate(0,-50%);
		 padding-top: 0;
	}
}
 @media screen and (max-width: 900px) {
	 #mainVisual .left .catchCopy-pc {
		 display: none;
	}
}
 @media screen and (min-width: 901px) {
	 #mainVisual .left .catchCopy-sm {
		 display: none;
	}
}
 #mainVisual .left .subCatchCopy-pc {
	 padding: 25px 0 10px;
}
 @media screen and (max-width: 900px) {
	 #mainVisual .left .subCatchCopy-pc {
		 display: none;
	}
}
 #mainVisual .left .subCatchCopy-sm {
	 padding: 20px 0 12px;
}
 @media screen and (min-width: 901px) {
	 #mainVisual .left .subCatchCopy-sm {
		 display: none;
	}
}
 #mainVisual .left .text-pc {
	 padding-bottom: 30px;
}
 @media screen and (max-width: 900px) {
	 #mainVisual .left .text-pc {
		 display: none;
	}
}
 #mainVisual .right {
	 position: absolute;
	 bottom: 0;
	 right: 0;
	 z-index: 1;
}
 @media screen and (max-width: 900px) {
	 #mainVisual .right {
		 width: 479px;
	}
}
 @media screen and (max-width: 640px) {
	 #mainVisual .right {
		 width: 279px;
		 left: 0;
		 right: 0;
		 margin: auto;
	}
}
 .dia-line {
	 position: relative;
}
 .dia-line:before {
	 content: '';
	 background-image: url(../../img/lp/dia-line.png);
	 width: 100%;
	 height: 39px;
	 top: 0;
	 left: 0;
	 position: absolute;
}
 .dia-line:after {
	 content: '';
	 background-image: url(../../img/lp/dia-line.png);
	 width: 100%;
	 height: 39px;
	 bottom: 0;
	 left: 0;
	 position: absolute;
}
 .dia-s-line {
	 position: relative;
}
 .dia-s-line:before {
	 content: '';
	 background-image: url(../../img/lp/dia.png);
	 width: 100%;
	 height: 29px;
	 top: 0;
	 left: 0;
	 position: absolute;
	 background-size: contain;
}
 .dia-s-line:after {
	 content: '';
	 background-image: url(../../img/lp/dia.png);
	 width: 100%;
	 height: 29px;
	 bottom: 0;
	 left: 0;
	 position: absolute;
	 background-size: contain;
}
 .dod-bg {
	 position: relative;
}
 .dod-bg:after {
	 content: '';
	 background-image: url(../../img/lp/dod-bg.png);
	 width: 94%;
	 height: 18px;
	 bottom: -18px;
	 right: 0;
	 left: 0;
	 margin: auto;
	 position: absolute;
}
 .mainNavi_smp ul {
	 margin: 0 25px 28px;
}
 .mainNavi_smp a {
	 padding: 24px 0;
	 font-size: 1.4rem;
	 display: block;
	 border-top: 1px solid #EB7C87;
}
 .mainNavi_smp li:last-child a {
	 border-bottom: 1px solid #EB7C87;
}
 .mainNavi_smp .lp-cv .lp-wrapper {
	 padding: 0 10px;
}
 .mainNavi_smp .lp-cv dd a {
	 border-top: 0;
	 padding: 0;
}


#contract {
	 background-image: url(../../img/lp/stripe-pink.png);
	 padding: 153px 0 95px;
}
 @media screen and (max-width: 640px) {
	 #contract {
		 padding: 80px 0;
	}
}
 #contract .dia-line {
	 height: 29px;
}
 @media screen and (max-width: 375px) {
	 #contract .lp-wrapper {
		 padding: 0 15px;
	}
}
 @media screen and (max-width: 320px) {
	 #contract .lp-wrapper {
		 padding: 0 10px;
	}
}
 #contract .wrap {
	 max-width: 890px;
	 margin: 0 110px 50px auto;
	 background-color: #F9F8F7;
	 position: relative;
	 padding: 58px 47px;
}
 @media screen and (max-width: 1150px) {
	 #contract .wrap {
		 margin: 0 88px 50px auto;
	}
}
 @media screen and (max-width: 640px) {
	 #contract .wrap {
		 max-width: 100%;
		 padding: 55px 20px;
		 margin: 0 auto 20px;
	}
}
 @media screen and (max-width: 375px) {
	 #contract .wrap {
		 padding: 55px 15px;
	}
}
 #contract .wrap .heading02 {
	 position: relative;
}
 #contract .wrap .heading02 img {
	 left: 0;
	 right: 0;
	 top: -111px;
	 position: absolute;
	 margin: auto;
}
 @media screen and (max-width: 640px) {
	 #contract .wrap .heading02 img {
		 width: 207px;
		 top: -97px;
	}
}
 #contract .wrap ul {
	 display: flex;
	 flex-wrap: wrap;
	 justify-content: space-between;
}
 @media screen and (max-width: 1050px) {
	 #contract .wrap ul {
		 flex-direction: column;
	}
}
 #contract .wrap ul li {
	 width: 48.5%;
	 position: relative;
	 margin-bottom: 30px;
}
 @media screen and (max-width: 1050px) {
	 #contract .wrap ul li {
		 width: 100%;
	}
}
 #contract .wrap ul li dl {
	 display: flex;
	 font-weight: bold;
	 align-items: center;
	 position: relative;
	 z-index: 1;
}
 #contract .wrap ul li dl dt {
	 width: 22%;
	 font-size: 1.6rem;
	 background-color: #DB4151;
	 color: #fff;
	 padding: 16px 15px;
	 border-radius: 35px 0 0 35px;
	 display: flex;
	 align-items: center;
}
 @media screen and (max-width: 1050px) {
	 #contract .wrap ul li dl dt {
		 justify-content: center;
	}
}
 @media screen and (max-width: 640px) {
	 #contract .wrap ul li dl dt {
		 font-size: 1.2rem;
		 padding: 13px 10px 13px 13px;
	}
}
 @media screen and (max-width: 320px) {
	 #contract .wrap ul li dl dt {
		 width: 24%;
	}
}
 #contract .wrap ul li dl dt span {
	 font-size: 2.6rem;
	 margin: 0 3px;
}
 @media screen and (max-width: 640px) {
	 #contract .wrap ul li dl dt span {
		 font-size: 2.2rem;
	}
}
 @media screen and (max-width: 320px) {
	 #contract .wrap ul li dl dt span {
		 font-size: 1.8rem;
	}
}
 #contract .wrap ul li dl dd {
	 width: 78%;
	 font-size: 2rem;
	 background-color: #fff;
	 padding: 18px;
	 border-radius: 0 35px 35px 0;
}
 @media screen and (max-width: 640px) {
	 #contract .wrap ul li dl dd {
		 font-size: 1.6rem;
		 padding: 15px;
	}
}
 @media screen and (max-width: 320px) {
	 #contract .wrap ul li dl dd {
		 font-size: 1.4rem;
		 width: 76%;
		 padding: 15px 10px;
	}
}
 #contract .wrap ul li dl dd span {
	 color: #DB4151;
}
 @media screen and (max-width: 1050px) {
	 #contract .wrap ul li:nth-child(2n+1) {
		 order: 1;
	}
}
 @media screen and (max-width: 1050px) {
	 #contract .wrap ul li:nth-child(2n) {
		 order: 2;
	}
}
 #contract .wrap ul li:after {
	 content: '';
	 bottom: 0;
	 width: 97%;
	 height: 46.5px;
	 left: 0;
	 right: 0;
	 bottom: -10px;
	 margin: auto;
	 position: absolute;
	 z-index: 0;
	 border-radius: 35px;
	 background-image: url(../../img/lp/contract-dod.png);
	 background-repeat: no-repeat;
}
 @media screen and (max-width: 1050px) {
	 #contract .wrap ul li:after {
		 width: 92%;
		 background-image: url(../../img/lp/dod-bg.png);
		 background-repeat: repeat;
		 bottom: -7px;
	}
}
 @media screen and (max-width: 420px) {
	 #contract .wrap ul li:after {
		 bottom: -10px;
		 background-image: url(../../img/lp/contract-dod.png);
		 background-repeat: no-repeat;
	}
}
 #contract .wrap .dod-deco {
	 width: 94%;
	 position: absolute;
	 bottom: -20px;
	 right: 0;
	 left: 0;
	 margin: auto;
}
 @media screen and (max-width: 900px) {
	 #contract .wrap .dod-deco {
		 display: none;
	}
}
 #contract .wrap .staff-r-pic {
	 position: absolute;
	 right: -106px;
	 bottom: 0;
}
 @media screen and (max-width: 640px) {
	 #contract .wrap .staff-r-pic {
		 display: none;
	}
}
 #contract .exclusive {
	 text-align: center;
}
 @media screen and (max-width: 420px) {
	 #contract .exclusive .quoCard-pc {
		 display: none;
	}
}
 @media screen and (min-width: 421px) {
	 #contract .exclusive .quoCard-sm {
		 display: none;
	}
}
 #contract .exclusive .text {
	 font-size: 2.6rem;
	 line-height: 1.6;
	 padding: 55px 0 10px;
}
 @media screen and (max-width: 640px) {
	 #contract .exclusive .text {
		 font-size: 2rem;
	}
}
 @media screen and (max-width: 640px) {
	 #contract .exclusive .text .br-sm {
		 display: block;
	}
}
 @media screen and (min-width: 641px) {
	 #contract .exclusive .text .br-sm {
		 display: none;
	}
}
 


