@charset "utf-8";


/* ============================================================
 init
============================================================ */
body {
	color: #333;
	line-height: 1.6;
	-webkit-text-size-adjust:100%;
	font-family: 'Roboto' ,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo","メイリオ", "ＭＳ Ｐゴシック", "MS P Gothic", Osaka, sans-serif;
	font-size: 16px;
	 -webkit-font-smoothing: subpixel-antialiased;
	 -moz-osx-font-smoothing: auto;
}
#wrap {
	position: relative;
	min-width: 1000px;
	width: 100%;
	min-height: 100%;
	overflow: hidden;
	zoom: 1;
}
@media screen and (max-width: 737px) { /* for SP */
	body {
		line-height: 1.6;
		font-size: 14px;
	}
	#wrap {
		min-width: 320px;
		width: 100%;
	}
}
/* tag
------------------------------------------------------------ */
img {
	height: auto;
	border:0;
	vertical-align:bottom;
}
	
/* link
------------------------------------------------------------ */
a { 
	color: #a64b95;
	overflow: hidden;
}

a:link {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}
.rollOpa:hover {
	text-decoration: none;
	filter: alpha( opacity=70 );
	opacity: 0.7;
}
.btn a {
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
.btn a:hover {
	opacity: 0.5;
}
.btn .tel a,
.btn .tel a:hover {
	transition: none;
	opacity: 1;
}
/* class
------------------------------------------------------------ */
.clearfix,
ul,
dl {
	zoom:1;
}
.clearfix:after,
ul:after,
dl:after {
	content:"";
	display:block;
	clear:both;
	visibility:hidden;
}
input {
	vertical-align: middle;
}
input[type="submit"] {
  -webkit-appearance: none;
	border-radius: 0;
}

.hgroup,
.block,
.outer,
.inner,
.row,
.box,
.cell,
.flame {
	position:relative;
	zoom:1;
}
	
.hgroup:after,
.block:after,
.outer:after,
.inner:after,
.row:after,
.box:after,
.cell:after,
.flame:after {
	content: "";
	display: block;
	clear: both;
}
.box,
.cell {
	float:left;
}
.box.right,
.cell.right {
	float:right;
}
.txtRight {
	text-align: right;
}
.txtCenter {
	text-align: center;
}
.lato {
	font-family: 'Lato', sans-serif;
}
@media screen and (max-width: 737px) { /* for SP */
	.box,
	.box.right {
		float: none;
	}
}
/* bg
============================================================ */
#wrap .bgYellow {
	margin-top: 40px;
	background-color: #fdf6e9;
	padding: 40px 0;
}
#wrap .bgYellow .block,
#wrap .bgGray .block {
	margin-top: 0;
}
#wrap .bgGray {
	margin-top: 40px;
	padding: 40px 0;
	background-color: #f5f5f5;
}
@media screen and (max-width: 737px) { /* for SP */
	#wrap .bgYellow {
		margin-top: 20px;
		padding: 20px 10px;
	}
	#wrap .bgGray {
		margin-top: 20px;
		padding: 20px 10px;
	}
	#wrap .bgYellow .inner,
	#wrap .bgGray .inner {
		padding: 0;
	}
}

/* h2_Styles
============================================================ */

#wrap h2.bg_title01 {
	background: url(../img/h2_bg01.png) repeat-x;
	background-size: 6px 6px;
	background-position: center;
	text-align: center;
	font-size: 32px;
}
#wrap h2.bg_title01 strong {
	font-weight: bold;
	display: inline-block;
	background-color: #fff;
	padding: 0 20px;
}
#wrap h2.bg_title01 span {
	font-size: 24px;
}
#wrap .bgYellow h2.bg_title01 strong {
	background-color: #fdf6e9;
}
#wrap .bgGray h2.bg_title01 strong {
	background-color: #f5f5f5;
}
#wrap .subTitle {
	text-align: center;
	margin-top: 25px;
}

@media screen and (max-width: 737px) { /* for SP */
	#wrap h2.bg_title01 {
		background-size: 7px 6px;
		font-size: 24px;
		line-height: 1.4;
	}
	#wrap h2.bg_title01 strong {
		padding: 0 10px;
	}
	#wrap h2.bg_title01 span {
		display: block;
		font-size: 14px;
	}
	#wrap .subTitle {
		margin-top: 10px;
		font-size: 16px;
	}
}
/* js予約 */
.btn {}
.rollover {}
.imgLink {}

