@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

#list-wrap ,
#header-container{
  display: none;
}

#main{
	padding:0;
	margin:0;
	background:#fafafa;
}
body{
	font-family: "Zen Kaku Gothic Antique", sans-serif !important;
	font-weight: 500;
	font-style: normal;
	font-size:clamp(0.875rem, 0.83rem + 0.23vw, 1rem) !important;
	line-height:1.5em;
	margin:0;
}





.fw-400{
	font-weight:500;
	font-size:clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
	line-height:1.8em;
}


.wrap{
	width:100%;
}

:root {
	--black:#0e0e0e;
	--red: #e50111;
	--red2:#a10d18;
	--black:#0e0e0e;
	--gray:#e6e6e6;
	--radius:30px;
	--content-width:1280px;
	--content-width-s:960px;
	
	--wide: 1366px;
    --middle: 960px;
}




.svg-icon{
	display: none;
}

.clearfix::after {
	content: "";
	display: block;
	clear: both;
	align-content
}


.e_font{
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 800;
	font-style: normal;
}

.blue_t{
	color:var(--blue);
}

.white_t{
	color:#fff;
}
.yellow_t{
	color:var(--yellow);
}

.btn_fade{
	transition:0.2s;
}

.btn_fade:hover{
	opacity:0.5;
}


.small{
	font-size:80%;
}

.red{
	color:var(--red);
}


p{
	margin-top:1em;
	line-height:1.8em;
}

.big{
	font-size:150%;
}

.text_center{
	text-align:center;
}


img.responsive{
	width:100%;
}


img.square{
	aspect-ratio:1 / 1;
	object-fit:cover;
}

hr{
	border:none;
	padding:40px 0;
}

#content{
	margin-top:0;
}

.text_center{
	text-align:center;
}
@media all and (max-width: 782px) {
	
	.text_center.sp_text_left{
		text-align:left;
	}
}




.text_right{
	text-align:right;
}


.e_font{
	font-family: "Montserrat", sans-serif;
	font-weight: 900;
	font-style: normal;
}




/*----------------------
 * scroll_view
 * ----------------------*/
/*
.scroll_view{
	opacity:0;
	transition:0.8s;
	filter: blur(14px);
}
.scroll_view.view{
	opacity:1;
	filter: blur(0);
}
*/
.scroll_view {
  opacity: 0;
  filter: blur(14px);
  transition: opacity 0.6s ease-out, filter 0.6s ease-out;
  will-change: opacity, filter;
}
.scroll_view.view {
  opacity: 1;
  filter: blur(0);
}


/*-------------------------
 * btn_p
 * ----------------------*/

.btn_p.line a,
.btn_p.line a:hover,
.btn_p.line a:visited{
	color:var(--red);
	text-decoration:none;	
	border-bottom:var(--red) solid 2px;
	display:flex;
	width:240px;
	justify-content: space-between;
}

.btn_p.line a i{
	aspect-ratio:1 / 1;
	display:block;
	border-radius:50%;
	padding:5px;
	transition:0.2s;
}


.btn_p.line a:hover i{
	background:var(--red);
	color:#fff;
}





.btn_p.big a span {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    width: 100%;
}


.btn_p.big a {
    position: relative;
    z-index: 0;
	color: #fff;
    text-decoration: none;
    line-height: 1em;
	height:90px;
    width: 360px;
    display: table;
    font-weight: 900;
	text-align:center;
	margin:0 auto;
	border-radius:90px;
	transition:0.2s;
}


.btn_p.big a:before{
	content:"";
	width:100%;
	height:90px;
	position:absolute;
	z-index:-1;
	left:0;
	transition:0.5s;
	background:linear-gradient(142deg, rgba(229,1,17,1) 0%, rgba(161,13,24,1) 100%);
	border-radius:90px;
}
.btn_p.big a:after{
	content:"";
	width:100%;
	height:90px;
	position:absolute;
	z-index:-2;
	left:0;
	background:linear-gradient(142deg, rgba(78,0,6,1) 0%, rgba(255,22,38,1) 100%);
	border-radius:90px;
}
.btn_p.big a:hover:before{
	opacity:0;
}


.btn_p.big a:hover{
	box-shadow: 0 0 20px var(--red);
}



@media all and (max-width: 782px) {
	.btn_p.line a,
	.btn_p.big a{
		width:100%;
	}
}






/*-------------------------
 * flex_box
 * ----------------------*/
.flex_box{
	display:flex;
	justify-content: space-between;
	gap:1em;
}

.flex_box .box{
	width:100%;
}

