@charset "utf-8";
@import url(colorbox.css);
@import url(animsition.min.css);
@import url(animate.min.css);
@import url(swiper.min.css);
@import url(common.css);

/*------------------------
  ブログ 一時非表示
--------------------------*/
.nav4,
.sp-nav li:has(a[href="/blog/"]) { display: none !important; }

/*------------------------
  Top
--------------------------*/
.bgslideshow {
  position: fixed;
  left:288px;
  width:82%;
  top:0;
  z-index: 1;
  height: 100%;
}
.bgslideshow img{height:100%; max-height:1064px; max-width:1600px;}
.bgslideshow:target{left:-18%;}

#about .content{position:absolute; top:220px;}
#about h2{
	letter-spacing:0.2em;
	margin-top:90px;
	font-size:16px;
	font-weight:normal;
}
#about p{letter-spacing:0.2em}
.Article p{letter-spacing:0.4em}
#about .content p{line-height:24px; font-size:14px;}
#pfs{margin-top:35px}
#pfs p{display:block; font-feature-settings:"palt"; letter-spacing:5px}
#results .content{letter-spacing:.3em;}
#results .content h2{font-weight:normal; margin:40px 0 30px; font-size:12px;}
#results .content ul{ margin-bottom:70px;}
#results .content li{margin-bottom:6px; font-size:12px;}

