@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.1.0
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
span.mark{
	color:red;
	font-weight:bold;
}
.breadcrumb{
	background:rgb(0,0,0,0.1);
	margin:0;
	padding:0.7em;
	color:#333;
}
.fa-home{
	display:none;
}
.wrapper100{
	width:100%;
}
.wrapper100-g{
	width:100%;
	background:rgb(0,0,0,0.1);
}
.content-wrapper{
	max-width: 1100px;
	margin:0 auto !important;
	padding:4% 3%;
}
body.public-page{
	background-image:url(https://perrys.artista.link/wp-content/uploads/2020/08/shutterstock_1008068017.jpg);
	background-size:cover;
	background-position:top center;
	background-repeat:no-repeat;
}
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 480px) {
.pc { display: none !important; }
.sp { display: block !important; }
}
.block{
	width:100%;
	padding:30px 20px;
}
h2.cf{
	background-color:transparent;
	margin:0;
	font-weight: 300;
	padding-left:0.2em;
}


div.whatsnew h2{
	display:none;
}
div.whatsnew hr{
	display:none;
}
div.whatsnew dd{
	text-align:left;
}
div.whatsnew {
	max-width: 800px;
}
div.whatsnew dt{
	color:#333 !important;
}
div.whatsnew a{
	color:#333;
}
div.whatsnew .newmark{
	background-color:#f49404 !important;
}
a.more{
	padding:1em;
	background:#333;
	color:#FFF;
	text-align:center;
	text-decoration:none;
	display:block;
	max-width: 500px;
	margin:0 auto;
}
a.more:hover{
	opacity:0.8;
	transition:0.2s;
	box-shadow:0 0 7px gray;
}


ul.kigyou{
	list-style:none;
	padding:0;
	display:flex;
	justify-content:center;
	flex-wrap:nowrap;
}
ul.kigyou li{
	width:48%;
}
ul.saiyou{
	list-style:none;
	padding:0;
	display:flex;
	justify-content:center;
	flex-wrap:nowrap;
}
ul.saiyou li{
	width:31%;
}
.work{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
	margin:20px 0;
}
.work-item{
  width:32%;
  height:auto;
  margin:3px;
  padding:1em;
  background:rgb(255,255,255,0.8);
	text-align:center;
}
.work-item img{
  width:60%;
  height:auto;
	text-align:center;
}
.work-item h3{
    border:none;
    font-size: 22px;
    padding: 12px 20px;
	margin:0;
}
.work-item p{
	text-align:left;
}
a.miru{
	padding:1em;
	background:#fdd000;
	color:#FFF;
	text-align: center;
	text-decoration:none;
	border-radius:50px;
	display:block;
	max-width: 500px;
	margin:5px auto;
}
a.miru:hover{
	color:#1d1d1d;
	opacity:0.8;
	transition:0.3s;
	font-weight:bold;
}
.top-about{
	background:#FFF;
	border-radius:10px;
	border:solid 3px #1d1d1d;
	box-shadow:3px 3px #e9bc00;
	padding:2em;
}
.top-about img{
	border-radius:0 0 10px 10px;
}
video.top-video{
	max-width: 1000px;
	border-radius:10px;
	border:solid 5px #FFF;
	box-shadow:3px 3px #1D1D1D;	
	width:100%;
	height:auto;
}
.movie{
	position:relative;
	padding:0 1em;
}
img.scroll{
	position:absolute;
	bottom:0;
	left:30px;
	height:300px;
	width:auto;
}
.nivo-controlNav{
	padding-bottom:0 !important;
	margin-bottom:-20px;
}
table.saiyou-t{
	background:transparent;
	border:none;
}
table.saiyou-t th,table.saiyou-t td{
	border:none;
	background:transparent;
	text-align:left;
		border-bottom:solid 1px #333 !important;
	line-height:3em;
}
table.saiyou-t tr:nth-of-type(2n+1) {
    background-color:transparent;
}
.menu-drawer a{
	color:#FFF;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
}

/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
	img.scroll{
		display:none;
	}
	
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	#header-container{
		display:none;
	}
	.appeal-in {
    padding: 20% 5% 7% 5% !important;
}
	.appeal-title{
		font-size:40px !important;
	}
	.work{
		flex-direction:column;
	}
	.work-item{
		width:100%;

	}
	.entry-content>*{
		margin-top:0;
		margin-bottom:0;
	}
	.entry-categories-tags{
		display:none;
	}
	div.whatsnew dt{
		border-left:solid 5px #333 !important;
		padding-left:0.5em !important;
	}
}


/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	h2.cf{
		font-size:27px;
	}
	.header-container-in.hlt-top-menu .logo-header img{
		width:130px;
	}
	.block {
    padding: 30px 0;
}
	ul.kigyou{
		flex-direction:column;
	}
	ul.kigyou li{
		width:100%;
		margin: 0.2em 0;
	}
	ul.saiyou{
		flex-direction:column;
	}
	ul.saiyou li{
		width:100%;
		margin: 0.2em 0;
	}
	.work-item img{
		width:30%;
	}
	.breadcrumb span.sp{
		display:none !important;
	}

}