.flex_box.flex_2,
.flex_box.flex_3,
.flex_box.flex_4,
.flex_box.flex_1_05{
	flex-wrap: wrap;
	justify-content: flex-start;
}

.flex_box.flex_2 .box{
	width:calc((100% - 1em) / 2);
}

.flex_box.flex_3 .box{
	width:calc((100% - 1em - 1em) / 3);
}

.flex_box.flex_4 .box{
	width:calc((100% - 1em - 1em - 1em) / 4);
}

.flex_box.flex_1_05 .box:first-child{
	width:200px;
}

.flex_box.flex_1_05 .box:last-child{
	flex:1;
}


@media all and (max-width: 820px) {
	.flex_box.flex_3 .box{
		width:calc((100% - 1em) / 2);
	}
}


@media all and (max-width: 782px) {
	.flex_box.sp_colmn{
		flex-flow: column;
	}
	

	.flex_box.sp_colmn.flex_3 .box{
		width:100%;		
	}
	
	.flex_box.flex_1_05 .box{
		width:100% !important;		
	}
	
	.flex_box.flex_3 .box{
		width:100%;
	}
}





/*-------------------------
 * .grid_box
 * ----------------------*/

.grid_box{
	display:grid;
}

.grid_box.grid_3{
	grid-template-columns: 1fr 1fr 1fr;
}




/*--------------------------
 * list_box
 * ----------------------*/

.list_box .box a{
	color:#fff;
	text-decoration:none;
	aspect-ratio: 4 / 3;
	
	width:100%;
	height:auto;
}
.list_box .box a .thum_p{
	margin:0;
	overflow:hidden;
}

.list_box .box a .thum_p img{
	transition:0.3s;
}
.list_box .box a:hover .thum_p img{
	transform:scale(1.2,1.2);
}

.list_box .box a .text_p{
	position:relative;
	z-index:2;
	margin:0;
	margin-top:-2em;
	display:block;
	padding:0.5em 1em;
	background:linear-gradient(142deg, rgba(229,1,17,1) 0%, rgba(161,13,24,1) 100%);
}



/*--------------------------
 * banner_box
 * ------------------------*/

.banner_box ul{
	margin:0;
	padding:0;
	display:flex;
	gap:20px;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.banner_box ul li{
	margin:0;
	padding:0;
	list-style:none;
	width:calc((100% - 40px) / 2);
}




/*-------------------------
 * table_box
 * ------------------------*/
.table_box table{
	border:none;
    width: 100%;
    font-size: 120%;
    text-align: left;
	
	font-size:1em;
}
.table_box table tr{
	background:none;
}
.table_box table th{
	background:var(--red2);
	color:#fff;
	width:10em;
	text-align:center;
	border:#fff solid 1px;
}

.table_box table td{
	background:#fff3f4;
	border:#fff solid 1px;
	padding:1em;
}


.table_box table td p{
	margin-bottom:0;
}

.table_box table td p:first-child{
	margin-top:0;
}

.table_box table iframe{
	width:100%;
	height:400px;
}


@media all and (max-width: 782px) {
	.table_box table th,
	.table_box table td{
		display:block;
	}
	
	
	.table_box table th{
		width:100%;
	}
	.table_box table th br{
		display:none;
	}
	.table_box table td{
		border:none;
	}
	

	.table_box table iframe{
		width:100%;
		height:auto;
		aspect-ratio:4 / 3;
	}
}



/*---------------------------
 * main
 * -------------------------*/

#container{
	margin-top:80px;
}


@media all and (max-width: 1024px) {
	#container{
		margin-top:60px;
	}
}



/*------------------------------------
 * section.content
 -----------------------------------*/

.content_wide{
	max-width:var(--wide);
	width:95%;
	margin:5em auto;
	padding:0;
}

.content_middle{
	max-width:var(--middle);
	width:100%;
	margin:10em auto;
}

.content_wide .inner{
	padding-bottom:150px;
}


.content_wide .inner:last-child{
	padding-bottom:0;
}

@media all and (max-width: 1366px) {
	.content_wide,
	.content_middle{
		width:calc(100% - 5em - 5em);
		margin:5em auto;
	}
}


@media all and (max-width: 1024px) {
	.content_wide,
	.content_middle{
		width:calc(100% - 40px);
	}
}

@media all and (max-width: 782px) {
	.content_wide .inner{
		padding-bottom:50px;
	}
}




/*---------------------
 * content
 * --------------------*/
article.content{
	padding-bottom:250px;
	margin-top:0;
}


