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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.row{
	max-width:62.5rem;/**1100px;**/
	width:100%;
	margin-left: auto !important;
	margin-right: auto !important;
}

body .row>*{
	padding-right:0px; 
	padding-left:0px;  
}
.container{
	max-width:100% !important
}
#content .wrap{
	width:100%;
	max-width:100%;
}
img.site_logo{
	max-width:10rem !important;
	height:auto !important;
}

.navi-in > ul li{
	width:25% !important;
	height:auto !important;
}

.bg-grey{
	background-color:#F2F0F0;
}
a.bg-d-grey:hover{
	background-color:#A37E38 !important;
	transition:0.5s;
	text-decoration:none;
}
.bg-d-grey{
	background-color:#3A3131 !important;
}
.bg-grey-grd{
	background-image:url(/wp/wp-content/themes/cocoon-master/images/bg_grey_grd.svg);
	background-size:100% calc(100% - 3rem);
	background-position:top;
	background-repeat:no-repeat;
}
.bg-main{
	background-image:url(/wp/wp-content/themes/cocoon-master/images/top_main_bg1.webp);
	background-size:cover;
	background-position:top;
	background-repeat:no-repeat;
}
.bg-contact{
	background-image:url(/wp/wp-content/themes/cocoon-master/images/footer_contact_img.webp);
	background-size:cover;
	background-position:top;
	background-repeat:no-repeat;
}
.bg-white-grd{
	background-image:url(/wp/wp-content/themes/cocoon-master/images/white_grd_img.svg);
	background-size:cover;
	background-position:top;
	background-repeat:no-repeat;
}


.text-sliver{
	color:#F2EBEB;
}
.text-d-yellow{
	color:#51451E;
}
.text-d-red{
	color:#512020;
}
.text-red{
	color:red !important;
	text-decoration:underline !important;
}

body a{
	text-decoration:none;
	color:#212123 !important;

}
body header a:hover,body footer a:hover{
	opacity:0.5;
	transition:0.5s;
	text-decoration:underline;
	color:#F2F0F0;
	background-color:unset !important;
}

body p{
	margin-bottom:0px;
}

.fs-14{
	font-size:0.875rem;
}
.fs-16{
	font-size:1rem;
}

.fs-18{
	font-size:1.125rem;
}

.fs-22{
	font-size:1.375rem;
}
.fs-24{
	font-size:1.5rem;
}
.fs-32{
	font-size:2rem;
}
.fs-36{
	font-size:2.25rem;
}
.fs-40{
	font-size:2.5rem;
}
.fs-48{
	font-size:3rem;
}
.fs-64{
	font-size:4rem;
}
.fs-80{
	font-size:5rem;
}
.max-w-700{
	max-width:43.75rem !important;
	margin:auto;
}

.max-w-150{
	max-width:9.375rem !important;
	margin:auto;
}


.headline{
	font-family: "Cormorant Garamond", serif;
}

.footer-bottom {
    margin-top: 0;
    padding: 0;
    position: relative;
}	

#wpadminbar a{
	color:white !important;
}
.page .date-tags{
	display:none;
}

.google_map{
	aspect-ratio:5/1.75;
	min-height:18.75rem;
}
.footer{
	margin-top:0px;
	padding:0px;
}
ruby{
	ruby-position: under;
}
rt{
	color: #777777;
	font-size:0.875rem;
	padding-top:0.25rem;
}


/**index**/
.main-navigation{
	position:relative;
}

.main-navigation  div.position-absolute{
 	top: 40%;
    left: 10%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

/**privacy**/
ol li::marker{
	font-size:1.375rem;
	color:#512020;
	margin-right:0.5rem;
}
ol ol li::marker{
	font-size:1rem;
}

/* マウスホバー時にさらに上へ引き上げる */
.main-navigation:hover div.position-absolute {
    transform: translateY(-70%);
	transition:0.5s;
}

/* 画像の明るさアップは既存の通り */
.main-navigation:hover img{
	filter: brightness(110%) contrast(90%);
	transition:0.5s;
}

.feather{
	right:-1.5rem;
	bottom:-1.5rem;
	width:8.5rem;
}
.kiban{
	width:15.625rem;
	max-width:50vw !important;
}
@media screen and (max-width: 768px){
	.main-navigation{
		max-height:40vh;
				overflow:hidden;
	}
	
}



/**cocoon**/
.entry-content>*{
	margin-bottom:0;
}

/**inview**/
.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(50px);
    transition: opacity 1s,visibility 1s, transform 1s;
}
.text-fade1,.text-fade2,.text-fade3,.text-fade4,.text-fade5,.text-fade6,.text-fade7,.text-fade8{
	display:inline-block;
}


/**pararax**/

.pararax_outer{
	max-height:240px;
	width:100%;
	overflow: hidden;
}
.pararaxImg{
	width:100%;
	height:auto;

}
#post-9 .pararaxImg2,#post-9 .pararaxImg3{
	margin-top:30px;
}
@media screen and (min-width: 996px){
	.pararaxImg{
	margin-top:-120px;
	margin-left:-120px;
	}
}



/**cf7**/
input[type=text], input[type=password], input[type=date], input[type=datetime], input[type=email], input[type=number], input[type=search], input[type=tel], input[type=time], input[type=url], textarea, select, .search-edit{
	border-top:none !important;
	border-right:none !important;
	border-left:none !important;
	border-radius:0px !important;
}

input[type=submit]{
	background-color:#3A3131 !important;
	color:white;
}

/**bootstrap**/
.border-md-left{
	border-left:solid 2px #36383F !important;
}
.border-left{
	border-left:solid 1px #36383F !important;
}

.border-md-right{
	border-right:solid 2px #36383F !important;
}

@media screen and (max-width: 768px){
	.border-md-left{
		border-left:none !important;
	}
}

.mt-n-4{
	margin-top:-1.5rem !important;
}

/**FontAwesome**/
.fa{
	font-size:1.5rem;
}

/**cookie**/
.cc-window.cc-floating{
	max-width: 18rem;
	font-size:0.9rem;
	padding:1.5rem;
}

@media screen and (max-width: 769px){
	.cc-window.cc-floating{
	max-width:unset;
	width:100%;
	}
	.cc-revoke.cc-right{
		left:0 !important;
		right: unset;
	}
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
@media screen and (max-width: 768px){
	html,body{
		font-size:14.8px !important;
	}
}