@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.2
*/

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

html,body{
	overflow-x:hidden;
}

.home .entry-header{
	display:none;
}

*{
	font-family: 'Noto Sans JP', sans-serif;
}
select,option{
	font-family: 'Noto Sans JP', sans-serif;
}

.mapitem{
	text-align:center;
}

/* ヘッダー-------------------------- */
.menu-header li a:hover{
	background:initial;
	color:#02a9e7;
	text-shadow:0 0 5px #dfeef5;
}
.site-logo-image{
	transition:0.3s;
}
.site-logo-image:hover{
	opacity:0.6;
}

/* フッター------------------------ */
#custom_html-3{
	margin-bottom:0!important;
}

.contact{
	position:relative;
	padding:30px 15px 0;
}
#custom_html-2{
	position:relative;
}
#custom_html-2:before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100vw;
	margin: 0 calc(50% - 50vw);
	z-index:-1;
	background:#f5f5f5;
/* 	background-size:cover;
	background:url(https://spmobile.shop/wp-content/uploads/2023/12/daniel-romero-bR_r3fJu-vk-unsplash-scaled.jpg); */
}
.contact p{
}

.navi-footer-in > .menu-footer li.menu-item a:hover{
	color:#02a9e7!important;
}

.content-bottom{
	margin:0 0;
}
#custom_html-2{
	margin-bottom:0!important;
}
.footer{
	margin-top:0;
}

.ftr-top{
	padding:0 0 40px;
	text-align:center;
}
.ftr-l{
	padding:10px;
}
.ftr-l img{
	transition:0.3s;
}
.ftr-l img:hover{
	opacity:0.6;
}
.ftr-r ul{
	list-style:none;
}
.ftr-r p{
	text-align:left;
	display:inline-block;
}

/* 見出し---------------------- */
.article h2,
.article h3{
	border:initial;
	background:none;
}

.article h2{
	background:#02a9e7;
	color:#fff;
	border-radius: 5px;
}

.home .article h2{
	background:initial;
	color:#333;
	position:relative;
	text-align:center;
	font-size:1em;
}
.home .article h2:before{
	display:block;
	font-size:1.3em;
	color:#02a9e7;
	padding-bottom:15px;
}
.home .article .h2-service:before{
	content:'SERVICE';
}
.home .article .h2-about:before{
	content:'ABOUT';
}
.home .article .h2-shop:before{
	content:'SHOP';
}

.article h3{
	border-bottom:1px #02a9e7 solid;
}
.article h3:before{
	content:'\f3cd';
	color:#02a9e7;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	padding-right:10px;
}

.entry-title{
	position:relative;
	text-align:center;
	padding-bottom:30px;
	border-bottom:2px #02a9e7 dotted;
}
.entry-title:before{
	content: '';
	display: block;
	width:230px;
	height:180px;
	margin:0 auto;
	background-image: url(https://spmobile.shop/wp-content/uploads/2023/12/midasi1.png);
	background-size: contain;
	vertical-align: middle;
}

/* ボタン----------------- */
.wp-image-254,
.wp-image-256{
	border-radius:5px;
	transition:0.3s;
	box-shadow:0 5px 10px #7b9dab;
}
.wp-image-254:hover,
.wp-image-256:hover{
	opacity:0.7;
	box-shadow:0 5px 20px #7b9dab;
}

.contactbtn-box{
	display:flex;
	align-items:center;
}
.contactbtn{
	display:block;
	text-decoration:none;
/* 	background:#02a9e7; */
	padding:20px;
	color:#fff;
	width:50%;
	margin:20px;
	text-align:center;
	transition:0.2s;
	font-size:1.2em;
	border-radius:5px;
}
.contactbtn span{
	display:block;
	font-size:0.8em;
}

.linkbtn{
	border-radius:5px;
	text-decoration:none;
	padding:10px;
	display:block;
	color:#fff;
	background:#02a9e7;
	text-align:center;
	max-width:350px!important;
	transition:0.2s;
	margin:0 auto;
}
.linkbtn:hover,
.contactbtn:hover{
	transform:scale(1.05);
	color:#fff;
}

/* トップ--------------------------- */
.sct{
	position:relative;
	padding:60px 0;
}
.sct:before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100vw;
	margin: 0 calc(50% - 50vw);
	z-index:-1;
}
.about:before{
	background:#f5f5f5;
}

.cnt{
	position:relative;
	padding:20px 0;
}
.cnt2:before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100vw;
	margin: 0 calc(50% - 50vw);
	z-index:-1;
	background:#f5f5f5;
}

/* サービス */
.service-inr{
	text-align:center;
	font-size:1.1em;
}
.service-inr p{
	color:#02a9e7;
	margin-bottom:0!important;
}
.service-inr a{
	display:block;
	text-decoration:none;
	color:#333;
	padding:10px;
	transition:0.3s;
	box-shadow:0 0 10px #999;
}
.service-inr a:hover{
	color:#333;
	opacity:0.6;
}

/* 買取について------------------------ */
[class*="is-style-sticky-"] {
	border-width: 0 0 0 5px;
}

