@charset "utf-8";
/* 
00 404.html
00 index.html
01 about.html
02 privacy.html
03 terms.html
04 contact/
05 edit-request/
06 entry/
07 search/(area/)
08 search/team/(area/team/{$team_id}/)
-------------------------
-------------------------
20 product/



/* 横向きの場合のスタイル
-------------------------------------------------------------------------------- */
.forpc{display: none;}
/* @media screen and (orientation: landscape) {}
@media screen and (min-width: 560px) {}
@media screen and (min-width: 768px) {} */

/* -- PCview用
-------------------------------------------------------------------------------- */
@media screen and (min-width: 960px) {
	*{word-break: break-word;}
	.forpc{display: block;}
	.forsp{display: none;}

/* common
-------------------------------------------------------------*/
	.inner{
		max-width: 960px;
		padding: 0 80px;
		margin: 0 auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	header #hdInner{
		max-width: 960px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	#ftflx{
		width: 800px;
		margin: 0 auto;
		display: -webkit-flex;
		display: flex;
		justify-content: space-between;
	}
	#ftflx #ftlogo{
		padding: 0;
		margin: 40px 0;
	}
	#ftflx #ftlogo p{padding: 0;}
	#ftflx dl{
		padding: 0;
		margin: 20px 0 0;
		width: 310px;
	}
	#ftflx #ftlogo dl{width: auto;}
	#ftlogo p{
		padding-left: 10px;
		text-align: left;
	}
	#ftlogo ul{justify-content: flex-start;}
	footer #ftLinks li a{padding: 5px 10px;}

	#wrapper section h2{margin: 30px 0 15px;}
	.breadcrumb li{font-size: 1rem;}

	.btn{
		padding: 5px 15px;
		margin: 15px auto;
		text-align: center;
	}
	.btn a,
	.btn button,
	.btn input[type="submit"]{
		width: auto;
		min-width: 320px;
		display: inline-block !important;
	}
	.login{text-align: right;}
	#drawer{width: 350px;}

	#srch .flx{justify-content: center;}
	#srch .flx > *{
		padding: 5px 0;
		margin: 0;
		flex:0 1 180px;
	}
	#srch .flx .btn button{
		width: 100%;
		min-width: auto;
	}

/* 00 404.html
-------------------------------------------------------------*/
	#nf section{
		min-height: 60vh;
		display: -webkit-flex;
		display: flex;
	}
	#nfinner{
		width: 960px;
		margin: 0 auto;
		display: -webkit-flex;
		display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
	}
	#nfinner > div{
		margin: 30px 0;
		padding: 0 40px;
		width: 500px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}


/* 00 index.html
-------------------------------------------------------------*/
	#indMain{
		width: 800px;
		padding: 20px 40px;
		margin: 0;
	}
	/* #indHead{gap: 10px;}
	#indHead::before{
		width: 76px;
		height: 60px;
	} */
	#indHead span{font-size: 1.43rem;}
	#wrapper section #indHead h2{font-size: 2.86rem;}

	#indsearch{
		height: 376px;
		padding-left: 276px;
		background: url(../img/common/hd_img.png) 0 0 no-repeat;
		display: -webkit-flex;
		display: flex;
		flex-flow: column;
		justify-content: center;
	}
	#indsearch div#search_caps{
		padding-left: 15px;
		font-size: 1.29rem;
		margin-bottom: 15px;
	}
	#indsearch div#search_caps::before{display: none;}
	.searchBtn a{
		padding: 15px 40px;
		font-size: 1.72rem;
	}

	#indCaps{text-align: center;}
	#indCaps > div a{
		width: 320px;
		font-weight: bold;
		display: inline-block;
	}

/* 01 about.html
-------------------------------------------------------------*/
	#about dl dt{font-weight: bold; margin-bottom: 10px;}
	#about dl dd{margin: 0 0 30px;}
	#about .lists{
		max-width: 500px;
		padding: 10px 30px;
		margin: 15px auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	#about .holder{margin: 15px 0;}


/* 02 privacy.html
-------------------------------------------------------------*/
/* 03 terms.html
-------------------------------------------------------------*/
	dl.desc dt{
		margin: 5px 0 15px;
		font-size: 1.17rem;
	}
	#privacy .lists,
	#terms .lists{
		max-width: 720px;
		padding: 10px 30px;
		margin: 15px auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