.spElement {
	display: none !important;
}
@media screen and (max-width: 737px) { /* for SP */
	.spElement {
		display: block !important;
	}
	.pcElement {
		display: none !important;
	}
	.spElementInline {
		display: inline !important;
	}
	.pcElementInline {
		display: inline !important;
	}
	.spElementInlineBlock {
		display: inline-block !important;
	}
	.pcElementInlineBlock {
		display: inline-block !important;
	}
}

#container {
	padding-bottom: 40px;
}
#container .block {
	margin-top: 40px;
}
#container .detailBtn a {
	display: block;
	position: relative;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-color: #a64b95;
	width: 260px;
	line-height: 50px;
	color: #fff;
	text-align: center;
	font-size: 16px;
	margin: 40px auto 0;
}
#container .detailBtn a:before {
    content: "\e913";
	font-family: 'icomoon' !important;
	position: absolute;
	right: 13px;
	font-size: 38px;
	top: 1px;
}
#container .detailBtn a:hover {
	text-decoration: none;
}
#container {
	margin: 0 auto;
	width: 100%;
}
#wrap .inner {
	width: 1000px;
	margin: auto;
}
@media screen and (max-width: 737px) { /* for SP */
	#container {
		padding-bottom: 20px;
	}
	#wrap .inner {
		width: 100%;
		padding: 0 10px;
		box-sizing:border-box;
	}
	#container .block {
		margin-top: 20px;
	}
	#container .detailBtn a {
		width: 100%;
		line-height: 44px;
		margin-top: 20px;
	}
}

/* bread
============================================================ */
.bread {
	background-color: rgba(0, 0, 0, .7);
	margin-top: 20px !important;
}
.bread li {
	display: inline-block;
	color: #FFF;
	font-size: 14px;
	line-height: 38px;
}
.bread li a {
	color: #FFF;
}
.bread li.va {
	font-size: 10px;
}
@media screen and (max-width: 737px) {
	.bread {
		margin-top: 0 !important;
	}
	.bread li {
		overflow: hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
		vertical-align: middle;
	}
	.bread ul li:last-child {
		width: 55%;
		width: -webkit-calc(100% - 135px);
		width: calc(100% - 135px);
	}
}


/* contentsArea
============================================================ */
#wrap .contentsArea {
	margin-top: 30px;
}
#wrap .contentsArea .row + .row {
	margin-top: 20px;
}
#wrap .contentsArea .row dl {
	border: solid 1px #ddd;
	padding: 20px 20px 22px 355px;
	position: relative;
}
#wrap .contentsArea .row dt {
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 12px;
}
#wrap .contentsArea .row dt span {
	font-size: 40px;
	vertical-align: middle;
	padding-right: 15px;
}
#wrap .contentsArea .row dd.img {
	position: absolute;
	left: 20px;
	top: 20px;
	padding: 4px;
	border: solid 1px #888;
	width: 304px;
	height: auto;
	box-sizing: border-box;
}
#wrap .contentsArea .row dd.img img {
	width: 294px;
	height: auto;
}
#wrap .contentsArea .row dd.btn {
	float: right;
	padding-top: 20px;
}
#wrap .contentsArea .row dd.btn a {
	display: block;
	line-height: 50px;
	background-color: #a64b95;
	color: #fff;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	text-align: center;
	position: relative;
}
#wrap .contentsArea .row dd.btn a:before {
    content: "\e913";
	font-family: 'icomoon' !important;
	position: absolute;
	right: 13px;
	top: 2px;
	font-size: 38px;
}
#wrap .contentsArea .row dd.btn a:hover {
	text-decoration: none;
}
#wrap .contentsArea .row dd.btn_02 li {
	float: left;
	width: 200px;
}
#wrap .contentsArea .row dd.btn_02 li + li {
	margin-left: 20px;
}