.is-style-numeric-list-enclosed > li::before {
	background-color:#26c1fc;
}

/* 料金表----------------- */
.wp-block-table thead {
  border-bottom:initial;
}
.price th{
	background:#abe1ff;
}
.price td{
	border:initial;
	border-bottom:2px #adadad dotted;
}
.price tr td:first-child{
	width:50%;
}
.price tr td:last-child{
	width:20%;
}
.price tr td:nth-child(2),
.price tr td:last-child{
	text-align:right;
}
.faq-item-label {
	margin-right:auto;
}
.is-style-accordion .faq-question{
	background:#5fbcf5;
	color:#fff;
	text-shadow:0 0 10px #0b698c;
	border-radius:3px;
	padding: 0.7em;
	box-shadow:0 5px 0 #3e90c2;
	transition:0.4s;
}
.is-style-accordion .faq-question.active{
	box-shadow:0 0 0 #187ab8;
	transform:translatey(-3px);
}
.is-style-accordion .faq-question::before{
	opacity:1;
	font-size:2em;
}
/* .faq-answer.faq-item{
	border-bottom:2px solid #5fbcf5;
} */

.is-style-accordion .faq-answer {
  padding: 1em 0;
}

/* 会社概要---------------------------- */
.about td{
	border:initial;
	border-bottom:2px #adadad solid;
	font-size:1em;
}
.about tr td:first-child{
	border-bottom:2px #78d7fa solid;
}

/* お問い合わせ---------------------------- */

select{
	background:#fff;
}

table tr:nth-of-type(2n+1) {
	background-color: initial;
}
.wpcf7 .wpcf7-submit:disabled{
	background:#fff;
	color:#707070;
	border:solid 1px #cfcfcf;
}
.wpcf7 .wpcf7-submit:disabled:hover{
	background:#fff;
	color:#707070;
	opacity:1;
	border:solid 1px #cfcfcf;
}
.wpcf7 .wpcf7-submit{
	margin:10px 0;
	background:#02a9e7;
	border:solid 2px #02a9e7;
	color:#fff;
	font-size:1.2rem;
	transition:0.3s;
	border-radius:5px;
}
.wpcf7 .wpcf7-submit:hover{
	border:solid 2px #02a9e7;
	background:#fff;
	color:#02a9e7;
}
.required,.optional{
	font-size:14px;
	margin-left:10px;
	padding:0px 5px 2px;
}
.formitem .required{
/* 	border-bottom:#f06565 solid 1px; */
	color:#f06565;
}
.formitem .optional{
/* 	border-bottom:#5e94db solid 1px; */
	color:#5e94db;
}
#booking-form .required{
	background:none;
}
.wpcf7-form-control{
	margin-top:5px;
}
input[type="submit"], #bbp_reply_submit, .bp-login-widget-register-link a {
	padding: 16px;
}
.contact-btn{
	display:flex;
	align-items:center;
}
.contact-btn div{
	width:50%;
	padding:5px;
	margin-bottom:0;
}
.wpcf7-previous{
	background:#b0b0b0;
	border:solid 1px #b0b0b0;
	color:#222;
	font-size:1.2rem;
	transition:0.3s;
	border-radius:5px;
	cursor:pointer;
	display:block;
	width:100%;
	font-size:1.2rem;
	padding:16px;
	font-family: 'Noto Serif JP', serif;
	margin-bottom:30px;
	margin-top:0;
}
.wpcf7-previous:hover{
	opacity:0.7;
}
.formitem th,.formitem td{
	border:initial;
	border-top:dotted 1px #707070;
	border-bottom:dotted 1px #707070;
	background:initial;
}
.formitem th{
	text-align:left;
	width:35%;
/* 	border-right:solid 1px #707070; */
}

.formitem p{
	margin-bottom:0!important;
}



.sp{
	display:none;
}

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

	.header-container{
		display:none;
	}

	.menu-drawer{
		margin-top:20px;
	}
	.menu-drawer li a{
		padding:10px;
		border-bottom:1px #333 dotted;
	}

	.navi-menu-button,
	.search-menu-button{
		color:#02a9e7;
	}


}

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

	.pc{
		display:none;
	}
	.sp{
		display:block;
	}

	.formitem th,.formitem td{
		display:block;
		width:100%;
		border:initial;
	}
	.formitem th{
		padding-top:30px;
	}

	.about td{
		display:block;
		width:100%;
	}
	.about tr td:first-child{
		font-weight:bold;
		color:#02a9e7;
		border-bottom:initial;
	}


	.contactbtn-box{
		display:block;
	}
	.contactbtn{
		padding:20px;
		width:100%;
		margin:0 0 20px;
	}

	.navi-footer-in > .menu-footer li.menu-item{
		display:block;
		width:100%;
	}
	.navi-footer-in > .menu-footer li.menu-item a{
		padding:5px;
		border-bottom:1px #fff dotted;
	}

	.menu-drawer li a:hover{
		background:initial;
		color:#02a9e7;
	}



}

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

}