@media all and (max-width: 1024px) {
	article.content{
		padding-bottom:50px;
	}
}

/*--------------------
 * h
 * ------------------*/

.section_h2{
	color:var(--red);
	text-align:center;
	font-size:clamp(1.875rem, 1.193rem + 3.41vw, 3.75rem);
	font-weight:900;
}

.section_h2 .e_font{
	font-size:clamp(1.125rem, 0.966rem + 0.8vw, 1.563rem);
}

.section_h3 {
	background:none;
	padding:1em 0 !important;
	border:none !important;
}





/*------------------------------
 * header
 * ----------------------------*/


#menu_box{
	background:#fff;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:80px;
	padding:0;
	
	display:flex;
	justify-content: space-between;
	align-items: center;
	z-index:10;
}
#menu_box h1 {
	padding-left:40px;
}
#menu_box h1 a{
	display:block;
	/*width:250px;
	height:64px;*/
	
}
#menu_box h1 svg{
	fill:var(--red);
	max-width:250px;
	width:200px;
	/*height:64px;*/
}

#menu_box .link_box .flex_box{	
	display:flex;
	justify-content: center;
	align-items: center;
}

#menu_box .link_box ul{
	margin:0;
	padding:0;
	display:flex;
	justify-content: center;
	align-items: center;
}

#menu_box .link_box li{
	list-style:none;
	padding:0;
	margin:0;
}

#menu_box .link_box li a{
	display:block;
}


#menu_box .link_box .main_menu li a{
	padding:10px;
	color:var(--black);
	text-decoration:none;
	font-weight:700;
	transition:0.2s;
}

#menu_box .link_box .main_menu li a:hover{
	color:var(--red);
}

#menu_box .link_box li a i{
	display:none;
}

#menu_box .link_box .header_big_btn {
	margin:0;
}

#menu_box .link_box .header_big_btn a{
	color:#fff;
	text-decoration:none;
	line-height:1em;
	height:80px;
	width:100%;
	padding:0 20px;
	display:table;
	font-weight:900;
}

#menu_box .link_box .header_big_btn a span{
	display:table-cell;
	vertical-align:middle;
	height:100%;
	width:100%;
}




#menu_box .link_box .header_big_btn a{
	position:relative;
	z-index:0;
}
#menu_box .link_box .header_big_btn a:before{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	z-index:-1;
	left:0;
	transition:0.5s;
	background:linear-gradient(142deg, rgba(229,1,17,1) 0%, rgba(161,13,24,1) 100%);
}
#menu_box .link_box .header_big_btn a:after{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	z-index:-2;
	left:0;
	background:linear-gradient(142deg, rgba(78,0,6,1) 0%, rgba(255,22,38,1) 100%);;
}
#menu_box .link_box .header_big_btn a:hover:before{
	opacity:0;
}


#menu_box #menu_btn{
	background:var(--red);
	display:block;
	width:60px;
	height:60px;
	margin:0;
	position:relative;
}

#menu_box #menu_btn span{
	display:block;
	background:#fff;
	width:40px;
	height:6px;
	position:absolute;
}

#menu_box #menu_btn span:nth-child(1){
	top:15px;
	left:10px;
}

#menu_box #menu_btn span:nth-child(2){
	top:27px;
	left:10px;
}

#menu_box #menu_btn span:nth-child(3){
	bottom:15px;
	left:10px;
}


@media all and (min-width: 1025px) {
	#menu_box .link_box .sub_menu,
	#menu_box #menu_btn{
		display:none;
	}
}


@media all and (max-width: 1024px) {
	
	#menu_box .link_box .sub_menu,
	#menu_box #menu_btn{
		display:block;
	}
	
	
	#menu_box,
	#menu_box h1{
		height:60px;
	}
	
	#menu_box h1{
		padding-left:5%;
	}
	
	#menu_box h1 svg{
		height:40px;
		width:156px;
		margin-top:10px;
	}
	
	#menu_box .link_box{
		position:fixed;
		top:60px;
		left:0;
		background:var(--red);
		width:100vw;
		height:calc(100vh - 60px);
		min-height: 100vh;
		z-index:100;
		
		display:none;
	}
	
	
	#menu_box .link_box .flex_box{
		flex-flow: column;
		height:calc(100% - 60px);
		justify-content:normal;
		align-items:start;		
		gap:0;
		padding:20px;
	}
	
	#menu_box .link_box ul{
		flex-flow: column;
		width:100%;
	}
	
	#menu_box .link_box ul li{
		width:100%;
		border-bottom:#e74e4e solid 1px;
	}
	#menu_box .link_box ul a{
		color:#fff !important;
		text-decoration:none;
		text-align:center;
		padding:1em !important;
	}
	
	#menu_box .link_box .header_big_btn{
		width:100%;
		text-align:center;
		margin-top:2em;
	}
	
	#menu_box .link_box .header_big_btn a{
		line-height:1.5em;
		border:#fff solid 2px;
	}
	
	#menu_box .link_box ul a{
		display:block;
		text-align:left;
		position:relative;
	}
	
	
	#menu_box .link_box li a i{
		display:inline;
		position:absolute;
		right:0;
		bottom:1em;
	}
}