@media screen and (max-width: 737px) {
	#wrap .contentsArea .row {
		margin: 0 -10px;
	}
	#wrap .contentsArea .row + .row {
		margin-top: 0;
	}
	#wrap .contentsArea .row + .row dl {
		border-top: none;
	}
	#wrap .contentsArea .row dl {
		padding: 5px 10px 20px;
		border-left: none;
		border-right: none;
	}
	#wrap .contentsArea .row dt {
		font-size: 18px;
		border-bottom: solid 1px #eee;
		padding-bottom: 0;
	}
	#wrap .contentsArea .row dt span {
		font-size: 38px;
		padding-right: 13px;
	}
	#wrap .contentsArea .row dd.txt {
		padding-top: 10px;
		font-size: 16px;
	}
	#wrap .contentsArea .row dd.img {
		position: static;
		border: none;
		padding: 5px 31px 0;
		box-sizing: border-box;
		width: 100%;
		height: auto;
	}
	#wrap .contentsArea .row dd.img img {
		width: 100%;
	}
	#wrap .contentsArea .row dd.btn a {
		line-height: 44px;
	}
	#wrap .contentsArea .row dd.btn_01 {
		width: 100%;
	}
	#wrap .contentsArea .row dd.btn_02 {
		float: none;
	}
	#wrap .contentsArea .row dd.btn_02 li {
		width: 48%;
	}
	#wrap .contentsArea .row dd.btn_02 li + li {
		margin-left: 4%;
	}
	#wrap .contentsArea .row dd.btn_02 li a {
		width: auto;
		padding-left: 14px;
		text-align: left;
		box-sizing: border-box;
	}
}

/* conversionArea
============================================================ */
#wrap .conversionArea {
	margin-top: 40px;
}
#wrap .conversionArea p.title {
	position: relative;
	font-size: 24px;
	text-align: center;
	font-weight: bold;
	width: 550px;
	margin: auto;
}
#wrap .conversionArea p.title:after {
	display: block;
	content: "";
	border-left: solid 2px #000;
	position: absolute;
	left: -10px;
	top: 0;
	width: 18px;
	height: 30px;
	transform: rotate(-30deg);
}
#wrap .conversionArea p.title:before {
	display: block;
	content: "";
	border-right: solid 2px #000;
	position: absolute;
	right: 0;
	top: 0;
	width: 18px;
	height: 30px;
	transform: rotate(30deg);
}
#wrap .conversionArea ul {
	margin-top: 15px;
	margin-bottom: 10px;
}
#wrap .conversionArea li {
	float: left;
	font-size: 28px;
	font-weight: bold;
}
#wrap .conversionArea li.primary a {
	width: 320px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	background-color: #a64b95;
	position: relative;
	text-align: center;
	display: block;
	color: #fff;
	padding: 18px 0 17px;
}
#wrap .conversionArea li a:hover {
	text-decoration: none;
}
#wrap .conversionArea li + li {
	margin-left: 20px;
}
#wrap .conversionArea li span:before {
	font-size: 32px;
	position: absolute;
	left: 26px;
	margin-top: -16px;
	top: 50%;
}
#wrap .conversionArea li.secondary {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	width: 320px;
	background-color: #fff;
	border: solid #ddd 1px;
	font-size: 18px;
	line-height: 22px;
}
#wrap .conversionArea li.secondary.spElement {
	display: none;
}
#wrap .conversionArea li.secondary a {
	display: block;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	box-sizing: border-box;
	position: relative;
	color: #333;
	text-align: left;
}
#wrap .conversionArea li.secondary .tel-txt {
	padding: 13px 0 4px 82px;
	pointer-events: none;
}
#wrap .conversionArea li.secondary .mail-link {
	text-decoration: underline;
	padding: 4px 0 12px 82px;
	pointer-events: auto;
}
#wrap .conversionArea li.secondary a:before {
	font-family: 'icomoon' !important;
	font-size: 24px;
	position: absolute;
	left: 38px;
	top: 50%;
}
#wrap .conversionArea li.secondary .tel-txt:before {
	content: "\e914";
	margin-top: -7px;
}
#wrap .conversionArea li.secondary .mail-link:before {
	content: "\e909";
	margin-top: -13px;
}
#wrap .conversionArea li.secondary p {
	font-family: 'Roboto' ,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo","メイリオ", "ＭＳ Ｐゴシック", "MS P Gothic", Osaka, sans-serif;
	line-height: 0.8;
	font-size: 30px;
}
#wrap .conversionArea li.secondary p + p {
	font-size: 12px;
	font-weight: normal;
	line-height: 1.8;
	padding-top: 5px;
}
#wrap .conversionArea .contact {
	display: flex;
	-webkit-justify-content: flex-end;
	        justify-content: flex-end;
}
#wrap .conversionArea .contact .snsBox {
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
}
#wrap .conversionArea p.mailNote {
	font-size: 12px;
	margin-top: 8px;
	padding-right: 16px;
}
#wrap .conversionArea p.mailNote .spBr {
	display: none;
}
#wrap .conversionArea p.mailNote a {
	color: #333;
	text-decoration: underline;
}
#wrap .conversionArea p.mailNote a:hover {
	text-decoration: none;
}
#wrap .conversionArea a.snsIcon + a.snsIcon {
	margin-left: 10px;
}
#wrap .conversionArea a.snsIcon {
	-webkit-transition: all 1s;
	   -moz-transition: all 1s;
	    -ms-transition: all 1s;
	     -o-transition: all 1s;
	        transition: all 1s;
}
#wrap .conversionArea a.snsIcon:hover {
	opacity: 0.5;
}
#wrap .conversionArea .line-btn-box {
	justify-content: center;
	margin-left: 10px;
}
#wrap .conversionArea .line-btn-box .line-btn-txt {
	font-size: 16px;
	line-height: 1;
}

