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

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

/*モバイルヘッダー部分*/
.sticky{
	display: none;
}
.slicknav_menu{
	display: none;
}
/*htmlタグ*/
html{
	margin-top: 0;
}
/*bodyタグ*/
body{
	background: #000;
	color: #fff;
}
/*ヘッダー*/
.header{
	height:auto;
}
/*ヘッダーロゴ*/
.header-container-in.hlt-top-menu.hlt-tm-small .logo-header img {
    max-height: 200px;
    position: relative;
    bottom: 81px;
}
/*グローバルメニュー*/
#header-container-in{
	height: 120px;
	width: 100%;
}

.header-container-in.hlt-top-menu .navi {
    width: 45%;
	position: relative;
    right: 100px;
}

.navi-in > ul{
	flex-wrap: nowrap;
}

/*グローバルメニュー sticky*/
#header-container{
	position: sticky;
	top: 0px;
	z-index: 9999;
}

/*グローバルメニュー下線*/
#header-container-in{
	border-bottom: solid 1.5px var(--cocoon-white-color);
}
/*ヘッダー下線*/
.border-b{
	border-bottom: solid 1px #fff;
}

/*mainタグ*/
#main{
	background: #000;
}
/*フロントページ_メイン2カラム*/
.mt-5{
	margin-top:80px !important;
}

/*フッターホバー*/
#footer a:hover{
	background: none;
}

/*フッターロゴ*/
/* .footer-bottom-logo img{
	height: 200px;
	position: relative;
	right: 40px;
    top: 170px;
} */
.footer-bottom-logo img{
	display:none;
}

/*フッターコピーライト（テーマ元々のコピーライト）*/
.source-org.copyright{
	display: none;
}

/*フッターカラム左側*/
.f-container{
	display: grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
	width: 80%;
    margin: 0 auto;
    gap: 4rem;
/* 	grid-column: span 3/span 3; */
}
.f-letter{
	position: relative;
    top: -70px;
}
.f-logo{
	position:relative;
	left: -110px;
}
.f-logo > a > img{
	width: 430px;
	height: 200px;
}
.f-charactar{
	position: relative;
	top: -70px;
}
/*フッターカラム右側*/
.f-rightside{
	display: grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
/* 	grid-column: span 3/span 3; */
	margin-bottom :20px;
}
/*フッターメールフォーム*/
.px-2{
	padding-left: .5rem;
    padding-right: .5rem;
	border-width: 2px;
	border-radius: 9999px !important;
	display: flex;
	margin-top: 1rem;
}
.h-12{
	width: 100%;
	height: 3rem;
	border-radius: 9999px !important;
	background-color: rgb(1 1 22/var(--tw-bg-opacity));
}
[type=button], [type=reset], [type=submit], button {
	-webkit-appearance: button;
	background-color: transparent;
	background-image: none;
}
[role=button], button {
    cursor: pointer;
}
button{
	font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
	border: 0 solid;
	position: relative;
	top: 5px;
    right: 34px;
}

