@charset "UTF-8";

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

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

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

.content{
	margin-top:0px;
}

#post-17 .entry-header{
	display:none;
}

.page-id-17 .content-in{
	width:100%;
}

.page-id-17 .main{
	padding:0px;
}

.page-id-17 .entry-content{
	margin-top:0px;
}

.main_v{
	background:url('/wp-content/uploads/2024/04/tentou.jpg');
	background-position:center;
	background-size:100%;
	margin-top:0px;
	margin-bottom:0px;
	text-align:center;
	height:700px;
	position:relative;
}

.main_v_img{
	width:50%;
	margin:auto;
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index:2;
}

.main_v:after{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height:100%;
	background-color: rgba(0,0,0,0.5);
	background-image: radial-gradient(#111 10%, transparent 10%), radial-gradient(#111 25%, transparent 26%);
	background-size: 4px 4px;
	background-position: 0 0, 2px 2px;
}

.page-id-17 h2{
	margin:0px;
	background-color:#333;
	color:white;
}

.title_h2{
	text-align:center;
}

.yellow-bold{
	font-weight:bold;
	color:yellow;
	font-size:1.5em;
}

.fukidashi{
	position:relative;
}

.fukidashi:before{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -40px;
	border: 40px solid transparent;
	border-top: 20px solid #333;
}

.problem_box{
	width:980px;
	margin:auto;
	margin-top:60px;
	max-width:100%;
}

.problem_box ul{
	list-style:none;
	font-size:1.5em;
	font-weight:bold;
	border:dotted 2px #333;
	padding:40px;
}


.problem_box ul li{
	border-bottom:dotted 1px #333;
	padding:0 40px;
}

.problem_box ul li:before{
	font-family: "Font Awesome 5 Free";
	content: "\f14a";
	margin-right:30px;
	color:darkred;
}


.arrow{
	width: 30px;
	height: 30px;
	border: 5px solid;
	border-color: darkred darkred transparent transparent;
	transform: rotate(135deg);
	position:absolute;
	left:0;
	right:0;
	margin:auto;
}

.strong_p{
	margin-top:100px;
	font-size:1.7em;
	text-align:center;
	font-weight:bold;
}

.before_shop{
	background-color:#d1c7d7;
	position:relative;
}

.before_shop:before{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -40px;
	border: 40px solid transparent;
	border-top: 20px solid #d1c7d7;
	z-index:2;
}


.before_shop_box{
	width:980px;
	max-width:95%;
	margin:auto;
	background-color:white;
	padding:10px;
	border:solid 20px #d1c7d7; 
}

.before_shop_box  p:nth-child(2){
	margin-bottom:0px;
}

.sympathy{
	margin-bottom:0px;
}


.solution_wrap{
	position:relative;
}

.title_background{
	background-color:#333;
}

.sep_h2{
	display:flex;
	flex-wrap:wrap;
	margin:auto;
	text-align:left;
	justify-content:center;
	align-items:center;
}

.sol_h2_span01{
	font-size:1.7em;
	color:yellow;
}

.sep_h2 div:nth-child(1){
	border-right:solid 2px white;
	padding:10px;
	
}

.sep_h2 div:nth-child(2){
	font-size:2em;
	padding:10px;
}

.sub_title{
	text-align:center;
	font-weight:bold;
	font-size:2em;
	border-bottom:dotted 1px;
}


.sub_title span{
	color:#E60033;
	font-size:1.2em;
}

.page-id-17 h3{
	border:none;
	font-size:2.5em;
	margin-bottom:0.26em;
	border-bottom:double 3px;
}

.page-id-17 h3 em{
	padding-bottom:10px;
}

.solution_box{
	width:980px;
	max-width:100%;
	margin:auto;
}

.sb_con{
	font-weight:bold;
}

.sb_con ul{
	list-style:none;
	padding-left:0px;
}

.h3_p01:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point01.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}

.h3_p02:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point02.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}

.h3_p03:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point03.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}

.h3_p04:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point04.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}

.h3_p05:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point05.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}

.h3_p06:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point06.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}

.h3_p07:before{
	content: "";
	display: inline-block;
	width: 50px;
	height: 60px;
	background-image: url('/wp-content/uploads/2022/02/point07.png');
	background-size: contain;
	background-repeat:no-repeat;
	vertical-align: middle;
	border-right:solid 1px;
	margin-right:10px;
}