@media screen and (max-width: 737px) { /* for SP */
	#wrap .conversionArea {
		margin-top: 15px;
		box-sizing: border-box;
	}
	#wrap .conversionArea p.title {
		font-size: 12px;
		width: 260px;
	}
	#wrap .conversionArea p.title:before,
	#wrap .conversionArea p.title:after {
		width: 9px;
		height: 15px;
		border-width: 1px;
	}
	#wrap .conversionArea p.title:before {
		right: -5px;
	}
	#wrap .conversionArea ul {
		margin-top: 10px;
	}
	#wrap .conversionArea li {
		width: 49%;
	}
	#wrap .conversionArea li + li {
		margin-left: 2%;
	}
	#wrap .conversionArea li.primary a {
		font-size: 16px;
		padding: 12px 0 12px 35px;
		width: auto;
		box-sizing: border-box;
	}
	#wrap .conversionArea li span::before {
		left: 13px;
		font-size: 24px;
		margin-top: -10px;
	}
	#wrap .conversionArea li.secondary {
		margin: 10px 0 0;
		width: 100%;
	}
	#wrap .conversionArea li.secondary a {
		border: none;
		background-color: #a64b95;
		color: #fff;
		padding: 7px 0 6px;
		text-align: center;
		pointer-events: auto;
	}
	#wrap .conversionArea li.secondary a:before {
		font-size: 24px;
		font-weight: normal;
		margin-top: -20px;
		left: 13px;
	}
	#wrap .conversionArea li.secondary p {
		font-size: 20px;
	}
	#wrap .conversionArea li.secondary p + p {
		font-size: 10px;
		padding-top: 3px;
	}
	#wrap .conversionArea li.secondary.spElement {
		display: block;
	}
	#wrap .conversionArea li.secondary .mail-link.pcElement {
		display: none;
	}
	#wrap .conversionArea li.secondary .tel-txt {
		padding: 7px 0;
		pointer-events: auto;
	}
	#wrap .conversionArea li.secondary .tel-txt:before {
		margin-top: -10px;
	}
	#wrap .conversionArea li.secondary .mail-link {
		padding: 7px 0;
	}
	#wrap .conversionArea li.secondary .mail-link:before {
		margin-top: -11px;
	}
	#wrap .conversionArea p.mailNote {
		float: none;
		margin-right: 10px;
		padding-right: 0;
		text-align: center;
	}
	#wrap .conversionArea p.mailNote .spBr {
		display: block;
	}
	#wrap .conversionArea p.mailNote a {
		font-size: 14px;
	}
	#wrap .conversionArea .contact {
		-webkit-flex-wrap: wrap;
		    -ms-flex-wrap: wrap;
		        flex-wrap: wrap;
	    -webkit-justify-content: center;
	            justify-content: center;
	}
	#wrap .conversionArea .snsBox {
		margin-top: 10px;
	}
}

