@charset "utf-8";
/*
Theme Name: PureTrue Ladies
Theme URI: 
Description: fancree original wordpress theme
Version: 1.0
*/

#mainVisual {
	width: 100%;
	position: relative;
	padding-top: 120px;
	height: calc(100vh - 120px);
}
#mainVisual::after {
	content: "";
	background-image: url(./images/mv_bg.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top left;
	position: absolute;
	right: 0;
	width: 90%;
	height: 86vh;
	z-index: 10;
}
.mv_logo {
	position: absolute;
	top: 30px;
	left: 1.56%;
	z-index: 9999;
	width: 15%;
}
.mv_logo figure {
	width: 100%;
}
.mv_logo figure img {
	width: 100%;
}
#mainVisual h1 {
	font-size: 3vw;
	font-feature-settings: "palt";
	letter-spacing: 0.2em;
	font-weight: 400;
	position: absolute;
	color: #4D4D4D;
	left: 5%;
	z-index: 1000;
	top: 38vh;
}
#mainVisual h1 small {
	font-size: 2.5vw;
}
.mv_image {
	background-image: url(./images/mainvisual.jpg);
	width: 85.41%;
	position: absolute;
	right: 0;
	top: 120px;
	z-index: 100;
	height: calc(95vh - 120px);
}



/*        ABOUT        */
#campagin h2.sec_ttl {
	padding-bottom: 62px;
}
#about {
	padding-top: 180px;
	position: relative;
	padding-bottom: 360px;
	background-image: url(./images/about_bg.jpg);
	background-size: 75%;
	background-position: bottom 12% right;
}
#about p.about_txt {
	color: #707070;
	font-size: 16px;
	line-height: 2.4;
	letter-spacing: 0.2em;
	padding-top: 40px;
}
figure.about_img {
	width: 40%;
	position: absolute;
	right: 0;
	top: 180px;
}
figure.about_img img {
	width: 100%;
}
.about_wrap {
	position: relative;
}
figure.about_txt_img {
	width: 366px;
	position: absolute;
	bottom: -360px;
	right: 40%;
}
figure.about_txt_img img {
	width: 100%;
}

/*        POINT        */
#point {
	margin-top: 78px;
}
.point_wrap {
	padding-bottom: 120px;
}
.point_wrap figure {
	width: 530px;
}
.point_wrap figure img {
	width: 100%;
}
#point .point_txt {
	width: 45%;
}
#point .point_contents {
	justify-content: space-between;
}
#point .point_txt span {
	display: block;
	font-size: 38px;
	font-weight: bold;
	color: #4D4D4D;
	line-height: 1;
	padding: 46px 0 50px 0;
}
#point .point_txt p {
	font-size: 16px;
	color: #4D4D4D;
	letter-spacing: 0.2em;
	line-height: 2;
}


/*        CAMPAIGN       */
.campaign_inner figure {
	width: 100%;
	margin-bottom: 60px;
}
.campaign_inner figure img {
	width: 100%;
}
.campaign_inner figure img.campaign_sp {
	display: none;
}



/*        FLOW        */

.flow_banner {
	width: 100%;
	background-image: url(./images/flow_bg.jpg);
	padding: 75px 0;
	margin: 80px 0 0 0;
}
.flow_banner .container {
	background-color: #fff;
}
.flow_banner .banner_content {
	width: 920px;
	margin: 0 auto;
}
.flow_banner .banner_content svg {
	width: 230px;
}
.flow_banner .banner_content > div {
	color: #EC8785;
	width: 65.2%;
}
.flow_banner .banner_content h2 {
	color: #EC8785;
	font-size: 76px;
	letter-spacing: 0.14em;
}
.flow_banner .banner_content .banner_txt {
	justify-content: space-between;
}
.flow_banner .banner_content p {
	font-size: 26px;
	font-weight: bold;
	line-height: 1.3;
}
.flow_banner .banner_content a {
	width: 100%;
	display: block;
	border: 1px solid #EC8785;
	text-align: center;
	line-height: 1;
	padding: 16px 0;
	letter-spacing: 0.16em;
	color: #EC8785;
	font-size: 26px;
	box-sizing: border-box;
	transition: 0.3s all;
}
.flow_banner .banner_content a:hover {
	background-color: #ec8785;
	color: #fff;
}