.sb_con ul{
	display:flex;
	flex-wrap:nowrap;
}

.sb_con ul li:nth-child(1){
	width:100%;
}

.sb_con ul li:nth-child(2){
	width:100%;
}

.small{
	font-size:.9em;
	text-align:right;
}

.p07 > div > p:nth-child(2){
	margin-bottom:0px;
}

@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-300px * 10))}
}

.slider {
  background: white;
  box-shadow: 0 10px 20px -5px rgba(0, 0, 0, .125);
  height: 200px;
  margin: auto;
  overflow:hidden;
  position: relative;
  width: 100%;
}

 .slide-track {
	 animation: scroll 40s linear infinite;
	 display: flex;
	 width: calc(300px * 20);
}
  
 .slide {
	 height: 100px;
	 width: 250px;
 }

.fukidashi_red{
	position:relative;
}

.fukidashi_red:before{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -40px;
	border: 40px solid transparent;
	border-top: 20px solid darkred;
}

.fukidashi_red h2{
	background-color:darkred;
}

.pl_box h3{
	border-bottom:dotted 2px;
	font-size:1.5em;
	text-align:center;
	color:darkred;
}

.coution p{
	font-size:.6em;
	margin-bottom:0px;
	text-align:right;
}

.pl th{
	background-color:white;
	text-align:center;
	border-width:0px 0px 2px 0px ;
	border-color:darkred;
	color:darkred;
}

.pl td{
	background-color:white;
	text-align:center;
	border-width:0px 0px 2px 0px ;
	border-color:#333;
	color:#333;
	font-weight:bold;
}

.pl_box{
	margin-bottom:30px;
}

.yellow{
	color:yellow;
	font-size:1.1em;
}

.media_box{
	width:980px;
	max-width:100%;
	position:relative;
	margin:auto;
}

.gekkan{
	display:flex;
	max-width:100%;
	margin-top:60px;
}

.gekkan img{
	object-fit:cover;
	width:100%;
}

.media_box tr{
	border-style:dotted;
	border-width:0px 0px 1px 0px;
}

.media_box th{
	text-align:left;
	border:none;
}


.media_box td{
	text-align:left;
	background-color:white;
	border:none;
	font-weight:bold;
}

.media_date{
	background-color:#333;
	border-radius:5px;
	color:white;
	margin-right:10px;
	padding:10px;
}

.kamei_box,
.model_box{
	max-width:100%;
	width:980px;
	margin:auto;
	margin-top:60px;
	margin-bottom:60px;
}

.kamei_box td{
	line-height:1;
}

.kamei_box span{
	font-size:.6em;
}

.model{
	background-color:#bb5959;
	margin-bottom:0px;
}

.model_box{
	margin-bottom:0px;
}

.support h2{
	line-height:1.5;
}

.support_box{
	width:980px;
	max-width:100%;
	margin:auto;
	margin-top:60px;
}


.support_box ul{
	list-style:none;
	padding:0px;
}

.support_box_box{
	display:flex;
	flex-wrap:wrap;
}

.sbbli{
	width:49%;
}

.sbbli ul li:nth-child(1){
	height:200px;
	position:relative;
}

.sbbli ul li:nth-child(1) img{
	object-fit:cover;
	height:200px;
}

.sbbli ul li:nth-child(2){
	background-color:#333;
	text-align:center;
	color:white;
	font-weight:bold;
}

.sbbli ul li:nth-child(3){
	font-size:.9em;
	font-weight:bold;
}

.qa_box{
	width:980px;
	max-width:100%;
	margin:auto;
	margin-top:60px;
	margin-bottom:60px;
}

.qa_box details{
	padding:10px;
	margin-bottom:5px;
	font-weight:bold;
	border-bottom:dotted 1px;
}


.qa_box details summary{
	font-size:1.3em;
}


.qa_box details[open] summary{
	background-color:white;
	color:#333;
}

.flow_chart_box{
	width:980px;
	max-width:100%;
	margin:auto;
	margin-top:60px;
}


.flow_chart_box ul{
	list-style:none;
	padding:0px;
	display:flex;
	align-items:center;
	font-weight:bold;
	position:relative;
}