/* NewsArea
============================================================ */

#wrap #container .newsArea {
	margin-top: 40px;
}
#wrap #container .newsArea li {
	border-top: 1px solid #ddd;
}
#wrap #container .newsArea li:last-child {
	border-bottom: 1px solid #ddd;
}
#wrap #container .newsArea li a {
	display: block;
	padding: 10px 0;
	text-decoration: none;
}
#wrap #container .newsArea li a dl {
	display: table;
	width: 100%;
}
#wrap #container .newsArea li a dl span {
	color: #fff;
	background-color: #666;
	display: inline-block;
	text-align: center;
	padding: 1px 9px 0 8px;
	font-size: 12px;
	margin-left: 10px;
}
#wrap #container .newsArea li a dt {
	display: table-cell;
	color: #999;
	width: 120px;
}
#wrap #container .newsArea li a dd {
	text-decoration: underline;
	display: table-cell;
	color: #333;
}
#wrap #container .newsArea li a:hover dd {
	text-decoration: none;
}
@media screen and (max-width: 737px) {
	#wrap #container .newsArea {
		margin-top: 20px;
	}
	#wrap #container .newsArea li a dl {
		display: block;
	}
	#wrap #container .newsArea li a dl span {
		margin-left: 0;
		float:right;
		padding: 0 4px 0 5px;
		margin-top: 5px;
		line-height:1.3;
	}
	#wrap #container .newsArea li a {
		padding: 5px 0;
	}
	#wrap #container .newsArea li a dt {
		width: 125px;
		font-size: 16px;
	}
	#wrap #container .newsArea li a dt,
	#wrap #container .newsArea li a dd {
		display: block;
	}
	#wrap #container .newsArea li a dd {
		color: #666;
		font-size: 16px;
		text-decoration: none;
	}
}


/* footer
============================================================ */
#wrap footer {
	width: 100%;
	min-width: 1000px;
	background-color: #f5f5f5;
	border-top: 1px solid #ddd;
}
#wrap footer .footerNav {
	width: 743px;
	margin: 0 auto;
}
#wrap footer .footerNav:after {
	display: block;
	content:"";
	clear: both;
}
#wrap footer .footerNav ul {
	padding: 15px 0;
	margin: 0 auto;
	float: left;
}
#wrap footer .footerNav li {
	font-size: 14px;
	display: inline-block;
}
#wrap footer .footerNav li span {
	color: #ddd;
	padding-left: 9px;
	margin-right: 9px;
}
#wrap footer .footerNav li a {
	color: #333;
	box-sizing: border-box;
}
#wrap footer .copy {
	background-color: #fff;
	-webkit-box-shadow: 0 -2px #666;
	-moz-box-shadow: 0 -2px #666;
	box-shadow: 0 -2px #666;
	padding: 15px 0;
	font-size: 14px;
	color: #333;
	text-align: center;
}
@media screen and (max-width: 737px) { /* for SP */
	#wrap footer {
		min-width: 320px;
		-webkit-box-shadow: 0 -1px #ddd;
		-moz-box-shadow: 0 -1px #ddd;
		box-shadow: 0 -1px #ddd;
	}
	#wrap footer .footerNav {
		width: 270px;
		padding-bottom: 10px;
	}
	#wrap footer .footerNav ul {
		width: 100%;
		padding: 10px 0 0;
		box-sizing: border-box;
		margin: 0 auto;
		text-align: center;
		float: none;
	}
	#wrap footer .footerNav li {
		text-align: center;
	}
}
/* pageTop
------------------------------------------------------------ */
.pageTop {
	right: 42px;
	bottom: 30px;
	position: fixed;
}
.pageTop a:hover {
	opacity: .7;
}
.pageTop img {
	width: 48px;
}
@media screen and (max-width: 737px) { /* for SP */
	.pageTop {
		right: 10px;
		bottom: 10px;
	}
}