/*--------------------------
 * main_img
 * -----------------------*/

#main_img{
	background:url("/wp-content/uploads/main_visual.webp") center no-repeat;
	background-size:cover;
	
	width:100%;
	height:900px;
	
	position:relative;
}

#main_img .inner{
	max-width:var(--wide);
	width:90%;
	margin:0 auto;
	
	padding-top:150px;
	line-height:1.2em;
	font-size:clamp(1.25rem, 0.568rem + 3.41vw, 3.125rem);
	font-weight:900;
}


@media all and (max-width: 1024px) {
	#main_img{
		height:auto;
		aspect-ratio: 4 / 3;
		position:relative;
	}
	
	#main_img .inner{
		/*padding-top:50px;*/
		padding:0;
		position:absolute;
		top: 50%;
		left: 5%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
	}
}



/*-----------stroke-anime-----------*/
#main_img .stroke-anime {
    width: 100%;
    margin: 0 auto -50px;
}
#main_img .stroke-anime svg {
	margin: 0 auto;
	width: 100%;
	text-align: center;
}

#main_img .stroke-anime text {
	width: 100%;
	stroke: #000;
	stroke-width: 0.5px;
	fill: #000;
	stroke-dasharray: 600;
	stroke-dashoffset: 600;
	animation: textAnime 5s linear;
	font-size:clamp(1.125rem, 0.398rem + 3.64vw, 3.125rem);
	/*MIN 18 MAX 50 */
	
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
@keyframes textAnime {
  0% {
    stroke-dashoffset: 600;
    fill:transparent;
  }
  50% {
    fill:transparent;
  }
  100% {
	stroke-dashoffset: 0;
	fill:#000;
  }
}


@media all and (max-width: 1024px) {
	#main_img .stroke-anime{
		margin:0 auto;
		height:2em;
	}	
	#main_img .stroke-anime svg{
		height:2em;
	}
	
	
	
}


/*--------------------
 * index_news
 * -------------------*/

#index_news{
	background:#fff;
	border-bottom:var(--gray) solid 1px;
	padding:1em 100px;
}

#index_news dl{
	margin:0;
	padding:0;
}
#index_news dl dt,
#index_news dl dd{
	display:inline;
	font-size:clamp(0.75rem, 0.659rem + 0.45vw, 1rem);
}

#index_news dl dt{
	padding-right:2em;
}



@media all and (max-width: 1024px) {
	
	#index_news{
		padding:1em 20px;
	}

	#index_news dl dt,
	#index_news dl dd{
		display:block;
		line-height:1.5em;
	}
	
	#index_news dl dt{
		padding-right:0;
		padding-bottom:0.5em;
	}
}






/*--------------------
 * about
 * ------------------*/


#about{
	background:url("/wp-content/uploads/index_about_back.webp") center right no-repeat;
	background-size:auto;
}
#about .content_wide .box{
	width:50%;
	min-width:660px;
}
#about h2{
	line-height:1.2em;
	font-size:clamp(1.75rem, 1.25rem + 2.5vw, 3.125rem);
	font-weight:900;
}


#about .text_box{
	padding:80px 0;
	padding-bottom:0;
	text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;
}



@media all and (max-width: 1024px) {
	#about{
		background-size:50%;
	}
	
	#about .content_wide .box{
		min-width:70%;
	}
}

@media all and (max-width: 767px) {
	
	#about{
		background:none;
	}
	
	#about .content_wide .box{
		min-width:100%;
	}
	
	#about .text_box{
		padding:40px 0;
		padding-bottom:0;
	}
}


/*------------------
 * works
 * ------------------*/

#works .works_header_img{
	margin-bottom:2em;
}
#works .works_box h3{
	font-size:clamp(1.25rem, 0.795rem + 2.27vw, 2.5rem);
	display:flex;
	align-items:flex-end;
}

#works .works_box h3 img{
	vertical-align: baseline;
	max-width:130px;
	width:3em;
}