/*フッター下線*/
.f-container{
	border-bottom: solid 2px #fff;
}
/*フッター下線コピーライト部分*/
.fc-container{
	display: flex;
/* 	justify-content: space-between; */
/* 	grid-template-columns: repeat(3,minmax(0,1fr)); */
	width: 80%;
    margin: 0 auto;
	padding: 20px 0px;
    gap: 4rem;	
	font-size: 15px;
	overflow-x: hidden !important;
}
/*フッターコピーライト*/
.f-copyright{
	text-align: center;
}
/*フッタープライバシー*/
.f-privacy{
	display: flex;
	margin: 0px 25px;
	margin: 0 auto;
/* 	margin-left: 140px; */
}
/*フッターSNSアイコン*/
.f-sns-icon{
	display: flex;
}
.f-sns-icons{
	display: flex;
/* 	justify-content: space-between; */
	margin: 0 auto;
	height: 24px;
    width: 24px;
	margin: 0px 8px;
/* 	position: relative;
    left: 40px; */
}
/*サイドバー*/
.sidebar{
	background: #000;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
/*モバイルヘッダー部分*/
	.sticky{
		display: block;
		position: sticky;
		top: 0;
		height: 124px;
		box-sizing: border-box;
		z-index: 9999;
    	background: #000;
	}
	.mx-auto{
		height: 114px;
	}
	.flex-items-center{
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 124px;
	}
/*モバイルヘッダー左カラム*/
	.flex-1{
		display: flex;
		position: relative;
		top: 6px;
    	right: 50px;
	}
	.flex-1 > a > img{
		max-width: 100%;
	}
/*モバイルヘッダー右カラム*/
	.my-2{
/* 		margin-right: -.5rem; */
		margin-top: -.5rem;
    	margin-bottom: -.5rem;
	}
/*モバイルヘッダー右カラム_ボタン*/
	.mt-3{
		padding-left: 1.25rem;
		padding: .5rem;
		width: 50px;
	}
	[type=button], [type=reset], [type=submit], button {
		-webkit-appearance: button;
		background-color: transparent;
		background-image: none;
	}
	
	[role=button], button {
		cursor: pointer;
	}
	
	button, select {
		text-transform: none;
	}
	.mt-2.5 > svg > path{
		--cocoon-white-color: 1;
    	color: rgb(255 255 255/var(--cocoon-white-color));
	}
/*モバイルヘッダー_ドロップダウン*/
/* 	#menu{
		
	} */
	.mt-2{
/* 		display: none; */
/* 		display: flex; */
		position: absolute;
		overflow-x: hidden;
		width: 0;
		background: #000;
	}
	.flex-dropdown{
/* 		display: flex; */
		display: none;
	}
	.i-dropdown{
		position: relative;
		top: -37px;
    	right: 70px;
		width: 300px;
	}
	.open-menu{
		width: 100%;
		padding-top: 1.25rem;
		padding-bottom: 1.5rem;
		padding-left: 1.25rem;
    	padding-right: 1.25rem;
		height:360px;
/* 		top: 130px; */
	}
/*モバイルヘッダードロップダウン_閉じるボタン*/
	.mr-4{
		margin: 0 0 0 auto;
		position: relative;
		left: 15px;
		height: 20px;
		text-align: right;
	}
	.mr-4 button{
		width: 40px;
	}
/*モバイルドロップダウン*/
	.m-dropdown{
		position: relative;
		top: 20px;
    	bottom: 0px;
    	left: 30px;
	}
	.grid{
		display: grid;
		grid-template-columns: repeat(2,minmax(0,1fr));
		row-gap: 1rem;
		column-gap: 2rem;
	}
	.close-menu{
		width: 0;
	}
	
/*ヘッダーロゴ*/
	.site-logo-image.header-site-logo-image{
		position: relative;
		top: -110px;
		left: -300px;
	}
/*ヘッダーモバイルボタン*/
/* 	.slicknav_menu{
		background: #000;
		position: sticky;
		top: 0;
		z-index: 10000;
	} */
	#header-container{
		display: none;
	}
	.slicknav_btn{
		background: #000;
	}
	.slicknav_menu .slicknav_menutxt{
		display: none;
	}
	.slicknav_nav{
		display: flex;
	}
/*ヘッダーモバイルメニュー*/
	#header-container-in{
		height: 30px;
	}
/*フッターカラム部分*/
	.f-container{
		display: block;
	}
/*フッターコピーライト部分*/
	.fc-container{
		display: block;
	}
	.f-copyright{
		text-align:center;
	}
	.f-privacy{
		margin: 0 auto;
		justify-content: center;
	}
	.f-sns-icon{
		display: flex;
		justify-content: center;
	}
/* 	.f-sns-icons{
		margin: 0 auto;
	} */
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	
/*メインコンテンツカラム*/
	.order1 {
		order: 2;
	}
	.order2 {
		order: 1;
	}
	
/*フッターrightside フッターletter*/
	.f-rightside{
		display: block;
	}
	.f-letter{
		top: 0px;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	
/*フッターロゴ*/
	.f-logo{
		left: -85px;
    	bottom: 15px;
	}
	.f-logo > a > img{
		height: auto;
	}

/*フッターコピーライト部分*/
	.f-copyright{
		font-size:9px;
	}
	.f-privacy{
		font-size:9px;
	}
}
/*370px以下*/
@media screen and (max-width: 370px)
 /*必要ならばここにコードを書く*/
.i-dropdown {
    right: 65px;
}