@charset "utf-8";

/*
Theme Name: css
Template: laser
*/

* {
	margin: 0;
	padding: 0;
	text-decoration: none;
	box-sizing: border-box;
}

html{
	/*デフォルトのフォントサイズ16pxの0.625をかけて10にした値。そのため、1rem=10pxとなる。
	*/
	font-size: 62.5%;
}

a{
	color: #474747;
}

body{
font-family: 'Noto Sans JP', sans-serif;
font-weight: 500;
color: #474747;
/*基本的にフォントサイズ16px*/
font-size: 1.6rem;
background: #fcfcfc;
}

p{
	line-height: 1.5;
}

#none{
	display: none;
}

.slash{
	padding: 0 0.6rem;
}

.common_hd{
	text-align: center;
}

.common_hd .ja{
	font-size: 4rem;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
}

.common_hd .en{
	font-size: 1.8rem;
	color: #f986dc;
	letter-spacing: 0.05em;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	display: block;
	padding-bottom: .5rem;
}

.common_btn{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40rem;
	height: 10rem;
	font-size: 1.8rem;
	border: 1px solid #474747;
	border-radius: 50px;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

.common_btn:hover{
	background: #f986dc;
	border: 1px solid #f986dc;
	color: #fcfcfc;
}

.breadcrumb_block{
	position: absolute;
	top: 38rem;
	left: 9.6rem;
}

.breadcrumb_block .gt{
	padding: 0 .5rem;
}

header{
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
	background: #fcfcfc;
	padding: 2.5rem 0 2rem;
}

header .header_area{
	margin: 0 auto;
	width: 90%;
}

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

header .logo img{
	max-width: 14rem;
}

header nav ul{
	display: flex;
}

header .menu-item{
	position: relative;
}

header .menu-item::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: .1rem;
	height: 5rem;
	background: #474747;
}

header #menu-item-38{
	position: relative;
}

header #menu-item-38 a::after{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: .1rem;
	height: 5rem;
	background: #474747;
}

header #menu-item-40::before{
	display: none;
}

header #menu-item-38::after,
header #menu-item-39::after,
header #menu-item-40::after,
header #menu-item-41::after,
header #menu-item-42::after{
	content: '';
	display: block;
	font-size: 1.2rem;
	font-family: 'Lato', sans-serif;
	letter-spacing: 0.05em;
	padding-bottom: .5rem;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
	position: absolute;
	top: .6rem;
	right: 0;
	left: 0;
	text-align: center;
}

header #menu-item-42::after{
	content: 'Case';
}
header #menu-item-39::after{
	content: 'Custom-made';
}
header #menu-item-41::after{
	content: 'Blog';
}
header #menu-item-38::after{
	content: 'FAQ';
}
header #menu-item-40::after{
	content: '';
}

header .menu-item a{
	display: block;
	padding: 2.5rem 3rem .8rem;
	text-align: center;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
	position: relative;
	z-index: 2;
}

header .menu-item a:hover,
header #menu-item-38:hover::after,
header #menu-item-39:hover::after,
header #menu-item-40:hover::after,
header #menu-item-41:hover::after,
header #menu-item-42:hover::after{
	color: #f986dc;
}

header #menu-item-40 a{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 25rem;
	height: 6rem;
	padding: 0;
	background: #f986dc;
	color: #fcfcfc;
	border-radius: 30px;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
	margin-left: 6rem;
	margin-top: -.8rem;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

header .contact_btn .slash{
	padding: 0 .8rem;
}

header .contact_btn:hover{
	opacity: .6;
}

footer .logo{
	padding-right: 12rem;
}

footer .logo img{
	max-width: 14rem;
}

footer .tel{
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 7.2rem;
	padding-right: 12rem;
	letter-spacing: 0.05em;
}

footer .common_btn{
	background: #f986dc;
	border: 1px solid #f986dc;
	color: #fcfcfc;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

footer .common_btn:hover{
	opacity: .6;
}

footer .footer_top{
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 8rem;
}

footer .footer_bottom{
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 4rem;
}

footer .footer_bottom ul{
	display: flex;
	justify-content: center;
	align-items: center;
}

footer .footer_bottom li{
	padding-right: 5rem;
	letter-spacing: 0.05em;
}

footer .footer_bottom li:nth-last-of-type(1){
	padding-right: 0;
}

footer .footer_bottom li a{
	letter-spacing: 0.05em;
}

footer .footer_bottom li a:hover{
	text-decoration: underline;
}

footer small{
	display: block;
	text-align: center;
}

.subpage_top{
	width: 100%;
	height: 30rem;
	background: #f1f1f1;
	margin: 12rem 0;
	padding-top: 8rem;
}

.subpage_top .common_hd .en{
	font-size: 2.4rem;
	padding-bottom: 1.5rem;
}

.subpage_top .common_hd .ja{
	font-size: 6rem;
}

#top .firstview_wrapper{
	position: relative;
}