/*        FAQ        */
#faq {
	margin-top: 78px;
}
dl.qa_line {
	border-left: 6px solid #EC8785;
	padding-left: 30px;
	background-color: #F8F8F8;
	padding-right: 90px;
}
dl.qa_line dt {
	padding: 40px 0;
	font-size: 22px;
	color: #4D4D4D;
	font-weight: bold;
	position: relative;
}
dl.qa_line dt::after {
	content: "";
	background-image:url(./images/down.svg);
	background-size: contain;
	width: 30px;
	height: 30px;
	display: block;
	position: absolute;
	right: 0;
	transition: 0.3s all;
}
dl.qa_line dt.open::after {
	content: "";
	background-image:url(./images/down.svg);
	background-size: contain;
	transform: rotate(180deg);
	width: 30px;
	height: 30px;
	display: block;
	position: absolute;
	right: 0;
}
dl.qa_line dd {
	font-size: 16px;
	padding: 10px 0 40px 0;
	display: none;
	position: relative;
	line-height: 2;
	color: #4D4D4D;
}
dl.qa_line dt,
dl.qa_line dd div {
	justify-content: flex-start;
}
dl.qa_line dd div {
	align-items: flex-start;
}
dl.qa_line dt span,
dl.qa_line dd span {
	font-family: 'jost';
	font-size: 40px;
	line-height: 1;
	display: block;
	width: 34px;
	padding-right: 50px;
}
dl.qa_line dd p {
	width: calc(100% - 84px);
}

/*        ACCESS        */
#access {
	margin-top: 83px;
	padding-bottom: 120px;
}
#access h2 {
	padding-bottom: 120px;
}
.access_content {
	justify-content: space-between;
}
.access_content figure {
	width: 51.7%;
}
.access_content figure img {
	width: 100%;
}
.access_content div {
	color: #4D4D4D;
}
.access_content .access_txt > figure {
	width: 319px;
	margin-bottom: 45px;
}
.access_content div figure img {
	width: 100%;
}
.access_content div h4 {
	font-size: 22px;
	color: #4D4D4D;
	line-height: 1;
	padding-bottom: 20px;
}
.access_content div p {
	font-size: 18px;
	line-height: 2;
	letter-spacing: 0.1em;
}
.access_content div a.tel {
	font-size: 40px;
	color: #EC8785;
	letter-spacing: 0.1em;
	margin-top: 14px;
	line-height: 1;
	margin-top: 24px;
	margin-bottom: 40px;
	display: block;
}
.access_content div a.commonBtn {
	width: 350px;
	padding: 11px 0;
	margin: 0;
}

.access_content div a.commonBtn div {
	justify-content: flex-start;
	transition: 0.3s all;
}
.access_content div a.commonBtn:hover div {
	color: #fff;
}