/* 404
------------------------------------------------------------ */
#c404 #container {
	margin-top: 26px;
	padding: 80px 0 60px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
#c404 .inner {
	text-align: center;
}
#c404 .inner dt {
	color: #3258a5;
	font-size: 48px;
	line-height: 0.6;
	font-weight: bold;
}
#c404 .inner dt span {
	display: block;
	font-size: 100px;
}
#c404 .inner dd p.title {
	font-size: 32px;
	line-height: 2.1;
	margin: 10px 0;
}
@media screen and (max-width: 737px) { /* for SP */
	#c404 #container {
		border-top: none;
		padding: 30px 0 20px;
		margin-top: 0;
	}
	#c404 .inner dt {
		font-size: 30px;
		line-height: 1.4;
	}
	#c404 .inner dt span {
		font-size: 56px;
		line-height: 0.6;
	}
	#c404 .inner dd p {
		font-size: 16px;
	}
	#c404 .inner dd p.title {
		font-size: 18px;
		line-height: 1.6;
		margin: 0 0 15px;
	}
	#c404 #container .detailBtn a {
		margin-top: 15px;
	}
}

/*下層共通部分
=============================================*/
#mainVisual {
	width: 100%;
	height: 240px;
}
.mainTitle {
	margin-top: 22px !important;
	color: #FFF;
	text-align: center;
}
.mainTitle .icon {
	font-size: 75px;
}
.mainTitle h1 {
	margin-top: 8px;
	font-size: 40px;
	line-height: 1;
}
.mainDesc {
	margin: 60px auto 20px !important;
	text-align: center;
}
.staffVoice {
	margin-top: 40px !important;
	padding: 30px !important;
	background-color: #e5eeff;
	background-image: url(../img/bg_deco_01.png);
	background-repeat: no-repeat;
	background-position: right bottom;
	-webkit-background-size: 40px 30px;
	     -o-background-size: 40px 30px;
	        background-size: 40px 30px;
}
.bgGray .staffVoice {
	background-image: url(../img/bg_deco_02.png);
}
.staffVoice dl {
	display: table;
}
.staffVoice dt,
.staffVoice dd {
	display: table-cell;
	vertical-align: middle;
}
.staffVoice dt {
	width: 150px;
	padding-right: 20px;
	border-right: 1px solid #98add9;
	color: #3258A5;
	text-align: center;
}
.staffVoice dt p {
	font-size: 20px;
	font-weight: bold;
}
.staffVoice .icon {
	font-size: 44px;
	font-weight: normal;
}
.staffVoice dd {
	padding-left: 30px;
}
.staffVoice dd p + p {
	margin-top: 25px;
}
.staffVoice .subTtl {
	font-weight: bold;
	color: #3258a5;
}
.block02 .staffVoice + .staffVoice dt p {
	font-size: 18px;
}
.intro {
	padding: 20px !important;
	background: #FFF;
	border: 1px solid #ddd;
}
.intro:first-of-type {
	margin-top: 40px;
}
.intro + .intro {
	margin-top: 20px;
}
.intro > .box {
	width: 40.666%;
}
.intro > .box.right {
	width: 59.333%;
}
.intro dl {
	padding-right: 20px;
}
.intro dt {
	padding-bottom: 4px;
	font-size: 20px;
	font-weight: bold;
	border-bottom: 1px solid #ddd;
}
.intro dd {
	margin-top: 15px;
}
.compare {
	position: relative;
}
.block > .compare:first-of-type {
	margin-top: 40px;
}
.compare + .compare {
	margin-top: 40px;
}
.compare:before {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	margin-left: -27px;
	border-right: 17px solid #333;
	border-bottom: 17px solid #333;
	border-top: 17px solid transparent;
	border-left: 17px solid transparent;
	content: '';
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}
.intro .compare:before {
	margin-left: -17px;
	border-right: 10px solid #333;
	border-bottom: 10px solid #333;
	border-top: 10px solid transparent;
	border-left: 10px solid transparent;
}
.compare .box {
	width: 47%;
}
.intro .compare .box p {
	position: relative;
}
.intro .compare .box p:before {
	position: absolute;
	top: 0;
	left: 0;
	width: 54px;
	height: 24px;
	background: #333;
	content: 'before';
	color: #FFF;
	font-size: 14px;
	text-align: center;
	z-index: 10;
}
.intro .compare .box.right p:before {
	content: 'after';
	z-index: 10;
}
.compare .box p img {
	width: 100%;
}
.intro .compare .box a {
	position: relative;
	display: block;
	border: 5px solid #e5e5e5;
	-webkit-transition: border-color .2s;
	   -moz-transition: border-color .2s;
	    -ms-transition: border-color .2s;
	     -o-transition: border-color .2s;
	        transition: border-color .2s;
}
.intro .compare.lw .box a {
	text-align: center;
}
.intro .compare.lw .box a img {
	width: 56.3%;
	width: auto;
	height: 193px;
	box-sizing: border-box;
	vertical-align: middle;
}
.single-case-image figure a:before,
.intro .compare .box a:before {
	position: absolute;
	right: 5px;
	bottom: 5px;
	width: 40px;
	height: 40px;
	background-color: rgba(0, 0, 0, .5);
	-webkit-border-radius: 3px;
	        border-radius: 3px;
	content: '';
}
.single-case-image figure a:after,
.intro .compare .box a:after {
	position: absolute;
	right: 5px;
	bottom: -7px;
	font-family: 'icomoon' !important;
	content: "\e90d";
	color: #FFF;
	font-size: 40px;
}