#top .firstview_wrapper .firstview_area{
	width: 90%;
	height: 50rem;
	margin: 12rem auto 0;
}

#top .firstview_wrapper .firstview_area video{
	/*
	background-image: url('../images/mainvisual_1.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;*/
	width: 100%;
	height: 100%;
	border-radius: 100px 0 100px 0;
}

#top .firstview_wrapper .text_block{
	position: absolute;
	top: 16rem;
	left: 8%;
	z-index: 1;
}

#top .firstview_wrapper .text_block h1{
	font-size: 4rem;
	line-height: 1.5;
	color: #fcfcfc;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	padding-bottom: 1rem;
}

#top .firstview_wrapper .text_block p{
	font-size: 1.6rem;
	line-height: 1.875;
	color: #fcfcfc;
}

#top .firstview_wrapper .right_text{
	position: absolute;
	top: 33rem;
	right: 0;
	transform: rotate(90deg);
	letter-spacing: 0.05em;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 1.6rem;
}

#top .firstview_wrapper .right_text span{
	position: relative;
}

#top .scroll_block{
	position: absolute;
	top: 23.5rem;
	right: 4.5rem;
}

#top .scroll_block span{
	position: relative;
	display: block;
	width: .1rem;
	height: 5rem;
	overflow-y: hidden;
}

#top .scroll_block span::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: .1rem;
	height: 10rem;
	background: #474747;
	animation: border_anime 1s ease-in infinite;
}

@keyframes border_anime{
	0%{
		transform: translateY(-10rem);
	}
	100%{
		transform: translateY(10rem);
	}
}

#top .blog_wrapper .common_hd{
	padding-bottom: 8rem;
}

#top .blog_wrapper .blog_area{
	width: 90%;
	margin: 0 auto;
	padding: 12rem 0;
}

#top .blog_wrapper .blog_inner{
	display: flex;
	justify-content: space-between;
	margin-bottom: 6rem;
	position: relative;
}

#top .blog_wrapper .blog_block{
	display: block;
	width: 30rem;
	position: relative;
}

#top .blog_wrapper .blog_inner::after{
	content: '';
	display: block;
	width: 30rem;
}

#top .blog_wrapper .blog_block .img{
	padding-bottom: .5rem;
	width: 100%;
	height: 20rem;
	overflow: hidden;
	border-radius: 50px;
}

#top .blog_wrapper .blog_block img{
	max-width: 300px;
	border-radius: 50px;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

#top .blog_wrapper .blog_block:hover img{
	transform: scale(1.2);
}

#top .blog_wrapper .blog_block h3{
	font-size: 3rem;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	line-height: 1.2;
}

#top .blog_wrapper .blog_block .date{
	font-size: 1.4rem;
	font-family: mamelon, sans-serif;
	font-weight: 300;
	font-style: normal;
	padding-bottom: .5rem;
}

#top .blog_wrapper .common_btn{
	margin: 0 auto;
}

#top .service_wrapper .service_area{
	padding-bottom: 12rem;
}

#top .service_wrapper .service_inner{
	display: flex;
	justify-content: center;
}

#top .service_wrapper .common_hd{
	padding-bottom: 4rem;
}

#top .service_wrapper .service_block{
	width: 60rem;
	height: 40rem;
	background: #faeff7;
	border-radius: 50px;
	padding-top: 6rem;
}

#top .service_wrapper .service_block:nth-of-type(1){
	margin-right: 8rem;
}

#top .service_wrapper .service_block .common_hd{
	padding-bottom: 3.5rem;
}

#top .service_wrapper .service_block p{
	line-height: 1.875;
	text-align: center;
	padding-bottom: 3.5rem;
}

#top .service_wrapper .service_block .common_btn{
	margin: 0 auto;
	width: 30rem;
	height: 6rem;
}

#top .case_wrapper{
	position: relative;
}

#top .case_wrapper .case_area{
	width: 90%;
	margin: 0 auto;
 	padding-bottom: 20rem;
}

#top .case_wrapper .case_inner,
#case .case_wrapper .case_inner{
	display: flex;
	justify-content: space-between;
	padding-bottom: 6rem;
}

#case .case_wrapper .case_inner{
	padding-bottom: 24rem;
	flex-wrap: wrap;
}

#top .case_wrapper .common_hd{
	padding-bottom: 4rem;
}

#top .case_wrapper .case_block,
#case .case_wrapper .case_block{
	width: 50rem;
}