.access_content div a.commonBtn svg {
	width: 22px;
	margin: 0 20px 0 25px;
}
.access_content div a.commonBtn svg path {
	fill: #4d4d4d;
	transition: 0.3s all;
}
.access_content div a.commonBtn:hover svg path {
	fill: #fff;
}
.access_content div a.commonBtn figure img {
	width: 100%;
}
.access_content div a.commonBtn p {
	letter-spacing: 0.25em;
}
.access_map {
	margin-top: 120px;
}
.access_map iframe {
	width: 100%;
}
h1 svg.pc {
	display: block;
}
h1 svg.sp {
	display: none;
}
svg.svg_sp {
	display: none;
}
.map_sp {
	display: none;
}
@media screen and (max-width: 767px) {
	.mv_logo {
		width: 100px;
		top: 25px;
		left: 25px;
		opacity: 1;
		transition: 0.8s cubic-bezier(.19, 1, .22, 1);
		-webkit-transition: 0.8s cubic-bezier(.19, 1, .22, 1);
		-moz-transition: 0.8s cubic-bezier(.19, 1, .22, 1);
		-o-transition: 0.8s cubic-bezier(.19, 1, .22, 1);
	}
	.open .mv_logo {
		opacity: 0;
	}
	h1 svg.pc {
		display: none;
	}
	h1 svg.sp {
		display: block;
	}
	.mv_image {
		top: 70px;
		width: 88%;
		height: 92vh;
	}
	#mainVisual h1 {
		top: 22vh;
	}
	#mainVisual p {
		padding-left: 15px;
		padding-top: 20px;
	}
	#mainVisual p img {
		width: 185px;
	}
	#mainVisual::after {
		background-position: bottom center;
		width: 100%;
		height: 91vh;
		background-image: url(./images/mv_bg_sp.png);
	}
	#about {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		padding-top: 60px;
		background-size: cover;
		background-position: left bottom;
		padding-bottom: 127px;
		background-image: url(./images/about_bg_sp.png);
	}
	figure.about_img {
		order: 1;
		width: 93.33333%;
		position: relative;
		top: 0;
		margin-left: auto;
		padding-bottom: 60px;
	}
	figure.about_img img {
		width: 100%;
	}
	.about_wrap {
		order: 2;
	}
	h2.sec_ttl_sm {
		font-size: 16px;
		letter-spacing: 0.15em;
	}
	h2.sec_ttl_sm span {
		font-size: 22px;
		padding-top: 14px;
	}
	figure.about_txt_img {
		bottom: -209px;
		width: 78.133333%;
		right: auto;
		left: -6.3334%;
	}
	.point_wrap figure.num_01 {
		order: 1;
	}
	.point_wrap .num_02 {
		order: 2;
	}
	#point .point_contents {
		flex-wrap: wrap;
	}
	.point_wrap figure {
		width: 100%;
	}
	.point_wrap figure.point_img_left {
		margin-left: -8%;
		width: 110%;
	}
	.point_wrap figure.point_img_right {
		margin-right: -8%;
		width: 110%;
	}
	#point .point_txt {
		width: 100%;
		margin-top: -10px;
	}
	#point .point_txt span {
		font-size: 22px;
		padding: 20px 0 30px 0;
	}
	#point .point_txt p {
		font-size: 14px;
	}
	.point_wrap {
		padding-bottom: 60px;
	}
	.flow_banner {
		margin: 20px 0 0 0;
		padding: 40px 0;
	}
	.flow_banner .banner_content svg.svg_sp {
		display: block;
		width: 116px;
		height: 100px;
		padding-right: 8px;
	}
	svg.svg_sp img {
		width: 100%;
	}
	svg.svg_pc {
		display: none;
	}
	.flow_banner .banner_content {
		width: 100%;
		padding: 15px 0 20px 0;
	}
	.flow_banner .banner_content h2 {
		display: flex;
		justify-content: center;
		font-size: 45px;
		align-items: center;
		width: 100%;
	}
	.flow_banner .banner_content > div {
		width: 100%;
	}
	.flow_banner .banner_content .banner_txt {
		flex-wrap: wrap;
		justify-content: center;
	}
	.flow_banner .banner_content p {
		text-align: center;
		font-size: 22px;
		padding: 10px 0 25px 0;
	}
	.flow_banner .banner_content a {
		width: 76%;
		margin: 0 auto;
	}
	#faq {
		margin-top: 0;
	}
	dl.qa_line dt span, dl.qa_line dd span {
		font-size: 30px;
		padding-right: 20px;
	}
	dl.qa_line dt {
		font-size: 14px;
		width: 100%;
		padding: 20px 40px 20px 0;
		box-sizing: border-box;
	}
	dl.qa_line dd {
		padding: 10px 0 20px 0;
	}
	dl.qa_line {
		padding-right: 15px;
	}
	dl.qa_line dd p {
		font-size: 14px;
		width: calc(100% - 65px);
	}
	dl.qa_line dd div {

	}
	#blog {
		margin-top: 0;
	}
	.blog_wrap {
		margin-top: -110px;
		padding-top: 110px;
		padding-bottom: 40px;
	}
	.blog_wrap .container > ul {
		flex-wrap: wrap;
	}
	.blog_wrap .container > ul > li {
		width: 100%;
		margin-bottom: 45px;
	}
	.blog_wrap .container > ul li h2 {
		font-size: 16px;
	}
	.blog_wrap .container > ul li div {
		padding-top: 20px;
	}
	a.blogBtn {
		width: 86.6666%;
	}
	#access {
		margin-top: 0;
		padding-top: 90px;
		padding-bottom: 0;
	}
	#access h2 {
		padding-bottom: 60px;
	}
	.access_content figure {
		width: 100%;
	}
	.access_content {
		flex-wrap: wrap;
	}
	.access_content figure.num_01 {
		order:1;
		margin-bottom: 30px;
	}
	.access_content div {
		order: 2;
	}
	.access_content div figure img {
		width: 226px;
	}
	.access_content div h4 {
		font-size: 16px;
	}
	.access_content .access_txt > figure {
		width: 100%;
		margin-bottom: 30px;
	}
	.access_content div p {
		font-size: 14px;
		letter-spacing: 0;
	}
	.access_content div a.tel {
		font-size: 26px;
	}
	.access_content div a.commonBtn {
		width: 100%;
		margin: 0 auto;
	}
	.access_map {
		margin-top: 80px;
		display: none;
	}
	.map_sp {
		width: 100%;
		display: block;
	}
	.campaign_inner figure img.campaign_sp {
		display: block;
	}
	.campaign_inner figure img.campaign_pc {
		display: none;
	}
}