.flow_chart_box ul li:nth-child(1){
	width:30%;
	text-align:center;
	background-color:darkred;
	color:white;
	padding:20px 10px;
	position:relative;
}

.arrow_ul:before{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -10px;
	border: 10px solid transparent;
	border-top: 10px solid darkred;
}


.flow_chart_box ul li:nth-child(2){
	width:70%;
}

.contact{
	background-color:#dddddd;
}

.contact_box{
	width:880px;
	max-width:100%;
	margin:auto;
	margin-top:60px;
	font-weight:bold;
	padding:5px;
}


.contact_box input{
	margin-top:10px;
}

.cta_span{
	color:white;
	background-color:#333;
	padding:5px 3px;
	margin-right:10px;
	border-radius:3px;
	font-size:.8em;
}

.wpcf7-submit:disabled{
	font-weight:bold;
	opacity:0.8;
	border:none;
	border-radius:100px;
	background-color:#eeedf5;
}

input[type='submit']{
	font-weight:bold;
	opacity:1;
	border:none;
	border-radius:100px;	
	color:white;
	background-color:#3dc147
}

.contact{
	margin-bottom:60px;
}

.contact_about{
	background-color:#eeedf5;
	padding:10px;
}

.contact_about p{
	font-size:.6em;
}

#go-to-top{
	display:none!important;
}

.item-label{
	font-size:.8em;
	font-weight:bold;
}

#menu-item-229 > a > div > div{
	background-color:darkblue;
	color:white;
}

.hover_cta_pc{
	position:fixed;
	left:0px;
	top:20%;
	width:80px;
	overflow:hidden;
}

.hover_cta_pc a:hover{
	opacity:.8;
}

@keyframes shiny {
    0% { left: -500%; }
    10% { left: 100%; }
    100% { left: 100%; }
}

.shiny-btn {
	position: relative;
	width:50px;
}

.shiny-btn:after {
content: '';
    position: absolute;
    top: -10%;
    left: -20%;
    width: 400px;
    height: 100%;
    transform: scale(2) rotate(260deg);
    background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, .5) 100%, rgba(255, 255, 255, 0) 0%);
    animation-name: shiny;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    overflow: hidden;
}

.footer{
	background-color:#c62d28;
	color:white;
	padding:0px;
	margin-top:0px;
}

.footer-bottom{
	margin-top:0px;
}

.footer_lp{
	text-align:center;
	background-color:#c62d28;
	color:white;
	font-size:.6em;
	font-weight:bold;
	margin-bottom:0px;
}

.footer_lp ul{
	list-style:none;
	padding:0px;
	padding-top:60px;
	margin-bottom:0px;
}

#post-17 > div > div.footer_lp > ul > li:nth-child(3),
#post-17,
#post-17 > div{
	margin-bottom:0px;
}

.hover_cta_sp{
	bottom:0px;
	margin-bottom:0px;
	position:fixed;
	z-index:999;
}

.hover_cta_sp ul{
	list-style:none;
	padding:0px;
	display:flex;
	max-width:100%;
	margin-bottom:0px;
	background-color:#333;
}

.hover_cta_sp ul li{
	margin:0px;
}

.hover_cta_sp ul li a{
	display:block;
}

.small{
	font-size:.6em;
	text-align:left;
}

.coution{
	text-align:left;
}

.contact{
	margin-bottom:0px;
	padding-bottom:60px;
}

#navi-menu-content{
	background-color:#333;
}

.thankspage{
	width:980px;
	margin:auto;
	max-width:100%;
}

.page-id-251 h1{
	text-align:center;
	border-bottom:solid 1px darkred;
}

.pc_tel{
	position:fixed;
	left:10px;
	bottom:30px;
	margin-bottom:0px;
}

.pc_tel ul{
	list-style:none;
	padding:0px;
	display:flex;
	background-color:rgba(1,1,1,0.8);
	align-items:center;
	border-radius:5px;
	margin-bottom:0px;
	flex-direction:column;
}


.pc_tel ul li:nth-child(1){
	font-size:.7em;
	font-weight:bold;
	text-align:center;
	color:white;
}

.pc_tel ul li:nth-child(2){
	font-size:1em;
	font-weight:bold;
	color:yellow;
}