#top .case_wrapper::before{
	content: '';
	display: block;
	width: 100%;
	height: 76.4rem;
	background: #faeff7;
	position: absolute;
	top: 4.4rem;
	left:0;
	z-index: -1;
}

#top .case_wrapper .hd,
#case .case_wrapper .hd{
	font-size: 3.6rem;
	font-family: mamelon, sans-serif;
	font-weight: 300;
	letter-spacing: 0.05em;
}

#top .case_wrapper .img,
#case .case_wrapper .img{
	width: 100%;
	border-radius: 50px;
	overflow: hidden;
	margin-bottom: 1rem;
}

#top .case_wrapper .case_block:hover img,
#case .case_wrapper .case_block:hover img{
	transform: scale(1.2);
}

#top .case_wrapper .case_block img,
#case .case_wrapper .case_block img{
	max-width: 50rem;
	border-radius: 50px;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

#top .case_wrapper .sub,
#case .case_wrapper .sub{
	font-size: 1.6rem;
	font-family: mamelon, sans-serif;
	font-weight: 300;
	letter-spacing: 0.05em;
	padding-bottom: 2rem;
}

#top .case_wrapper .sub span:nth-of-type(1),
#case .case_wrapper .sub span:nth-of-type(1){
	padding-right: 3rem;
}

#top .case_wrapper .common_btn{
	margin: 0 auto;
}

#case .case_wrapper .case_area{
	margin: 0 auto;
	width: 90%;
}

#order .order_area{
	width: 90%;
	margin: 0 auto 24rem;
}

#order .order_inner{
	display: flex;
}

#order .text_block{
	padding-right: 16rem;
}

#order .text_block_inner{
	padding-bottom: 6rem;
}

#order .text_block_inner h2{
	font-family: mamelon, sans-serif;
	font-size: 4.8rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	padding-bottom: 3rem;
}

#order .order_flow_block{
	padding-right: 8rem;
}

#order .order_flow_block h3{
	font-family: mamelon, sans-serif;
	font-size: 3.6rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	padding-bottom: 2rem;
}

#order .order_flow_block li{
	display: flex;
	align-items: center;
	margin-bottom: 3.5rem;
}

#order .order_flow_block li:nth-last-of-type(1){
	margin-bottom: 0;
}

#order .number{
	font-family: mamelon, sans-serif;
	font-size: 3.6rem;
	font-weight: 500;
	color: #f986dc;
	padding-right: 1.5rem;
}

#order .img_block p{
	position: relative;
}

#order .img_block p::before{
	content: '';
	position: absolute;
	top: 3rem;
	left: 3rem;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: #faeff7;
	border-radius: 30px;
}

#order .img_block img{
	max-width: 50rem;
	border-radius: 30px;
}

#blog .blog_wrapper .blog_area{
	width: 90%;
	margin: 0 auto 16rem;
}

#blog .blog_wrapper .blog_inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	position: relative;
}

#blog .blog_wrapper .blog_inner::before{
	content: '';
	display: block;
	width: 30rem;
}

#blog .blog_wrapper .blog_inner::before{
	order: 1;
}

#blog .blog_wrapper .blog_block{
	justify-content: center;
	margin-bottom: 8rem;
}

#blog .blog_wrapper .blog_block a{
	display: block;
	width: 30rem;
}

#blog .blog_wrapper .img{
	width: 30rem;
	height: 20rem;
	overflow: hidden;
	border-radius: 50px;
	margin-bottom: .5rem;
}

#blog .blog_wrapper img{
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

#blog .blog_wrapper .blog_block a:hover img{
	transform: scale(1.2);
}

#blog .blog_wrapper .blog_block h3{
	font-family: mamelon, sans-serif;
	font-size: 3rem;
	font-weight: 500;
}

#blog .blog_wrapper .blog_block .date{
	font-family: mamelon, sans-serif;
	font-size: 1.4rem;
	font-weight: 300;
	margin-bottom: .5rem;
}

#faq .faq_wrapper .faq_area{
	width: 90%;
	margin: 0 auto 24rem;
}

#faq .faq_wrapper .faq_block{
	margin-bottom: 6rem;
}

#faq .faq_wrapper .faq_block:nth-last-of-type(1){
	margin-bottom: 0;
}

#faq .faq_wrapper dl{
	display: flex;
	align-items: center;
}

#faq .faq_wrapper .ask{
	padding-bottom: 1.5rem;
}

#faq .faq_wrapper .ask dt,
#faq .faq_wrapper .answer dt{
	letter-spacing: 0.05em;
	font-size: 2.4rem;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
}