#blog{ overflow:hidden; padding-left:12px}
.listof{float:left; width:60%;}
.listof p.archive-title{
	padding:5px;
	background:#222;
	color:#fff;
	width:350px;
	text-align:center;
	margin-bottom:20px;
}
.listof p.archive-title a{ color:#FFF}
.archive{
	float:right;
	width:33%;
	font-size:15px;
	letter-spacing:0.3em;
}
.archive ul{margin-bottom:40px}
.archive li{height:50px; line-height:50px;}
@media screen and (max-width: 980px) {
	.bgslideshow img{margin-left:-4%;}
	#about .content{left:0px;}
}
@media screen and (max-width: 768px) {
	.bgslideshow{position:static; width:100%;}
	.bgslideshow img{width:100%; height:auto; margin-left:auto;	}
	#about .content{position:static;}
	#about h2,.subname{padding-left:25px;}
	#about h2{margin-top: 60px;}
	#pfs{padding:25px;	margin-top:30px; text-align:left; box-sizing:border-box;}
	#results .content{letter-spacing:inherit}
	#results .content h2{ text-align:center}
	#results .content ul{margin:40px 3%;}
.content .archive p{
width: 97%;
background-color:#333;
color: #fff;
padding:10px;
box-sizing:border-box;
border-bottom: solid 1px #ccc;
}
.archive,.listof{float:none; width: 100%;}
.archive{padding:0 0 18px;}
.archive ul{width:97%; box-sizing:border-box; margin-bottom:0;}
.archive li{border-bottom: solid 1px #ccc;}
.archive li a{display:inline-block}
}

/*------------------------
  Contact
--------------------------*/
#contact ul{margin-top:50px}
#contact li strong{display:inline-block; vertical-align:top; font-weight:normal; width:250px;}
#contact li span{display:inline-block; vertical-align:top;  min-width:300px;}
#contact li{margin-bottom:15px;}
#contact li p{display:block; margin-top:30px;}
.selectWrap{display: inline}
.selectWrap span{position: relative; display: inline-block; margin-left: -11px;}
.selectWrap span::after {content:''; width:6px;
  height:6px;
  border: 0px;
  border-bottom: solid 2px #b4b3b3;
  border-right: solid 2px #b4b3b3;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -4px;
}
.selectWrap span select {-webkit-appearance:none;  -moz-appearance:none; appearance:none; width:100%; height:50px; background:transparent; position:relative; padding:0 10px; border:solid 1px #9a9a9a; border-radius:5px; z-index:1;}
select::-ms-expand {display: none;}

.contact-form{ overflow:hidden; padding-left:12px;}
.contact-form ul{margin-top:50px;}
.contact-form li{
	width:600px;
	display:block;
	font-size:16px;
	overflow:hidden;
	margin-bottom:42px;
	letter-spacing:0.4em;
	line-height:39px;
}
.contact-form li input[type="text"],
.contact-form li input[type="email"],
.contact-form li input[type="tel"],
.contact-form li textarea{border:1px solid #9a9a9a; width:300px;}
.contact-form li input[type="text"],
.contact-form li input[type="email"],
.contact-form li input[type="tel"]{height:39px;}
.contact-form li textarea{padding:5px; width:100%; box-sizing:border-box;}
.contact-form li input[type="submit"]{
	background-color:#000;
	color:#fff;
	text-align:center;
	width:60px;
	display:block;
	border:none;
	height:40px;
	margin:0 auto;
	cursor:pointer;
}
.contact-form .not-valid-tip{
	display:block;
	letter-spacing:0.1em;
	color:#990033;
	font-size:14px;
}
.contact-text{color:#444; margin:40px 0 0;}
.contact-success{color:#0055aa; margin:20px 0; padding:10px; background:#e8f4ff; border:1px solid #c9deec;}
.contact-error{color:#990033; margin:20px 0; padding:10px; background:#ffeaea; border:1px solid #ffcccc;}
@media screen and (max-width: 980px) {
	#contact li strong{ display:block;}
	.contact-form li{ width:100%;}
}
@media screen and (max-width: 768px) {
	.selectWrap span{margin-left:0}
	.contact-form li input[type="text"],
	.contact-form li input[type="email"],
	.contact-form li input[type="tel"]{width:96%; box-sizing:border-box;}
	.contact-text{padding:3vw; box-sizing:border-box;}
}

/*------------------------
	　Blog
--------------------------*/
.Article{margin:0 0 90px 0}
.Article h3{
	font-weight:bold;
	font-size:17px;
	letter-spacing:0.5em;
	margin-bottom:15px;
}
.Article h3 span{
	font-size:13px;
	font-weight:normal;
	letter-spacing:0.1em;
}
.Article .detail p{
	font-size:15px;
	line-height:2.5em;
}
.Article p.date{
	letter-spacing:0.3em;
}

/*------------------------
	　Photo
--------------------------*/
.PhotoImage li{
	height:110px;
	margin:20px 1.1%;
	vertical-align:middle;
	display:inline-block;
	box-sizing:border-box;
}
.PhotoImage li img{
	width:auto;
	height:100%;
}
@media screen and (max-width: 980px) {
.PhotoImage li{width:14%;}
}
@media screen and (max-width: 768px) {
.PhotoImage li{
	width: 30%;
	margin: 12px 1.10%;
}
.PhotoImage li img{width:100%; height:auto;}
}

/*------------------------
	　studio
--------------------------*/
.swiper-container{margin:0 0 30px}
.swiper-slide img{width:100%;}
.studio_ul{margin:0 0 45px; display:block;}
.studio_ul li{margin:0 0 15px; font-feature-settings:"palt";}
.studio_ul li span{display:inline-block; min-width:175px; letter-spacing:5px;}
.studio_ul li img{width:35px; display: inline-block; vertical-align: middle;}
.studio_content a{color:#6EA6DE; text-decoration:underline}
.Gmap {
position: relative;
padding-bottom: 34.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
margin:0 0 15px;
}
.Gmap iframe,.Gmap object,.Gmap embed {position:absolute; top:0; left:0; width:100%; height:100%;}

@media screen and (max-width: 980px) {
.Gmap {padding-bottom:44.25%;}
}
@media screen and (max-width: 768px) {
.studio_content{width:92%; margin:0 auto}
.studio_ul li span{min-width:20vw; letter-spacing:normal; padding-right:1rem;}
.Gmap {padding-bottom:54.25%;}
}
@media screen and (max-width: 360px) {
.studio_ul li{font-size:.9rem;}
}
/*------------------------
	　plan
--------------------------*/
#plan h3{
	margin-bottom:15px;
	font-size:1.4rem;
	font-weight:normal;
	border:solid 1px #888;
	display:inline-block;
	padding:4px 10px;
	color:#888;
}
.plan{
	background:url(/img/plan/line.jpg) center top repeat-x;
	background-size:100%;
	padding:30px 0 20px;
	max-width:750px;
}
.plan h4{
	padding-left:80px;
	background:url(/img/plan/m_a.jpg) 16px center no-repeat;
	background-size:40px;
}
.plan h4 strong,.plan h5 strong{font-size:1.6rem;}
.plan h5{margin-bottom:18px;}
.plandetail{padding-left:80px;}
.plandetail ul{margin-left:0; padding-left:20px}
.plandetail ul li{margin-bottom:5px; list-style-type:disc}
.plandetail p{display:block; line-height:1.65rem;}
.planimg{margin:15px 0;}
.planimg img{border:solid 1px #999;}
.plandetail ol li{margin-bottom:18px;}
.plandetail ol li span{font-size:1.5rem; padding-right:10px;}
.plandetail ol li p{margin-left:35px;}
.plan_b h4{background:url(/img/plan/m_b.jpg) 16px center no-repeat;background-size:40px;}
.plan_c h4{background:url(/img/plan/m_c.jpg) 16px center no-repeat;background-size:40px;}
.businessImage{width:600px; margin:15px 0;}
.businessImage ul{overflow:hidden; padding-left:0px;}
.businessImage ul li{list-style:none; width:300px; float:left; margin-bottom:0; border:solid 1px #999; box-sizing:border-box}
.businessImage ul li img{width:100%; height:auto; display:block; vertical-align: bottom;}
.businessImage ul li:nth-child(even){margin-left:-1px}
.businessImage ul li:last-child,.businessImage ul li:nth-last-child(2){margin-top:-1px;}

@media screen and (max-width: 980px) {
.plandetail {padding-left:0px;}
.planimg img{width:99%; height:auto;}
.businessImage {width:60vw;}
.businessImage ul li {width:calc(90vw / 4);}
}
@media screen and (max-width: 768px) {
#plan h3{display:block; width:80%; margin:0 auto; text-align:center; border:none;}
.plan h4{padding-left:0; padding-top:10vw; text-align:center; background-position:top center;}
.plan h5{text-align:center;}
.plandetail{width:90%; margin:0 auto;}
.plan_d .plandetail p br{display:none}
.businessImage {width:100vw;}
.businessImage ul li {width: calc(90vw / 2);}
}