#works .works_box h3 span{
	line-height:1.2em;
}

#works .works_box{
	padding-bottom:140px;
}

#works .works_box .list_box{
	margin-top:2em;
}


@media all and (max-width: 767px) {
	
	#works .works_box{
		padding-bottom:70px;
	}
	
	#works .works_box h3 img{
		width:2em;
	}
}

/*-----------------------
 * company
 * ---------------------*/


@media all and (max-width: 767px) {
	#company .flex_box{
		flex-flow:column;
	}

	#company .flex_box .box:last-child{
		width:calc(100% - 40px);
		margin:0 auto;
	}
}

/*----------------------
 * recruit
 * ----------------------*/

#recruit{
	padding:40px 0;
	position:relative;
}

#recruit .back{
	background:url("/wp-content/uploads/recruit_back.webp") center no-repeat;
	background-size:cover;
	margin:0;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

#recruit .content_wide .inner{
	min-width:400px;
	width:40%;
	margin-left: auto;
}

#recruit .content_wide .inner h2{
	color:var(--red);
	font-weight:900;
	font-size:clamp(1.875rem, 1.42rem + 2.27vw, 3.125rem);
	line-height:1em;
}


#recruit .content_wide .inner h2 .small{
	font-size:clamp(0.875rem, 0.739rem + 0.68vw, 1.25rem);
}




@media all and (max-width: 1024px) {
	
	#recruit .back{
		position:static;
		aspect-ratio:3 / 1;
	}
	
	#recruit .content_wide{
		margin-top:0;
	}
	
	#recruit .content_wide .inner{
		min-width:100%;
	}
}

/*-------------------
 * footer
 * -----------------*/

#footer #navi-footer{
	display:none;
}
#footer{
	margin:0;
	padding:0;
	background:var(--black);
	color:#fff;
}
#footer .inner{
    width: 100%;
    margin: 0 auto;
    padding: 40px 80px;
}


#footer .inner .logo {
	text-align:left;
}


#footer .inner .logo svg{
	fill:var(--red);
}

#footer .inner .menu ul{
	margin:0;
	padding:0;
}


#footer .inner .menu ul li{
	margin:0;
	padding:0;
	list-style:none;
}

#footer .inner .menu ul a{
	color:#fff;
	text-decoration:none;
}


#footer .inner .banner ul{
	margin:0;
	padding:0;
	display:flex;
	gap:20px;
	flex-flow: column;
}

#footer .inner .banner ul li{
	margin:0;
	padding:0;
	list-style:none;
	text-align:right;
}

footer .copyright{
	text-align:left;
	font-size:smaller;
	line-height:1.2em;
}



@media all and (max-width: 1024px) {
	#footer .flex_box{
		flex-flow: column;
	}
	
	#footer .flex_box .logo{
		text-align:center;
	}
	
	#footer .inner .banner ul{
		flex-flow: row;
	}
}



@media all and (max-width: 767px) {
	#footer .inner{
		padding:20px;
	}
	
	#footer .inner .banner ul{
		flex-flow:column;
	}
	
	#footer .inner .banner ul a img{
		width:100%;
		text-align:center;
	}
}




/* デフォルト（スマホ表示）では改行しない */
.pc {
  display: none;
}

/* PC表示では改行させる */
@media screen and (min-width: 768px) {
  .pc {
    display: inline;
  }
}



#contact .btn_p {
    margin: 1em 0;
}
#contact .btn_p a {
    background: #fff;
    color: var(--green1);
}
#contact .btn_p a {
    display: block;
    font-size: clamp(18px, 2.5vw, 30px);
    padding: 1em;
    line-height: 1.5em;
}

#contact .btn_p a, .form_box input[type="submit"] {
    padding: 1em 2em;
}

#contact .btn_p a, #navi-in ul .contact, .form_box input[type="submit"] {
    background: linear-gradient(90deg, rgb(0, 97, 104), rgb(0, 180, 168));
    font-size: clamp(16px, 2.5vw, 20px);
    color: #fff;
    text-decoration: none;
    border-radius: 45px;
    padding: 1.2em 2em; /* ← ここを上下1.2em、左右2emに変更 */
    text-align: center;
    font-weight: 700;
    transition: 0.2s;
}
#contact .btn_p.tel a span {
    font-size: 200%;
}

#contact .contact-guide {
	margin: 1.5em 0;
	font-size: 1rem;
	line-height: 1.6;
}

#contact .contact-guide strong {
    font-size: 1.3rem; /* 例：少し大きめ（約21px） */
    display: block;
    margin-bottom: 0.5em;
}