#faq .faq_wrapper .answer{
	color: #f986dc;
}

#article .article_wrapper{
	position: relative;
}

#article .article_wrapper .article_area{
	width: 90rem;
	margin: 24rem auto;
}

#article .article_wrapper .article_inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#article .breadcrumb_block{
	top: 16rem;
}

#article .article_wrapper h1{
	font-size: 3.6rem;
	line-height: 1.333;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	letter-spacing: 0.05em;
	padding-bottom: 3rem;
	text-align: center;
}

.archive_block{
	position: absolute;
	top: 0;
	right: 9.6rem;
}

.archive_block h2{
	font-size: 2.4rem;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	letter-spacing: 0.05em;
	padding-bottom: 2rem;
}

.archive_block li:nth-of-type(1){
	border-top: .1rem solid #ccc;
}

.archive_block li{
	width: 100%;
	height: 5.4rem;
	padding-left: .5rem;
	border-bottom: .1rem solid #ccc;
}

.archive_block li a{
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

.archive_block li a:hover{
	opacity: .6;
}

#article .article{
	display: block;
	width: 100%;
	height: 6rem;
	border-bottom: .1rem solid #ccc;
	padding-left: .5rem;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
}

#article .article:nth-of-type(1){
		border-top: .1rem solid #ccc;
}

#article .article:hover{
	opacity: .4;
}

#article .article dl{
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
}

#article .article dt{
	width: 17rem;
}

#article .postLinks{
	display: flex;
	justify-content: space-between;
	margin-top: 12rem;
}

#c_detail .breadcrumb_block{
	top: 48rem;
	color: #fcfcfc;
}

#c_detail .breadcrumb_block span{
	color: #fcfcfc;
}

#c_detail .breadcrumb_block .fa, .fas{
    padding: 0 1rem;
}

#c_detail .c_detail_wrapper{
	position: relative;
}

#c_detail .c_detail_top{
	width: 100%;
	height: 40rem;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin: 12rem 0;
	padding-top: 14rem;
}

#c_detail .common_hd .c_name{
	font-size: 2.4rem;
	font-family: mamelon, sans-serif;
	font-weight: 300;
	font-style: normal;
	color: #fcfcfc;
	letter-spacing: 0.05em;
	display: block;
	padding-bottom: .5rem;
}

#c_detail .common_hd .item_name{
	font-size: 4.8rem;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	color: #fcfcfc;
	letter-spacing: 0.05em;
}

#c_detail .c_detail_wrapper .c_detail_area{
	width: 90rem;
	margin: 0 auto 24rem;
}

#c_detail .c_detail_wrapper h2{
	font-size: 3.6rem;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
	line-height: 1.333;
	padding-bottom: 2rem;
}

#contact .contact_wrapper .contact_area{
	width: 103.4rem;
	margin: 0 auto 24rem;
}

#contact .contact_wrapper .form_block{
	margin-bottom: 6rem;
}

#contact .contact_wrapper .form_block_inner{
	display: flex;
	align-items: center;
}

#contact .contact_wrapper .lead{
	text-align: center;
	padding-bottom: 8rem;
}

#contact .contact_wrapper form h2{
	font-size: 2.4rem;
	width: 25rem;
	text-align: right;
	margin-right: 3rem;
}

#contact .contact_wrapper .input_text{
	outline: none;
	border: none;
	display: block;
	width: 80rem;
	height: 8rem;
	background: #f1f1f1;
	border-radius: 40px;
	padding: .5rem .5rem .5rem 3rem;
}

#contact .contact_wrapper .text_block .form_block_inner{
	align-items: flex-start;
}

#contact .contact_wrapper textarea{
	outline: none;
	border: none;
	width: 80rem;
	height: 30rem;
	background: #f1f1f1;
	border-radius: 40px;
	padding: 1rem 1rem 1rem 3rem;
}

#contact .contact_wrapper .btn_block{
	display: flex;
}

#contact .contact_wrapper .submit_btn{
	outline: none;
	border: none;
	box-shadow: none;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30rem;
	height: 8rem;
	border-radius: 40px;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
	color: #fcfcfc;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
	background: #f986dc;
	margin-left: 27rem;
	margin-right: 4rem;
	font-size: 1.6rem;
	cursor: pointer;
}

#contact .contact_wrapper .black_btn{
	outline: none;
	border: none;
	box-shadow: none;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30rem;
	height: 8rem;
	border-radius: 40px;
	transition: .6s cubic-bezier(0, 0.55, 0.45, 1);
	color: #fcfcfc;
	font-family: mamelon, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.05em;
	background-color: #474747;
	margin-left: 4rem;
	font-size: 1.6rem;
	cursor: pointer;
}