.single-case-image figure a:after,
.single-case-image figure a:before {
	bottom: 12px;
	right: 12px;
	z-index: 1;
}
.single-case-image figure a:after {
	bottom: 0px;
}
.intro .compare .box a:hover {
	border: 5px solid #333;
	text-decoration: none;
}
.flow {
	margin-top: 40px !important;
	font-size: 0;
	text-align: center;
}
.flow dl {
	position: relative;
	display: inline-block;
	width: 220px;
	height: 220px;
	padding-top: 10px;
	background: #FFF;
	border: 1px solid #ddd;
	-webkit-border-radius: 50%;
	        border-radius: 50%;
	vertical-align: top;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.flow dl + dl {
	margin-left: 60px;
}
.flow dl + dl:before {
	position: absolute;
	top: 50%;
	left: -45px;
	margin-top: -14px;
	border-right: 10px solid #333;
	border-bottom: 10px solid #333;
	border-top: 10px solid transparent;
	border-left: 10px solid transparent;
	content: '';
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}
.flow dl dt,
.flow dl dd {
	text-align: center;
}
.flow dl dt {
	width: 20px;
	margin: auto;
	border-bottom: 2px solid #3258A5;
	color: #3258A5;
	font-size: 28px;
	font-weight: bold;
}
.flow dl dd {
	margin-top: 14px;
	font-size: 20px;
	font-weight: bold;
	line-height: 1;
}
.flow dl dd span {
	font-size: 12px;
	font-weight: normal;
}
.flow dl dd .icon {
	display: inline-block;
	margin-top: -17px;
	font-size: 80px;
}
.flow dl:not(:first-child) dd .icon {
	margin-top: 24px;
}

div.pager {
	text-align: center;
}
.page-numbers {
	position: relative;
	color: #333;
	font-size: 14px;
	overflow: visible;
	display: inline-block;
	border: 1px solid #ddd;
	border-radius: 5px;
	width: 34px;
	height: 38px;
	line-height: 38px;
	transition: all 0.2s ease;
}
.page-numbers.next,
.page-numbers.prev {
	width: 108px;
	padding: 0 15px;
}
.page-numbers.next { text-align: left; }
.page-numbers.prev { text-align: right; }
.page-numbers.prev:after {
	position: absolute;
	content: "\e912";
	font-family: 'icomoon' !important;
	left: 5px;
	top: 0;
	color: #a64b95;
	font-size: 24px;
	transform: rotate(-180deg);
}
.page-numbers.next:after {
	position: absolute;
	content: "\e912";
	font-family: 'icomoon' !important;
	right: 5px;
	top: 1px;
	color: #a64b95;
	font-size: 24px;
}
a.page-numbers:hover {
	text-decoration: none;
	background-color: #f5f5f5;
}
.page-numbers.current {
	text-decoration: none;
	background-color: #666;
	color: #fff;
}

@media screen and (max-width: 737px) {
	#mainVisual {
		height: 180px;
	}
	.mainTitle {
		margin-top: 14px !important;
	}
	.mainTitle .icon {
		font-size: 60px;
	}
	.mainTitle h1 {
		margin-top: 10px;
		font-size: 30px;
	}
	#wrap h2.bg_title01 {
		background-position: center bottom;
		padding-bottom: 15px;
	}
	.mainDesc {
		margin: 30px 0 20px !important;
		font-size: 16px;
	}
	.staffVoice {
		margin-top: 20px !important;
		padding: 5px 10px 34px !important;
	}
	.staffVoice + .staffVoice dt {
		padding: 5px 0;
	}
	.staffVoice dl,
	.staffVoice dt,
	.staffVoice dd {
		display: block;
		width: 100%;
		text-align: left;
		padding: 0;
	}
	.staffVoice dt {
		border-right: none;
		border-bottom: 1px solid #98add9;
	}
	.staffVoice dt p {
		display: inline;
		font-size: 18px;
		vertical-align: middle;
	}
	.staffVoice .icon {
		font-size: 40px;
	}
	.staffVoice dd {
		margin-top: 10px;
	}
	.staffVoice dd p {
		font-size: 16px;
	}
	.compare {
		padding: 0 19px !important;
	}
	.compare:before,
	.intro .compare:before {
		margin-top: -20px;
		margin-left: -17px;
		border-right-width: 12px;
		border-bottom-width: 12px;
		border-top-width: 12px;
		border-left-width: 12px;
		-webkit-transform: rotate(45deg);
		   -moz-transform: rotate(45deg);
		    -ms-transform: rotate(45deg);
		     -o-transform: rotate(45deg);
		        transform: rotate(45deg);
	}
	.single-case-image.compare:before {
		margin-top: 0;
	}
	.compare + .compare {
		margin-top: 20px;
		padding-top: 20px !important;
		border-top: 1px solid #ddd;
	}
	.compare + .compare:before {
		margin-top: -10px;
	}
	.compare .box {
		width: 100%;
	}
	.compare .box + .box {
		margin-top: 35px;
	}
	.intro {
		padding: 10px 10px 20px !important;
	}
	.intro:first-of-type {
		margin-top: 20px;
	}
	.intro > .box,
	.intro > .box.right {
		width: 100%;
	}
	.intro dl {
		padding-right: 0;
	}
	.intro dt {
		font-size: 18px;
	}
	.intro dd {
		font-size: 16px;
	}
	.intro .compare {
		margin-top: 10px;
	}
	.flow {
		margin-top: 20px !important;
	}
	.flow dl {
		display: table;
		width: 100%;
		height: auto;
		padding: 8px 15px;
		-webkit-border-radius: 0;
		        border-radius: 0;
	}
	.flow dl + dl {
		margin-top: 36px;
		margin-left: 0;
	}
	.flow dl + dl:before {
		top: -25px;
		left: 50%;
		margin-left: -17px;
		border-right-width: 12px;
		border-bottom-width: 12px;
		border-top-width: 12px;
		border-left-width: 12px;
		-webkit-transform: rotate(45deg);
		   -moz-transform: rotate(45deg);
		    -ms-transform: rotate(45deg);
		     -o-transform: rotate(45deg);
		        transform: rotate(45deg);
	}
	.flow dl dt,
	.flow dl dd {
		display: table-cell;
		vertical-align: middle;
	}
	.flow dl dt {
		padding-right: 15px;
		border-bottom: none;
		border-right: 2px solid #3258A5;
	}
	.flow dl dd {
		padding-right: 50px;
		font-size: 18px;
	}
	.flow dl dd p {
		display: inline-block;
		vertical-align: middle;
	}
	.flow dl dd .icon {
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -30px;
		font-size: 60px;
		vertical-align: middle;
	}
	.flow dl:not(:first-child) dd .icon {
		margin-top: -30px;
	}
	.page-numbers.next,
	.page-numbers.prev {
		width: 36px;
		padding: 0;
	}
	#wrap .line-btn-box .line-btn-txt {
		font-size: 16px;
	}
}