/* 04 contact/
-------------------------------------------------------------*/
	#contactNotes{
		width: 720px;
		padding: 20px 40px;
		margin: 20px auto;
		border: 1px solid #808080;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	#contactNotes dt{
		font-size: 1.29rem;
		font-weight: bold;
	}
	#contactNotes dd{
		padding: 15px 0 0;
		font-size: 1rem;
	}
	#contactForm{
		margin: 0 -10px 30px;
		padding: 40px;
		background: #f4f4f9;
	}
	#contactForm dl{
		width: 100%;
		padding: 15px;
		display: -webkit-flex;
		display: flex;
		align-items: flex-start;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		gap: 8px;
	}
	#contactForm dl dt{
		flex:0 0 200px;
		gap: 5px;
		align-items: flex-end;
		line-height: 1.2;
	}
	#contactForm dl dt p em{display: block;}
	#contactForm dl dd{
		padding: 0;
		margin: 0;
		flex: 1 1 auto;
	}

/* 05 edit-request/
-------------------------------------------------------------*/
	#requestNotes dt{font-weight: bold;}
	#contact .lists{
		max-width: 720px;
		padding: 10px 30px;
		margin: 15px auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

/* 06 entry/
-------------------------------------------------------------*/
	#entryNotes dt{font-weight: bold;}
	#entryForm{
		margin: 0 -10px 30px;
		padding: 40px;
		background: #f4f4f9;
	}
	#entryForm .flx{gap: 15px;}
	#entryForm .flx *{flex: 0 0 auto;}

	#telform.flx input{flex:0 0 6em;}

/* 07 search/(area/)
-------------------------------------------------------------*/
	#searchbox{
		margin: 30px -10px;
		padding: 15px 80px;
	}
	#searchCond{
		padding: 15px 65px;
		margin: 15px 0;
	}
	#searchCond p{font-weight: bold;}
	ul#condTB li{padding: 5px 0;}
	ul#condTB li dl dt,
	ul#condTB li dl dd{
		font-size: 1rem;
	}
	#teamlist{
		margin: 30px -10px;
		padding: 20px 40px;
	}
	.card{padding: 25px 40px 10px;}
	.card_hd dt{font-weight: bold;}

	.no-swiper-wrapper{gap:5px;}
	.no-swiper-wrapper .rel_card{flex: 0 0 191px;}

/* 08 search/team/(area/team/{$team_id}/)
-------------------------------------------------------------*/
	#detail .holder{margin: 15px 0;}
	#basis{margin: 10px 0 30px;}
	#basis_info{padding: 15px 40px;}
	#basis_info li dl{padding: 10px 15px;}
	#basis_info li dl dt{font-size: 1rem;}
	#basis .annotation{
		padding: 15px 0;
		font-size: .86rem;
		text-align: center;
	}
	#teamtags{justify-content: center; gap:8px;}
	#teamtags li{padding: 2px 5px; font-size: 1rem;}
	#team_pr{
		width: 720px;
		padding: 15px 40px;
		margin: 15px auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	#teaminfo > dd{padding: 20px 0;}
	#teamphoto{
		width: 640px;
		margin: 30px auto;
		gap: 20px;
		font-size: .86rem;
		grid-template-columns: repeat(2, 310px);
	}
	#coach dd{padding: 20px 0;}
	#coach dd span{margin-bottom: 5px;}
	#teaminfo .btn{margin: 0 auto;}
	#notice h4{margin-bottom: 20px;}
	#notice > p{padding: 0 40px;}
	#notice dl{
		margin: 20px 0;
		padding: 10px 40px;
	}

	#share{padding: 0 150px;}
	#share dt{font-size: 1rem;}
	
	#share dd{flex: 1 1 48px;}
	#share dd a{
		padding: 15px 0;
		display: flex;
		justify-content: center;
		text-indent: -9999px;
	}
	#share dd a::before{
		width: 36px;
		height: 36px;
	}

/* 09 words.html
-------------------------------------------------------------*/
	#anchor{padding: 10px 40px;}
	#anchor li{flex:0 1 16%;}


/* 20 product/
-------------------------------------------------------------*/
	#product .btn.edge.contact a{width: auto;}
	#pdt_head{
		max-width: 800px;
		margin: 0 auto;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	#pdt_head h3{
		flex-flow: row wrap;
		justify-content: center;
		gap: 5px;
	}
	#pdt_head p{
		width: 630px;
		margin: 0 auto;
	}
	.design_plan .inner{padding: 0 120px;}
	.design_plan dl{
		width: 500px;
		margin: 20px auto;
		padding: 20px 15px;
	}
	.design_plan dl dd{padding: 15px 50px 0;}
	#price .inner,
	#faq .inner,
	#flow .inner{padding: 0 120px;}

	#price h3,
	#faq h3,
	#flow h3{font-size: 1.72rem;}
	#price .holder img{
		width: 720px;
		height: auto;
	}
	#flow dl dd::after{margin: 15px 0 10px;}
	.design_plan .inner{padding: 0 120px;}
	#consult .searchBtn{padding: 5px 15px;}
	#consult .searchBtn {
		text-align: center;
		display: inline-block;
		position: relative;
	}
	#consult .inner > div{
		padding: 20px 10px;
		color: #fff;
		text-align: center;
	}

}