.pc_tel ul li:nth-child(2):before{
	font-family: "Font Awesome 5 Free";
	content: "\f095";
	margin-right:5px;
}

.pc_tel_01{
	display:block;
}

.pc_tel_02{
	display:block;
}

.position_map{
	display:flex;
}

.campaign_btn{
	background-color:darkblue;
	color:white;
	font-weight:bold;
	border-radius:200px;
	padding:10px 0;
	width:80%;
	margin:auto;
	text-align:center;
	margin-bottom:60px;
}

.campaign_btn:hover{
	opacity:.8;
}

.campaign_btn a{
	text-decoration:none;
	display:block;
	color:white;
}

/**モデル収支モザイク**/

#jisseki > div > table > tbody > tr > td{
	-ms-filter: blur(5px);
	filter: blur(5px);
}

/*面談予約ページ*/
.page-id-320 .content-in{
	max-width:800px;
	margin:auto;
}

.page-id-320 h1{
	display:none;
}

.mendan_b{
	font-weight:bold;
}

.mendan{
	text-align:center;
	font-size:1.2em;
	font-weight:bold;
	position:relative;
	border-bottom:solid 3px;
	margin-bottom:50px
}

.mendan:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.mendan:after{
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #555;
  z-index: 1;
}


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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	
	.flow_chart_box ul li:nth-child(1),
	.flow_chart_box ul li:nth-child(2){
		width:100%;	
	}

	.flow_chart_box ul{
		display:block;
	}
	
	.hover_cta_pc{
		display:none;
	}
	
	#menu-mobile_header > li:nth-child(1){
		background-color:white;
		color:black;
	}

	#menu-mobile_header > li:nth-child(1) a{
		color:black;
	}
	
	#menu-mobile_header > li:nth-child(3){
		background-color:white;
	}

	#menu-mobile_header > li:nth-child(3) a{
		color:black;
	}
	
	.footer_lp ul{
		padding-bottom:60px;
		}
	
	.footer-bottom{
		display:none;
	}


	.main_v_img{
		width:100%;
	}
	
	.problem_box ul{
		padding:0px;
		border:none;
		font-size:1.1em;
	}

	.problem_box ul li{
		padding:0px;
	}
	
	.problem_box ul li:before{
		margin-right:5px;
	}
	
	.strong_p{
		font-size:1.3em;
	}
	
	.ans_box{
		font-size:1em;
	}
	
	.parallax_in{
		top: 40%;
		left: 0;
		right:0;
		transform: translate(0%, 0%);
		-webkit-transform: translate(0%, 0%);
		-ms-transform: translate(0%, 0%);	margin:auto;
		z-index:2;
		margin:0 5px;
		padding:0 5px;
	}
	
	h2.sep_h2{
		font-size:1em;
	}
	
	.sep_h2 div:nth-child(1){
		border:none;
	}
	
	.sub_title{
		font-size:1.5em;
	}

	.page-id-17 h3:before{
		display:block;
		border:none;
		border-bottom:solid 1px;
		margin:auto;
		margin-bottom:10px;
	}
	
	.page-id-17 h3{
		font-size:1.9em;
	}
	
	.sb_con ul{
		flex-wrap:wrap;
		flex-direction: column-reverse;
	}
	
	.small{
		font-size:.6em;
		text-align:left;
	}

	.coution p{
		text-align:left;
	}

	.media_box th{
		width:25%;
	}
	
	h2.support_h2{
		font-size:.9em;
	}
	
	.sbbli{
		width:48%;
	}
	
	.sbbli ul li:nth-child(2){
		font-size:.8em;
	}
	
	.problem_box,
	.sb_con,
	.pl,
	.media_box{
		padding:5px;
	}
	
	.flow_chart_box{
		padding-right:8px;
	}
	
	.qa_box details summary{
		font-size:1em;
	}
	
	.arrow_ul:before{
		top:105%;
	}
		
	.main_v{
		background-size:250%;
	}
	
	.pc_tel{
		display:none;
	}
	
	.position_map{
		flex-direction: column-reverse;
	}
	
}

@media screen and (min-width: 480px){
  /*必要ならばここにコードを書く*/
	.hover_cta_sp{
		display:none;
	}
	
	.sp_br{
		display:none;
	}

}